CSSセレクタ ビジュアルガイド

• 一般的なCSSセレクタから、擬似クラスおよび擬似要素までを理解しやすいように視覚的に整理
• セレクタ: universal / element / class / ID / multiple / descendant / adjacent / child / general sibling
• カンマ結合子、lobotomized owl
• 属性と値
• リンク擬似クラスセレクタ
• input 要素: focused / checked / disabled / enabled / valid / invalid / optional
• child: first / last / nth / backward / only-child
• type: first-of / last-of / nth-of / backward / only-of
• target 要素セレクタ
• has() 親セレクタ
• 否定擬似クラス
• 擬似要素: first child / last child / first letter / first line / list marker
• テキスト入力のプレースホルダー / ハイライトされたボックスのスタイル
• そのほか: :root / :is() / :where() / :default / :empty / :fullscreen / :in-range / :out-of-range / :indeterminate / :read-only / :read-write / :lang()

[semjei]

おお、うまく整理されていますね。
すぐ隣の席の新人に共有しました。

下のほうの各種ツールも面白いものが多いですね。
良い資料をありがとうございます。