CSSにそのうち導入されそうな@scopeとその関連概念

気がつけばCSSの@layerが全てのモダンブラウザに実装完了している今日この頃、みなさまはいかがお過ごしでしょうか。 CSSでは、@layerに次ぐ新機能として @scope が検討されています。最近これについて勉強したのですが、これを取り扱う日本語記事が見当たらなかったので今回ご紹介します。 この記事では、CSS Cascading and Inheritance Level 6のFirst Public Working Draftの内容を紹介します[1]。これは去年12月のバージョンで、より新しいEditor's Draftとして今年4月のものがありますが、特に大きな変更はありませんでしたので、この記事の内容が執筆時点の最新情報だと思って差し支えありません。

[mizdra]

へー。to で終端設定できたりと柔軟で面白い。

[hc0001]

CSS Cascading and Inheritance で追加された @scope 記法を使うことで、スタイルの有効範囲を限定できる。詳細度や新たに加わったスコープ近接度についても解説されている。

[t_f_m]

あとで

[tkmkg8m]

なるほどなぁ。Shadow DOM使わないと厳しかった本当のscoped CSSが実現できるかもしれないのか。Shadow DOMは罠も多いので @scope に期待。

[diveintounlimit]

CSSは基本遡らないので、少なくともtoのほうは修正はいるだろうな

[teramako]

HTMLのstyle scopedが廃止されての流れかな？たしかにCSSで書けた方がスマートだね。

[kvx]

はー。へー。