来自网络各处的我们正在阅读并有一些想法的内容。有我们应该知道的链接吗？告诉我们！
我们何时应该使用 CSS 网格，何时应该使用 Flexbox？Rachel Andrew 在 遥远的 2016 年 就写过关于这个难题的文章：
Flexbox 本质上用于在一维方向上布局项目 - 在一行或一列中。网格用于在二维方向上布局项目 - 行和列。
Ahmad Shadeed 撰写了一篇博文，他给出了同样的建议，但从不同的角度出发。他认为我们应该使用 网格进行布局，Flexbox 进行组件
请记住，旧的布局方法可能非常适合这项工作。过度使用 Flexbox 或网格可能会随着时间的推移增加 CSS 的复杂性。我并不是说它们很复杂，但是像本文示例中解释的那样，**正确地**并在合适的上下文中使用它们会更好。
说到这里，这篇文章中也有很多很棒的布局示例。
这始终是我在疯狂杂志中最喜欢的东西。一页（我认为是封底的内侧）上覆盖着一幅古怪的插图。您将该页面三折，遮住该图像的中间三分之一，就会形成一幅新的图像，因为插图的设计是为了与这些折叠完美对齐。新图像（和文字！）是笑话的一部分。
每一个都是一个巧妙的技巧，所以当然，我很高兴看到这个技巧进入了 CSS，感谢 Thomas Park。
苹果在昨天的 WWDC20 主题演讲中宣布了一大堆新的更新，从新的硬件到更新的应用程序。有很多值得一看的东西，还有足够的设备羡慕可以四处传递。
但 Safari 14 Beta 版本说明 中有一行引起了我的注意
添加了 WebP 图片支持。
🎉🎉🎉
这是一个简洁的小型库。 它使用 SVG 将手绘风格的注释插入元素（可能是文本），例如下划线和框高亮显示（有 6 种设计选项，所有选项都可配置）。非常聪明。
我记得以前经常搜索在 Photoshop 中制作无缝图案的教程¹。
很高兴看到这个小型网站，它的唯一工作就是构建重复图案。它提供了您期望的所有功能：选择背景，将一些装饰拖放到上面并定位它们（重叠边缘是可以的，这是最难的部分，并且使设计看起来不那么格子化），为它们着色，然后就可以开始了。
这种方法论中最重要的部分是语言本身：CSS。需要注意的是它在名称中存在，因为某些替代方法，例如 BEM（我已经使用多年了）可能会偏离级联样式表。我喜欢CSS，并且认为其核心功能实际上是可扩展 CSS 的**关键**。
最喜欢的一点……
[...] 设计系统不仅让您以**微观层面**思考，还让您以**宏观层面**思考，因为您不仅要做出关于像素的决策，还要做出高级组织决策，而设计系统有助于解决这些决策。设计系统工作实际上很多时候是**外交工作**。
这通常是我看到狭隘的、仅限组件的隧道视野失败的地方，实际上，这些方法更像是**组件库**，而不是设计系统，它们解决的是更窄的一系列问题。
我喜欢从内到外和从外到内的哲学来处理 CSS 的想法 - 集中于为非常小的特定事物设置样式，然后将它们组合在一起以构建更大的事物 - 以及从外到内的哲学 - 不要忘记组件需要以合理的方式组合在一起。
Šime Vidas 介绍了这些伪选择器是什么以及为什么它们会很有用
:is() 用于减少逗号分隔选择器部分的重复¹。:where() 也是一样的，但其中的任何内容都不会影响特异性。包装:where(:not())的示例非常好，因为现在有一种方法可以使用:not()而不会以您可能不希望的方式提高选择器权重。这是一个很棒的案例研究，其中 Ivan Akulov 关注相当流行的写作应用程序 Notion 以及团队如何通过多种方式改进性能；通过代码分割、删除未使用的供应商代码、模块连接以及延迟 JavaScript 执行。不久前，我们为 开始使用 Web 性能 创建了一个列表，但这篇文章更深入地探讨了应用程序方面的内容：确保用户只加载他们需要的 JavaScript，并尽快完成。