当世界上最大的 CSS 框架升级到主要版本时，总是值得注意的（它现在处于 alpha 阶段）。

它已放弃 jQuery 和 IE，开始使用一些 CSS 自定义属性，完全自定义表单元素，开始采用实用程序类，并包含一个您可以通过 SVG sprite 使用的大量图标集。太棒了。

一些 WordPress 贡献者目前正在寻找赞助他们改进WordPress 块编辑器（通常称为“Gutenberg”）文档的人，这是您支持他们的机会。

继续阅读 →

来自 Bennett Feely 的大量渐变乐趣：星星、条纹、横幅、爆发……我喜欢能够使用漂亮的图案，要么根本不需要图像请求，要么只需要很少的 SVG。

提醒：Bennett 做各种很酷的事情。我可能使用了Clippy大约一百万次。

新设计的Sidebar非常棒。我喜欢它在粘性元素方面比上一个设计更深入。

但更值得注意的是，Sacha Greif 自 2012 年以来每天都在 Sidebar 发布五个链接。这是一项了不起的成就。

硬停止渐变是我最喜欢的CSS 技巧之一。在这里，Marcel Moreau 将这个想法与 CSS 网格结合起来，解决了一个原本很麻烦的问题。假设您在桌面布局上有一个 300px 的右侧边栏，并具有独特的背景颜色。这很容易。但随后假设您希望该背景颜色延伸到浏览器窗口的右侧边缘，即使网格本身的宽度受限。更棘手。

继续阅读 →

Sara Soueidan 这篇文章的标题引起了我的共鸣。我非常喜欢这样的想法：一些 CSS 最适合全局应用，而一些 CSS 最适合作用域到组件。我对如何完成这件事不太感兴趣，更感兴趣的是看到以某种方式使用这种概念方法。

Sara 详细介绍了一种方法，其中组件默认情况下没有太多样式，但会应用 CSS 自定义属性，如果您选择设置这些属性，它们就可以获取值。

继续阅读 →

关于网络，我经常想到的两件事是有多少种方法可以完成同一件事，以及有多少考虑因素会影响到即使是最简单的事情。

使用包装器元素绝对在这两个列表中。包装器（或容器或其他）非常常见——尤其是在建立网格布局和其内部元素的边界时——因此很容易将其视为理所当然，并在使用它们时不加考虑，不去考虑它们的工作原理、我们使用它们的原因以及如何有效地使用它们。

继续阅读 →

Sarah Higley 有一些 CSS 技巧可以处理 Windows 上的高对比度模式，我了解到它被称为 WHCM。

第一个技巧如下

[…] 如果默认的 CSS outline 属性在 [WHCM 中] 的焦点状态下没有提供您想要的视觉效果，则有一个非常简单的解决方法。不要使用 outline: none覆盖默认的浏览器焦点样式，而是将其设置为透明： outline 3px solid transparent。

这基本上在 WHCM 之外什么也不会做，但在 WHCM 中，它将是一个粗体白色边框，这是一种强烈且良好的视觉焦点样式。

我在 CSS-Tricks 上的一个永远的教训是拥有自己的网站并在上面写博客是个好主意。这可能是我做过的最好的决定之一，因为它一直是乐趣、职业发展和最终收入的直接来源。

我总是对社区中关于写博客再次变得很酷的小声明忍俊不禁。它一直都很酷，我的朋友们。但看到越来越多的人重新拾起它总是好的。

我喜欢 Max Böck 的这篇文章，文章探讨了旧事物如何成为新事物。服务器端渲染！个人网站！写博客！太棒了。

这种 SVG + CSS 动画技巧对我来说就像猫薄荷一样。Mikael Ainalem分享了如何绘制汉堡图标（您非常熟悉的“三条线”），然后通过在 CSS 中控制 SVG 属性以一种令人惊讶且有趣的方式对其进行动画处理。

继续阅读 →