2024年のCSSの書き方、ワークフローとツールについて

CSSには大きく変わるタイミングが何度かありました。レスポンシブ対応、メディアクエリ、Flexbox、CSS Gridなどはその大きく変わったタイミングでしょう。 そして、2024年もこれらと同様に大きく変わりそうです。CSSのネスト、:has()疑似クラス、subgrid、コンテナクエリ、ビューポート単位などの新機能がすべてのブラウザにサポートされました。 2024年のCSSの書き方として、より保守しやすいCSS、ワークフロー、ツールについて紹介します。 How I'm Writing CSS in 2024 by Lee Robinson 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに デザインの制約 2024年のCSS お勧めのCSSツール 終わりに はじめに 2024年のCSSは、素晴らしいの一言に尽きます。

[coliss]

2024年のCSSの書き方、より保守しやすいCSS、ワークフロー、ツールなど

[monacal]

最近のCSSは本当に便利になったしできることが増えた。その分過去の知識しかない人との乖離が激しい。対象ブラウザの対応状況が〜とか言い訳せずキャッチアップした方がいい。

[Eiichiro]

ここはリスキリング必須の分野だなぁ。昔の最適解と、今の最適解が違いすぎる。

[w_bonbon]

ネイティブCSS-nestingにBEMっぽいセレクタの接続があったら良いのですが〜。 .a { &__b{} }　記法。

[tet00]

CSS

[gerakoma]

css

[yto]

"CSSのネスト、:has()疑似クラス、subgrid、コンテナクエリ、ビューポート単位などの新機能がすべてのブラウザにサポートされました。"

[yarumato]

“SassやLessはもう必要ないかもしれません。”

[tasukuchan]

“その”