7 月新增 Web 平台

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

Rachel Andrew

稳定版浏览器

7 月份，Firefox 103 和 Safari 15.6 开始稳定，因此我们在一些很棒的 CSS 功能方面实现了互操作性。

backdrop-filter 属性

Firefox 103 包含 backdrop-filter 属性，用于对元素后面的区域应用模糊处理等效果。在 Firefox 中使用此值后，这三个引擎现在均可使用此值，但 Safari 需要使用 -webkit 前缀。

浏览器支持

  • 76
  • 79
  • 103
  • 18

来源

scroll-snap-stop 属性

Firefox 还实现了 scroll-snap-stop 属性。通过此属性，您可以控制滚动元素是经过可能的贴靠位置（默认值为 normal），还是必须贴靠到第一个贴靠位置（值为 always）。现在，所有三个浏览器引擎中均包含 scroll-snap-stop 属性。

浏览器支持

  • 75
  • 79
  • 103
  • 15

来源

Safari 15.6 版本主要用于解决问题，但它确实引入了一项包含 :modal 伪类的新 CSS 功能。Firefox 103 中也提供了此功能。:modal 伪类会在元素关闭之前无法与元素外部的所有内容互动时选择该元素。例如，使用 showModal() 打开的 dialog 元素。

浏览器支持

  • 105
  • 105
  • 103
  • 15.6

来源

浏览器测试版

测试版浏览器可让您预览下一个稳定版中所包含的内容。不妨趁此机会，抢先测试可能会对您的网站造成影响的新功能（功能移除或功能移除情况），再面向所有用户发布。

由于发布日期恰好不在当月，因此 6 月份唯一的新 Beta 版是 Firefox 104。

Firefox 104 包含 Web Worker 中的 CSS Font Loading API 和 CSS animation-composition 属性（用于定义在多个动画同时影响同一属性时所使用的合成操作）。

上个月提到的 Safari 16 Beta 版仍在开发中。

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

网络新书系列