投稿日：2025年12月03日 テクノロジー

続・CSSに新たなる変化！

お疲れ様です、原田です。

かなり昔に記載していた、CSSに変化がありましたシリーズ、また新しく出たので連携しようと思います！

今回はかなりタイムリーな12月3日にChrome 143ででた新しい物です

@container anchored(fallback)という新しいクエリが増えています！

これは、配置されている子要素を基準として、様々な要素を設定できる、というものです

一例でいうと、今までJS等で制御していたスクロール変動による要素の変更等を、CSSの子要素がスクロールで画面トップに当たった時にアニメーションを設定する、というようなことが出来るようになっています！

こういった新しいCSSだけで出来る処理が増え、JS依存からどんどん脱却し、Webを軽くしていきましょう！

ちなみに、今回のアップデートで追加されたクエリはまだ3つあるので、お時間があれば検索してさがしてみてください！