此页面由 Cloud Translation API 翻译。

4 月新增 Web 平台

了解 2022 年 4 月在稳定版和 Beta 版网络浏览器中推出的一些有趣功能。

Rachel Andrew

稳定的浏览器版本

4 月，Chrome 101 和 Firefox 99 成为稳定版。在上个月推出大量功能后，4 月份的更新相对平静，但仍有一些有趣的功能可供我们使用。

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

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

如需详细了解 hwb()，请阅读 Stefan Judis 的这篇文章：hwb() – a color notation for humans?。

Browser Support

Chrome 101 中还推出了 Fetch Priority 功能。这样一来，您就可以使用 fetchpriority 属性向浏览器提示应按什么顺序下载资源。在下面的示例中，低优先级图片用 fetchpriority="low" 表示。

<img src="/images/in_viewport_but_not_important.svg" fetchpriority="low" alt="I'm an unimportant image!">

其他浏览器尚不支持提取优先级，不过您可以立即开始使用，让任何使用基于 Chromium 101 的浏览器的用户受益。

Browser Support

Firefox 99 包含 Navigator 接口的 pdfViewerEnabled 属性。此属性用于指示浏览器是否支持内嵌显示 PDF 文件。

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

Browser Support

Beta 版浏览器可让您抢先体验下一个稳定版浏览器中的功能。在面向全球发布该版本之前，您可以趁此机会测试可能会影响您网站的新功能或移除的功能。

4 月份的新 Beta 版包括 Chrome 102、Firefox 100 和 Safari 15.5。

Chrome 102、Safari 15.5 和 Firefox 预览版包含 inert 属性。如果元素是非交互式的，此属性会将其从标签页顺序和无障碍功能树中移除。例如，当前在屏幕外或处于隐藏状态的元素。

Chrome 102 为 HTML hidden 属性添加了新值 until-found。这样一来，您就可以在网页的折叠区域内的文本中执行网页内查找和滚动到文本片段操作，就像在手风琴模式中一样。如需了解详情，请参阅博文使用 hidden=until-found 使折叠的内容可访问。

Chrome 102 还包含 Local Font Access API，该 API 允许访问用户本地安装的字体。

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