2022 年 7 月に安定版およびベータ版のウェブブラウザでリリースされた興味深い機能をいくつかご紹介します。
安定版ブラウザのリリース
7 月に Firefox 103 と Safari 15.6 が安定版となり、いくつかの優れた CSS 機能の相互運用性が実現しました。
backdrop-filter プロパティ
Firefox 103 には backdrop-filter プロパティが含まれており、要素の背後の領域にぼかしなどの効果を適用できます。Firefox ではこの値により、3 つのエンジンすべてで使用できるようになりましたが、Safari では -webkit 接頭辞が必要です。
scroll-snap-stop プロパティ
Firefox では scroll-snap-stop プロパティも実装されています。このプロパティを使用すると、スクロール要素が可能なスナップ位置を通過するか（デフォルト値の normal で）、最初のスナップ位置にスナップする必要があるか（値 always で）を制御できます。scroll-snap-stop プロパティは 3 つのブラウザ エンジンすべてで使用できるようになりました。
Safari 15.6 は主に問題の解決に特化してリリースされましたが、:modal 疑似クラスを含む新しい CSS 機能が 1 つ追加されました。この機能は Firefox 103 にも実装されました。:modal 疑似クラスは、その要素を閉じるまでその要素外のすべてを操作できない要素を選択します。たとえば、showModal() で開いた dialog 要素です。
ベータ版ブラウザのリリース
ベータ版ブラウザのバージョンでは、次の安定バージョンのブラウザのプレビュー機能が提供されます。この機会に、自分のサイトがリリースされる前に新しい機能や削除をテストすることをおすすめします。
リリース日が月末に入らないため、6 月にリリースされた新しいベータ版は Firefox 104 のみとなりました。
Firefox 104 には、Web Worker の CSS Font Loading API と、複数のアニメーションが同じプロパティに同時に影響を与える場合に使用される合成オペレーションを定義する CSS animation-composition プロパティが含まれています。
先月お知らせした Safari 16 のベータ版も現在も継続中です。
これらのベータ版機能は、まもなく安定版のブラウザに実装される予定です。