Memorandum

最近のCSSで使える新しい技術についてそろそろまとめておきたいという話

目次

浦島太郎化を防ぎたい

IEがなくなって久しく、Webの技術の中でもCSSに関しては本当に便利になっていると思う。

で、ぼちぼち新しい技術の追加状況に付いていけなくなりそうな予感がしている。

とりあえず2022までのはなし

web.devの記事から、2つ。

まとまっとるやんけ!ってなってしまうが、2022年時点で新たにすべてのブラウザで使用可能となった技術たち。

この中でも、2023年に入って使用可能になったものもある。 とくに以下のやつはちゃんとまとめたいし、自分でも使えるようになっておきたい。

  • カスケードレイヤー1
  • コンテナクエリ
  • 色の指定方法の追加分(Level4,5)
    • グラデーションの色空間、コントラストなども
  • 疑似クラス(:has(),:modal,:is(),:where()
  • 三角関数
  • メディアクエリの範囲構文2
  • ネスト可能
  • @scopeによるスタイルのスコープ

IEのサポートなんて前々からしてなかったけど、それでも正式にサポート切れたことで一気に新技術が広まっている感があり、とても良いと思う。 あとは僕が置いて行かれないように努力するだけだと思った。

以下はここで羅列しておくだけにして個別に書かなくても良いかなってやつ。

以上、そのうち追加でなんか書く。

Footnotes

  1. 参考: カスケードレイヤー - ウェブ開発を学ぶ | MDN

  2. 敢えて書くまでないかもしれんけど…… メディアクエリーの使用 - CSS: カスケーディングスタイルシート | MDN

  3. そういえばこのサイトにこれ指定してないの気づいた

  4. いつ使えばいいのこれ……