去年 的 CSS 现状调查产生了有趣的结果。例如，calc() 和 CSS 自定义属性等功能的快速采用。还有压倒性的观点认为，即使我们看到越来越依赖 CSS-in-JS，编写 CSS 很有趣。我们还看到了一些可预测的结果，例如VS Code 作为首选代码编辑器的普及，Flexbox 作为布局模型的主导地位，以及 BEM 和 Sass 成为采用率最高且满意度最高的技术。

继续阅读 →

Lea 有话要说:

浏览webcomponents.org上的组件让我感到焦虑，而且我非常乐意编写 JS——我以编写 JS 为生！那些不会写 JS 的人有什么希望呢？使用目录中的自定义元素通常需要先进行 npm 小号、导入小丑鞋、构建 quux 等仪式，完全毫不掩饰，因为“这是我的卡车装满的依赖项，是的，怎么样”。许多步骤甚至被省略了，可能是因为它们“显而易见”。

继续阅读 →

Danielle Romo 涵盖了当您有一个带有 <input type="radio"> 花哨样式的冗长 <label> 时所需的 HTML 模式。

诀窍？包含您希望读取的标签的旧 <span class="hidden-visually"> 和一个带有仅视觉内容的 <span aria-hidden="true">。

继续阅读 →

如果您曾经想过，天哪，我想拥有这个 CSS 选择器的抽象语法树 (AST)，Lea 就在为您提供支持。

如果您曾经对整个 CSS 文件有过同样的想法，那就是PostCSS，它已经发布了v8版本。请记住，PostCSS 本身什么也不做。它只是从 CSS 中生成 AST 并提供插件接口，以便可以编写插件来使用它转换 CSS。并不是说 PostCSS 不好，但有趣的是，说“我们使用 PostCSS”并不像“我们使用 Sass”那样有意义。

我觉得 Jerod Santo 确实理解了我在编织的网络中试图表达的意思，当时我试图涵盖新兴的 WordPress（“与”）Jamstack 对话。

如果你问埃尔·杜德里诺你是否应该使用 Jamstack，他可能会告诉你，“这是一个复杂的情况。很多进进出出。很多这样那样的东西。很多线索需要记在脑子里，伙计。”

继续阅读 →

作为网页技巧的鉴赏家，这是必须分享的

POW 代表打包的脱机/联机网页。事实证明，png 格式包含在图像文件旁边保存元数据的方法。powfile 具有包含包含完整网站的 zip 文件的元数据条目。

因此，一个 PNG 文件可以包含一个包含多个资源的完整网站。太神奇了。这个概念是开源的。

Amber Wilson 关于制作书签来帮助自己。她展示了一个注入辅助功能脚本的书签——我喜欢这种方法，因为它意味着您不必维护书签，只需维护它链接的脚本即可。另一个示例运行直接包含在链接中的某些代码。结果实际上是您浏览器中的一个书签，您可以单击它来执行对您在任何网站上都有用的操作。

继续阅读 →

JavaScript 有一个（较新的）名为可选链的功能。假设我有如下代码

const name = Data.person.name;

如果 Data 上碰巧不存在 person，我将收到一个硬性的、停止执行的错误。使用可选链，我可以编写

const name = Data.person?.name;

继续阅读 →

这里有一个重要的细节：**它是免费的！**

Jamstack 大会虚拟版将于 2020 年 10 月 6 日和 7 日举行。会议安排在 10 月 6 日。这是免费的部分（在此注册）。然后在 10 月 7 日，将举办各种研讨会（在我看来，它们都非常棒），每个研讨会 100 美元。这是经典的会议一加一组合拳。会议是为了全面了解正在发生的事情，并且很可能会让您了解一些新概念；研讨会是为了深入学习并掌握一些新技能。

继续阅读 →

来自 Bennett Feely 的超级酷的项目！它将任何网页字体变成 3D 字体，并带有鼠标悬停效果，可以在空间中移动 3D 对象。它让人想起Zdog，但适用于字体。它通过将字形的许多副本堆叠在一起并通过一些 translateZ 进行偏移来实现其魔力，然后在父元素上使用一些透视和 rotateX/rotateY 来执行交互式操作。

效果非常有趣。我不敢相信费雪还没有在整个网站上实施它。

继续阅读 →