2 月份新增 Web 平台

了解 2025 年 2 月已发布在稳定版和 Beta 版网络浏览器中的部分有趣功能。

Rachel Andrew

发布时间：2025 年 2 月 28 日

稳定版浏览器

2025 年 2 月，Firefox 135 和 Chrome 133 变为稳定版。本文将介绍 Web 平台中新增的功能。

检查 WebAuthn 功能

Firefox 135 和 Chrome 133 都添加了对 PublicKeyCredential.getClientCapabilities() 静态方法的支持。这样，您无需使用浏览器嗅探即可检查浏览器是否支持 Web Authentication API 的功能。

Browser Support

  • Chrome: 133.
  • Edge: 133.
  • Firefox: 135.
  • Safari: 17.4.

Source

Firefox 135 还包含带来源提案的 JSON 解析中的功能：JSON.parse reviver 参数 context 参数、JSON.isRawJSON() 和 JSON.rawJSON()。

Browser Support

  • Chrome: 114.
  • Edge: 114.
  • Firefox: 135.
  • Safari: not supported.

Source

popover 属性的提示值

Chrome 133 为 popover 属性添加了第三个值：popover="hint"。提示通常与“提示”类型的行为相关联，但行为略有不同。现在，您可以在一组现有自动弹出式窗口保持打开状态时打开不相关的提示弹出式窗口。

规范示例是，<select> 选择器处于打开状态 (popover="auto")，并显示了悬停触发的提示 (popover="hint")。该操作不会关闭 <select> 选择器。

Browser Support

  • Chrome: 133.
  • Edge: 133.
  • Firefox: not supported.
  • Safari: not supported.

如需了解详情，请参阅弹出式窗口 = 提示。

CSS 高级 attr() 函数

Chrome 133 中新增了一系列 CSS 功能。此版本的 Chrome 包含 CSS 级别 5 中指定的 attr() 增强功能，该功能允许使用 <string> 以外的类型，并可在所有 CSS 属性中使用（除了对伪元素内容的现有支持之外）。

Browser Support

  • Chrome: 133.
  • Edge: 133.
  • Firefox: not supported.
  • Safari: not supported.

如需了解详情，请参阅 CSS attr() 已升级。

CSS 滚动状态容器查询

此外，在 Chrome 133 中，您还可以使用容器查询根据容器的滚动状态设置容器的后代样式。

查询容器是滚动容器，或者是受滚动容器滚动位置影响的元素。您可以查询以下状态：

  • stuck：固定定位的容器会粘附在滚动条的某个边缘。
  • snapped：滚动贴靠对齐的容器目前处于水平或垂直贴靠状态。
  • scrollable：滚动容器能否在查询的方向滚动。

container-type 还有一个新值：scroll-state，可用于查询容器。

Browser Support

  • Chrome: 133.
  • Edge: 133.
  • Firefox: not supported.
  • Safari: not supported.

如需了解详情，请参阅 CSS scroll-state()。

CSS text-box、text-box-trim 和 text-box-edge

Chrome 133 的 CSS 中还新增了 text-box-trim 和 text-box-edge 属性以及 text-box 缩写属性，这些属性可让您更精细地控制文本的垂直对齐方式。

Browser Support

  • Chrome: 133.
  • Edge: 133.
  • Firefox: not supported.
  • Safari: 18.2.

详细了解此实用属性在 CSS text-box-trim 中的运作方式。

保留 DOM 状态的移动

Chrome 133 添加了 DOM 基元 (Node.prototype.moveBefore)，让您可以在 DOM 树中移动元素，而无需重置元素的状态。

移动（而非移除和插入）时，系统会保留以下状态：

  • <iframe> 元素会保持加载状态。
  • 活动元素保持焦点。
  • 弹出式窗口、全屏窗口和模态对话框会保持打开状态。
  • CSS 过渡和动画会继续。

Browser Support

  • Chrome: 133.
  • Edge: 133.
  • Firefox: not supported.
  • Safari: not supported.

FileSystemObserver 接口

Chrome 133 中添加的 FileSystemObserver 接口会通知网站文件系统发生的更改。网站会监控用户之前已授予权限的文件和目录在用户的本地设备或存储分区文件系统（也称为来源私有文件系统）中的更改，并会收到更改类型等基本更改信息的通知。

Browser Support

  • Chrome: 133.
  • Edge: 133.
  • Firefox: not supported.
  • Safari: not supported.

Beta 版浏览器

通过浏览器 Beta 版，您可以抢先体验下一个稳定版浏览器中即将推出的功能。在该版本面向全球发布之前，您可以先测试可能会影响您网站的新功能或移除的功能。新版 Beta 版为 Firefox 136、Safari 18.4 和 Chrome 134。这些版本为该平台带来了许多出色的功能。如需了解所有详情，请参阅版本说明。下面列出了其中的几个亮点。

最新版 Safari Beta 版带来了一系列新增功能和改进，其中一些功能预计会在该浏览器稳定版发布后成为“新基准”功能。例如 writing-mode: sideways-rl 和 writing-mode: sideways-lr、ClipboardItem 的 supports() 静态方法，以及迭代器辅助程序提案中的一系列内容。

Safari 18.4 Beta 版和 Firefox 136 都包含 Cookie Store API，该 API 应该会在两款浏览器发布后成为新版基准。

Firefox 136 包含 :open 和 :has-slotted 伪类，后者也包含在 Chrome 134 中。它还包含 Intl.DurationFormat，该版本应为“新推出的基准”。

Chrome 134 包含可自定义的 <select> 元素、CSS dynamic-range-limit 属性，以及适用于 <dialog> 元素的轻量关闭功能。