弊社ではデザイナーがCSSを書いてくれるので、私はフロントエンドエンジニアながら最近はTypeScriptばかり書いていました。 しかし、フロントエンドエンジニアならCSSもしっかり学んでおかないといけないと思い、アウトプットついでにこの記事を書いています。 1. モダンCSSの現状と進化 2019-2024年に標準化された主要な機能 2019年以降、CSSには多くの革新的な機能が標準化され、JavaScriptに頼らずに実現できることが増えました。 レイアウト関連: コンテナクエリ - 親要素のサイズに基づくレスポンシブデザイン CSS Grid(サブグリッド) - ネストされたグリッドが親グリッドのトラックを継承 CSS ネスト - セレクタを入れ子構造で記述(Sassのような書き方) セレクタと制御: 親要素セレクタ (:has) - 子要素に基づいて親要素を選択 カスケードレイヤー
