2 月份新增 Web 平台

了解我们在 2024 年 2 月在稳定版和 Beta 版网络浏览器中登陆的一些有趣功能。

浏览器稳定版

2024 年 2 月,Firefox 123Chrome 122 成为稳定版。这篇博文介绍了 Web 平台中新增的功能。

声明式 Shadow DOM

Firefox 123 支持 <template> 元素的 shadowrootmode 属性,因此支持声明式 Shadow DOM。此功能现已加入 Baseline 中最新发布,因为它在所有主要浏览器中都可以互操作。

浏览器支持

  • 111
  • 111
  • 123
  • 16.4

103 早期提示:预加载

Firefox 123 包含用于预加载资源的 103 Early Hints 状态代码。

浏览器支持

  • 103
  • 103
  • 123
  • x

对 CSS ::backdrop 继承方式的更改

::backdrop CSS 伪元素是一个与视口大小相同的框,直接呈现在顶层呈现的任何元素下方。::backdrop 的原始规范指出,它不是从任何元素继承的,也不是从任何元素继承的。这意味着 ::backdrop 无权访问 :root 中声明的自定义属性。

规范已更改,以允许 ::backdrop 从其源元素继承属性。此变更在 Chrome 122 中实现。

详细了解 ::backdrop 的更改

Storage 存储分区 API

Chrome 122 包含 Storage Buckets API。借助此 API,网站能够将设备上的数据整理到存储分区中,然后可以单独逐出组数据,而独立于其他存储分区中保存的数据。

如需了解详情,请参阅 Storage Buckets API 文档

浏览器支持

  • 122
  • 122
  • x
  • x

Async Clipboard API:读取未经过排错的 HTML

Chrome 122 Beta 版在 Async Clipboard APIread() 方法中添加了一个 unsanitized 选项,用于检索未经过处理的 HTML 格式。

JavaScript Set 方法

Chrome 122 实现了以下 Set 方法:

这些方法已在 Safari(从 17 版开始)和 Firefox Nightly 中实现。

浏览器支持

  • 122
  • 122
  • 17

来源

Beta 版浏览器版本

Beta 版浏览器可让您预览下一个稳定版本浏览器中将推出的功能。不妨借此机会测试那些可能会在全球发布之前对您的网站造成影响的新功能或移除。新的 Beta 版包括 Firefox 124、本月发布的 Chrome 123 以及 Safari 17.4。 这些版本为平台带来了许多很棒的功能。如需了解所有详细信息,请查看版本说明。这里仅介绍其中的一些亮点。

Chrome 123 包含几项新的 CSS 功能。借助 light-dark() 颜色函数,您可以更轻松地根据用户偏好调整配色方案。field-sizing 属性可启用自动增长的文本输入字段。新增了一项媒体功能,可用于测试在画中画模式下显示的应用。

text-spacing-trim 属性可对中文、日语和韩语 (CJK) 标点符号使用字距调整,以调整多余的空格。如需了解详情,请参阅 CSS 的四项全新国际功能简介

在 Chrome 123 和 Safari 17.4 Beta 版中,支持采用块布局和表格布局的 align-content。了解 align-content 支持的变更。如果您可能在网格或弹性布局之外使用该属性,请测试您的网站,因为在以前,该属性在块布局中不起作用,它将开始导致对齐。

Firefox 124 支持 CSS content-visibility 属性。此属性用于控制某个元素是否渲染其内容,从而允许浏览器在需要相应内容之前不渲染相应内容。