此页面由 Cloud Translation API 翻译。

网站平台将于 3 月推出

探索 2022 年 3 月在稳定版和 Beta 版网络浏览器中登陆的有趣功能。

Rachel Andrew

浏览器稳定版

3 月，Chrome 99、Chrome 100、Firefox 98 和 Safari 15.4 成为稳定版。这为平台带来了一批新功能，其中许多新增功能都意味着该功能可用于所有三种浏览器引擎。在这篇博文中，我重点介绍了那些可以跨浏览器实现互操作性的新增功能。不过，请务必查看版本说明，了解添加到每个引擎的所有功能。

Chrome 99 和 Safari 15.4 包含级联层。@layer at-rule 定义了一个级联层，可帮助您控制特异性。由于这些浏览器加入了 Firefox，级联层现在可用于所有三种浏览器引擎。请参阅您的浏览器即将推出级联层，详细了解级联层。

浏览器支持

99
99
97
15.4

来源

Chrome 100 为 CSS mix-blend-mode 属性添加了新值 plus-lighter。当所有或部分像素具有相同的值时，当两个元素交替淡出时，此值非常有用。您可以参阅当前不可能交叉淡入淡出任何两个 DOM 元素，详细了解此方法可以解决的问题。

浏览器支持

Safari 15.4 包含 contain 属性，允许 CSS 包含。

浏览器支持

52 页
79
69
15.4

来源

Safari 15.4 中还有 accent-color，可用于控制在某些表单控件中使用的强调色。

浏览器支持

93
93
92
15.4

来源

Firefox 98 和 Safari 15.4 添加了 <dialog> 元素，代表一个对话框。

浏览器支持

37
79
98
15.4

来源

Safari 15.4 也已完成对 :focus-visible 伪类的支持。这方面的实施工作由 Igalia 完成。

浏览器支持

86
86
85
15.4

来源

Beta 版浏览器版本

通过 Beta 版浏览器，您可以预览浏览器下一个稳定版本的新功能。不妨趁此时机测试一下新功能或内容移除，这些新功能或内容可能会在全球发布之前对您的网站产生影响。

3 月份的新 Beta 版是 Chrome 101 和 Firefox 99。

Chrome 101 Beta 版包含 hwb 颜色表示法。此参数根据色调、白度和黑度指定颜色。与其他颜色表示法一样，可选的 Alpha 分量可指定不透明度。

h1 {
  color: hwb(194 0% 0% / .5) /* #00c3ff with 50% opacity */
}

浏览器支持

来源

Firefox 99 包含导航器界面的 pdfViewerEnabled 属性。此属性指示浏览器是否支持以内嵌方式显示 PDF 文件。

if (!navigator.pdfViewerEnabled) {
  // The browser does not support inline viewing of PDF files.
}

浏览器支持

94
94
99
16.4

来源

这些 Beta 版功能很快就会在稳定版浏览器中推出。

“网络新体验”系列视频的一部分