2022年のCSS | gihyo.jp

2022年になりました。矢倉眞隆（@myakura）と申します。昨日に続き、新春特別企画のブラウザとウェブ標準動向について紹介します。 取り上げるトピックの数やそのインパクトから、今回はCSSを独立した記事として取り上げることになりました。「ブラウザとウェブ標準動向」についても寄稿していますので、そちらもお読みいただければうれしいです。 2022年以降のCSSは大きく変化しそうだなと思っています。これまでも、CSS3と呼ばれていた機能による表現力の強化、FlexboxやGridなど強力なレイアウト機能の追加など、大きな変化と言えるだろうものはありました。しかし現在提案・実装されている機能は、CSSの根幹を拡充するものと、これまでと性質が異なるものです。 Compat 2021とInterop 2022で互換性の向上 CSSのつらいところとしてまず取り上げられるのが、ブラウザ実装の挙動の違い

[daigo0117]

まずSafariのバージョンをOSのバージョンと紐付けるのをやめて欲しい。

[yarumato]

“セレクタの詳細度より優先されるレイヤー概念を導入。Safariが先行して実装する興味深い機能。直感的な色指定，相対色，混色。ビューポートの最小時や最大時，動的変化を参照する単位，svw/svh，lvw/lvh，dvw/dvh。”

[mizdra]

めちゃめちゃ良い記事だった。Igalia 色々な機能実装していて、堅実に役割を遂行していて凄すぎる。策定中の機能群もゆっくりではあるけど、段々実り始めていて楽しみ。

[igrep]

カスケードレイヤーすごいな

[tkmkg8m]

カスケードレイヤー知らなかったなぁ。 :has() とかコンテナクエリとかも楽しみだ。

[shinagaki]

カスケードレイヤーは上書きできないっていう仕様変更が気になるな。余計複雑になりそう

[furu_ichi]

今年もCSSとはなるべく距離をおいていきたい。直接CSSを書くことはせず、極力フレームワークを利用しようと思う。

[fujibay1975]

コンテナクエリーはよ

[tk0707]

だからそうじゃないのよ。 こっちが福笑いみたいに勝手にカラムを置いて、それを勝手にレスポンシブにしてくれるソースを吐き出してくれることを望んでるわけよ。 それくらい出来ないの？早くしてよ。

[Shinwiki]

頭でっかち

[sezemi]

カスケードレイヤ、よさげ

[kako-jun]

ReactでCSS in TS最強って体験したので、CSSの機能内でスコープを限定するとか、式を書くとか、分岐を表現するとか、全然興味を持てなくなってしまった……

[yaminusi]

:has() は本当早く欲しい。uBlock Origin のフィルタだと既に使えるから尚更。