跳至主要内容
CSS-Tricks
  • 文章
  • 笔记
  • 链接
  • 指南
  • 年鉴
  • 随机
搜索

Links

来自网络的我们正在阅读并有一些想法的东西。 有一个我们应该知道的链接吗? 告诉我们!

全息交易卡效果

🔗 https://deck-24abcd.netlify.app/
阅读评论

Simon Goellner (@simeydotme) 的全息交易卡收藏 吸引了我们的注意力。

在引擎盖下 有一套 filter()、background-blend-mode()、mix-blend-mode() 和 clip-path() 组合,经过精心调整以达到所需的效果。 我最终在 DevTools 中使用了一些 img { visibility: hidden; } 来更好地了解每种全息效果。

Josh Dance (@JoshDance) 回复,并附带了一个 效果分解,允许您手动控制输入。

Manuel Matuzovic:max() 技巧

🔗 https://www.matuzo.at/blog/2022/100daysof-day12/
阅读评论

通过 Manuel Matuzović 的帖子,该帖子来自 Temani Afif 的演示。

.wrapper {
  margin-inline: max(0px, ((100% - 64rem) / 2)); 
}

阅读 Manuel 对这里所有发生的事情的分解,您将对自己有所帮助,但它基本上等效于以下更长的语法

继续阅读 →

2022 年 CSS 状态调查现已开放

🔗 https://stateofcss.com/en-us/?source=css-tricks
阅读评论

CSS 状态调查最近开放。 去年,调查证实了每个人对 TailwindCSS 非常流行 和 CSS 变量已成为主流 的假设。 它还将我们许多人对 CSS 的期望编纂起来,从容器查询到父选择器。(剧透警告,我们现在两者都有。)

虽然我不会说结果每年都非常令人惊讶,但这次我非常激动地开始看到更多历史趋势显露出来。 调查自 2019 年开始,所以这将是四年(在前端年份里很古老!)的数据,可以查看某些框架是来了又走了,特定功能是否正在获得势头,哪些是通用的学习实践,以及更多背景信息。 这些东西需要时间才能积累起来,所以要感谢 Sacha Greif 坚持做这件事。

继续阅读 →

网络现在很好

🔗 https://2022.cascadiajs.com/speakers/chris-coyier
阅读评论

Chris Coyier 在 CascadiaJS 2022 上的演讲 视频 现已发布。 这是他两年多以来的第一次面对面演讲,所以很高兴看到我们这位好朋友回到舞台上,分享关于如今网络的精妙之处。

容器查询!WAAPI!滚动时间线!offset-path!FLIP!可变字体!流畅字体!我们现在真的 全能前端开发人员。

Chris 真的在 25 分钟的时间里塞入了很多东西。 在那短暂的时间里暂停一下,反思一下构建网站的伟大新事物,并庆祝我们能够使用它们,感觉真好。

没有什么比看着 Chris 向整个房间的所有人打招呼,并称他们为“网络极客”更好了。 🤓

CSS 规则与 CSS 规则集

🔗 https://www.impressivewebs.com/css-rules-vs-css-rulesets/
阅读评论

最新规范:

一个 样式规则 是一个合格的规则,它将一个选择器列表与一个属性声明列表和可能的一个嵌套规则列表相关联。 它们在 CSS2 中也称为规则集。

Louis Lazaris:

正如 W3C 的上述引用所示,W3C 似乎认为“规则集”是一个有点过时的术语,更喜欢使用“样式规则”(或者简称为“规则”)。

继续阅读 →

Safari 16.0 中的 WebKit 功能

🔗 https://webkit.org/blog/13152/webkit-features-in-safari-16-0/
阅读评论

哇,Safari 16 正式发布,它包含了许多功能,一些是新的和令人兴奋的(子网格!容器查询!字体调色板!)而另一些是我们一直在等待的,以获得更好的跨浏览器支持(运动路径!过度滚动行为!AVIF!)。 我想象 Jen Simmons 开心地打字,在 汇总公告 中写出所有新功能。

继续阅读 →

iShadeed 的容器查询实验室

🔗 https://lab.ishadeed.com/container-queries
阅读评论

Ahmad Shadeed 早就开始研究容器查询,并且拥有一个基于日常模式的 不断增长的示例集。

继续阅读 →

从 GOV.UK 中删除 jQuery

🔗 https://insidegovuk.blog.gov.uk/2022/08/11/how-and-why-we-removed-jquery-from-gov-uk/
阅读评论

GOV.UK 团队最近发布了“我们如何以及为什么从 GOV.UK 中删除 jQuery”。 这是关于组织如何评估其工具以及某些工具是否仍然是最适合工作的工具的深刻见解。 这不是在敦促您现在就从当前项目中删除库! 我们中的许多人可能仍在支持遗留项目和阻止这成为可行选择的浏览器要求。

继续阅读 →

犯下 CSS 罪行

🔗 https://www.theverge.com/2022/8/3/23288689/cohost-social-media-css-games
阅读评论

CSS-Tricks 的时代已经过去。 现在是 CSS 犯罪的时代!

在当前的内容服务提供商环境中,用户通常只能在文本、链接和图像中表达自己。 清理规则往往会剥离 HTML、JavaScript 和各种属性。

社交媒体服务 Cohost 允许用户比我们通常习惯的具有更大的标记和内联样式自由。 一些用户利用这种自由来犯下 CSS 罪行! 它导致了使用非传统方式的属性,创造性地重新创建了熟悉的界面和交互式游戏。

继续阅读 →

事实上,旧金山字体确实作为可变字体提供

🔗 https://chriscoyier.net/2022/08/02/actually-the-san-francisco-typeface-does-ship-as-a-variable-font/
阅读评论

Apple 在 WWDC 2022 上 发布 了其旧金山系统字体的扩展版本。 然后,上个月,Jim Nielsen 关注了字体的变体,解释 了字体如何根据宽度和粗细提供一系列变体。 如果您还没有查看它,这是一个非凡的阅读体验。

继续阅读 →

Quick Hits

# 2024 年 8 月 21 日
# 2024 年 8 月 14 日
# 2024 年 8 月 14 日
# 2024 年 8 月 12 日
更多快速链接 →
  • 较新
  • 1
  • ...
  • 2
  • 3
  • 4
  • ...
  • 219
  • 较旧

CSS-Tricks is powered by DigitalOcean.

Keep up to date on web dev

with our hand-crafted newsletter

DigitalOcean
  • About DO
  • Cloudways
  • Legal stuff
  • Get free credit!
CSS-Tricks
  • Write for us!
  • Advertise with us
  • Contact us
Social
  • RSS Feeds
  • CodePen
  • Mastodon
  • X
Back to Top

© 2024 . All rights reserved.