個人的な備忘録を兼ねて。
CSSS3 の疑似セレクタを含めた一覧表を掲載しておきます。
有事の際にご利用ください。
セレクタパターン | 意味 | セレクタの種類 | CSSレベル |
---|---|---|---|
* | すべての要素を対象にするセレクタ | ユニバーサルセレクタ | 2 |
E | E要素に対してスタイルを適用 | タイプセレクタ | 1 |
E[foo] | foo属性を持つE要素に対してスタイルを適用 | 属性セレクタ | 2 |
E[foo="bar"] | barという値のfoo属性を持つE要素に対してスタイルを適用 | 属性セレクタ | 2 |
E[foo~="bar"] | barという値を1つでも含んでいるfoo属性を持つE要素に対してスタイルを適用 | 属性セレクタ | 2 |
E[foo^="bar"] | barという値から始まるfoo属性を持つE要素に対してスタイルを適用 | 属性セレクタ | 3 |
E[foo$="bar"] | barという値で終わるfoo属性を持つE要素に対してスタイルを適用 | 属性セレクタ | 3 |
E[foo*="bar"] | barという文字列を含むfoo属性を持つE要素に対してスタイルを適用 | 属性セレクタ | 3 |
E[hreflang|="en"] | en(言語)という値のhreflang属性をもつE要素に対してスタイルを適用 | 属性セレクタ | 2 |
E:root | ドキュメント内のルート要素である E という要素にスタイルを適用(HTMLの場合はhtml) | 擬似クラス | 3 |
E:nth-child(n) | 親要素の n 番目の子要素である E 要素にスタイルを適用 | 擬似クラス | 3 |
E:nth-last-child(n) | 親要素の 最後から数えてn番目の子要素である E 要素にスタイルを適用 | 擬似クラス | 3 |
E:nth-of-type(n) | 兄弟関係にある n 番目の E 要素にスタイルを適用 | 擬似クラス | 3 |
E:nth-last-of-type(n) | 兄弟関係にある 最後から数えてn 番目の E 要素にスタイルを適用 | 擬似クラス | 3 |
E:first-child | 親要素の最初の子要素である E 要素にスタイルを適用 | 擬似クラス | 2 |
E:last-child | 親要素の最後の子要素である E 要素にスタイルを適用 | 擬似クラス | 3 |
E:first-of-type | 兄弟関係にある最初の E 要素にスタイルを適用 | 擬似クラス | 3 |
E:last-of-type | 兄弟関係にある最後の E 要素にスタイルを適用 | 擬似クラス | 3 |
E:only-child | 親要素の唯一の(兄弟関係を持たない) 子要素であるE要素にスタイルを適用 | 擬似クラス | 3 |
E:only-of-type | 兄弟関係にあるE要素にスタイルを適用 | 擬似クラス | 3 |
E:empty | テキストノードも含めて子要素を持たないE要素にスタイルを適用 | 擬似クラス | 3 |
E:link | 未訪問のハイパーリンクのソースのアンカーであるE要素にスタイルを適用 | リンク擬似クラス | 1 |
E:visited | 訪問済みハイパーリンクのソースのアンカーであるE要素にスタイルを適用 | リンク擬似クラス | 1 |
E:active | クリックなどでアクティブになったE要素にスタイルを適用 | ダイナミック擬似クラス | 1 |
E:hover | マウスポインタで指し示されたE要素にスタイルを適用 | ダイナミック擬似クラス | 1 |
E:focus | タブキーなどでフォーカスされているときのE要素にスタイルを適用 | ダイナミック擬似クラス | 2 |
E:target | 参照URIの目標であるE要素にスタイルを適用 | ターゲット擬似クラス | 3 |
E:lang(fr) | 前方一致で fr という lang 属性値を持つE要素にスタイルを適用 | 言語擬似クラス | 2 |
E:enabled | 有効な (:enabled)E要素にスタイルを適用 | UI 要素状態擬似クラス | 3 |
E:disabled | 無効な (:disabled)E要素にスタイルを適用 | UI 要素状態擬似クラス | 3 |
E:checked | ラジオボタンあるいはチェックボックスがチェックされた状態のときにE要素にスタイルを適用 | UI 要素状態擬似クラス | 3 |
E::first-line | E要素の最初の 1行にスタイルを適用 | 擬似要素 | 1 |
E::first-letter | E要素の最初の 1文字にスタイルを適用 | 擬似要素 | 1 |
E::selection | ユーザが選択したE要素の一部にスタイルを適用 | 擬似要素 | 3 |
E::before | E要素の内容の前にスタイルを適用 | 擬似要素 | 2 |
E::after | E要素の内容の後にスタイルを適用 | 擬似要素 | 2 |
E.warning | warningというクラス名を持つE要素にスタイルを適用 | クラスセレクタ | 1 |
E#myid | myidというID名を持つE要素にスタイルを適用 | IDセレクタ | 1 |
E:not(s) | sでないセレクタを持つE要素にスタイルを適用 | 否定擬似クラス | 3 |
E F | E要素と孫子関係にあるF要素にスタイルを適用 | 子孫セレクタ | 1 |
E > F | E要素と直接の子関係にあるF要素にスタイルを適用 | 子セレクタ | 2 |
E + F | E要素と弟関係にあるF要素にスタイルを適用 | 隣接セレクタ | 2 |
E ~ F | E要素が前にあるF要素にスタイルを適用 | 間接セレクタ | 3 |