了解 2023 年 11 月在稳定版和 Beta 版网络浏览器中推出的一些有趣功能。
稳定版浏览器
2023 年 11 月,我们只有一个搭载 Firefox 120 的稳定版浏览器。本文介绍这对 Web 平台意味着什么。
支持 <source>
元素中的 media
属性
Firefox 重新在 <source>
元素中支持 media
属性。我们扩展了该支持,使其包含 <audio>
和 <video>
元素。在此版本中,媒体属性将包含在 <audio>
、<video>
和 <picture>
内的 <source>
元素中。
Safari 即将支持 media
属性,并且 Safari 中也支持该属性,因此您很快会在所有引擎上支持自适应 HTML 视频和音频。
CSS 颜色 light-dark()
函数
Firefox 现在支持 light-dark()
CSS Color 函数。这意味着,您无需使用 prefers-color-scheme
媒体功能,即可为浅色和深色方案设置颜色。
lh
和 rlh
单位
Firefox 支持 CSS 单位 lh
和 rlh
。您可以使用这些单位设置相对于元素行高的值,这在您希望将背景图片与文本对齐时非常有用。此版本使这些模块能够在所有三个主要引擎上实现互操作。
浏览器支持
- 109
- 109
- 120
- 16.4
HTTP 103 早期提示
Firefox 现在支持 103 Early Hints HTTP 信息响应状态代码。
浏览器测试版
Beta 版浏览器可让您预览下一个稳定版本中的功能。这时有必要在面向所有用户发布新版本之前测试可能会影响您的网站的新功能(或内容移除情况)。新的 Beta 版为 Firefox 121、Chrome 120 和 Safari 17.2。这些版本为平台带来了许多出色的功能。如需了解所有详情,请参阅版本说明。以下是几个亮点。
Chrome 120 和 Safari 17.2 包含放宽的 CSS 嵌套解析。
Chrome 120 去除了 -webkit-mask*
属性的前缀,使它们与当前规范保持一致。其中包括 mask-image
、mask-mode
、mask-repeat
、mask-position
、mask-clip
、mask-origin
、mask-size
和 mask-composite
,以及 mask
简写形式。支持本地 mask-image
引用,序列化现在与规范匹配,接受的值现在与规范匹配。
Chrome 120 和 Safari 17.2 支持 <details>
元素的 name
属性。
Firefox 121 包含 CSS :has()
选择器。此版本使 :has()
能够在所有主要引擎上实现互操作。
网络新书系列