Web 平台的新功能(12 月)

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

浏览器稳定版

在 12 月,Firefox 108Safari 16.2 成为稳定版。我们来看看这对网络平台意味着什么。

支持 <source>heightwidth 属性

Firefox 108 支持 <source> 元素的 heightwidth 属性,前提是该元素是 <picture> 元素的子元素。这些属性可接受图片的高度或宽度(以像素为单位),表示没有单位的整数。

浏览器支持

  • 90
  • 90
  • 108
  • 15

三角 CSS 函数

Firefox 现在还支持 CSS 中的三角函数(sin()cos()tan()asin()acos()atan()atan2())。

浏览器支持

  • 111
  • 111
  • 108
  • 15.4

来源

支持所有三个引擎中的最后一个基准

除了多项 CSS 修复,Safari 16.2 还针对 CSS 网格和 Flexbox 布局引入了 last baseline 对齐功能,这意味着目前三种主要浏览器引擎均支持此功能。

CSS font-variant-alternates

Safari 还添加了对 font-variant-alternates CSS 属性的其他值的支持:annotation(value-name)、character-variant(value-name)、装饰(value-name)、styleset(value-name)、stylistic(value-name)、swash(value-name) 以及关联的 @font-feature-values at-rule。

浏览器支持

  • 111
  • 111
  • 34
  • 9.1

来源

Beta 版浏览器版本

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

针对 Safari 16.3 列出的唯一一项新功能是添加内容安全政策 (CSP) prefetch-src 指令。此 Beta 版中也修复了许多问题。

Chrome 109 支持 MathML Core,这是一种用于描述可嵌入 HTML 和 SVG 中的数学符号的语言。

Android 版 Chrome 中新增了安全付款确认 (SPC) 功能。这是一种提议的网络标准,可让客户使用平台身份验证器(通常通过指纹传感器等设备的屏幕解锁功能启用)向信用卡发卡机构、银行或其他付款服务提供商进行身份验证。

Android 版 Chrome 还新增了一项功能,即源私密文件系统 (OPFS),它是 Android 上的 File System Access API 的一部分。这包括所有 File System Access API Surface,但不包括 show{OpenFile, SaveFile, Directory}Picker() 方法和 Drag and Drop API 集成。

对于 Chrome 中的 CSS,我们采用 lh 长度单位。该单位相当于使用它的元素的行高属性的计算值。此外,hyphenate-limit-chars 属性用于指定带连字符的字词中的最少字符数。

在撰写本文时,可能由于正处于节日季,Firefox 版本说明尚未更新。

其他新闻

这是此博文系列的第 12 期。2022 年,我们每个月都会为您介绍一些有趣的内容,内容会每月登陆浏览器。并会在 2023 年再次回来,继续分享每月在 Web 平台上登陆的一些有趣内容。

去年,许多浏览器功能都已推出,其中许多功能都提到了“CSS 修复”,它们都是 Interop 2022 功能的一部分。如需了解详情,请参阅 Chrome 团队关于这项跨浏览器计划的年终报告,以解决 Web 平台上的一些互操作性主要痛点。

最后,本博文的读者感兴趣的内容是这份基于 MDN 浏览器兼容性数据的更新列表,由我们的 MDN 好友发布。

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