セレクタ・擬似要素・疑似クラス・ルール
メモ 外部リンク セレクタ 一覧 擬似要素 一覧 疑似クラス 一覧 ルール 一覧
メモ
- 大文字・小文字の区別なし
- セレクタを複数要素に適用する場合、カンマ(,)区切り (例:h1, h2 { color: blue; })
- 要素については、HTML5 リファレンス メモ 参照
外部リンク
一覧
| セレクタ | 説明 | |
|---|---|---|
| 汎用セレクタ | * ns|* *|* |* | 全ての要素 |
| タイプセレクタ | E ns|E *|E |E | 全てのE要素 |
| クラス セレクタ | E.classname | クラスにclassnameを指定したE要素 |
| ID セレクタ | E#idname | id属性がidnameのE要素 |
| 属性セレクタ (存在) | E[attr] | attr属性を持つ全てのE要素 |
| 属性セレクタ (完全一致) | E[attr ="value"] | attr属性値がvalueであるE要素 |
| 属性セレクタ (先頭一致) | E[attr ^="value"] | attr属性値がvalueで始まるE要素 |
| 属性セレクタ (末尾一致) | E[attr $="value"] | attr属性値がvalueで終わるE要素 |
| 属性セレクタ (部分一致) | E[attr *="value"] | attr属性値がvalueを含むE要素 |
| 属性セレクタ (リスト項目一致) | E[attr ~="value"] | attr属性値の1つがvalueであるE要素 |
| 属性セレクタ (プレフィックス) | E[attr |="value"] | ハイフンで区切られたattr属性がvalueで始まるE要素 |
| 子孫 結合子 | E F | E要素の子孫のF要素 |
| 子 結合子 | E > F | E要素の子のF要素 |
| 隣接兄弟 結合子 | E + F | E要素の直後の兄弟F要素 |
| 一般兄弟 結合子 | E ~ F | E要素の後の兄弟F要素 |
| 擬似要素 | 説明 | |
|---|---|---|
| コンテンツ直後 | E::after E:after | E要素のコンテンツの直後 |
| コンテンツ直前 | E::before E:before | E要素のコンテンツの直前 |
| 先頭文字 | E::first-letter E:first-letter | E要素の内容の先頭文字 |
| 先頭行 | E::first-line E:first-line | E要素の内容の先頭行 |
| ユーザ選択部分 | E::selection E::-moz-selection | ユーザがマウス等で選択したE要素部分 |
| 疑似クラス | 説明 | |
|---|---|---|
| アクティブ要素 | E:active | アクティブなE要素 |
| チェック要素 | E:checked | チェックされているE要素 (ラジオボタン・チェックボックス等) |
| 使用不可要素 | E:disabled | 使用不可状態のE要素 |
| 空要素 | E:empty | 空のE要素 |
| 使用可能要素 | E:enabled | 使用可能状態のE要素 |
| 印刷先頭ページ | E:first | 印刷時の先頭のページ |
| 先頭子要素 | E:first-child | 親要素の先頭子E要素 |
| 先頭該当子要素 | E:first-of-type | 親要素の先頭該当子E要素 |
| フォーカス要素 | E:focus | フォーカスがあるE要素 |
| ホバー要素 | E:hover | ポインティングデバイスが乗っているE要素 |
| 不確定要素 | E::indeterminate | 不確定状態のE要素 (チェックボックス等) |
| 言語要素 | E:lang(fr) | 言語がfrのE要素 |
| 最終子要素 | E:last-child | 親要素の最終子E要素 |
| 最終該当子要素 | E:last-of-type | 親要素の最終該当子E要素 |
| 印刷左ページ | E:left | 印刷時の左側のページ |
| 未訪問リンク要素 | E:link | 未訪問リンクのE要素 |
| 否定要素 | E:not(s) | sセレクタ以外のE要素 |
| an+b番目の子要素 | E:nth-child(an+b) | 親要素のan+b番目の子E要素 b(単一要素:1~)・an-b・odd(奇数)・even(偶数) の指定も可 |
| 末尾からan+b番目の子要素 | E:nth-last-child(an+b) | 親要素の末尾からan+b番目の子E要素 |
| 末尾からn番目の該当子要素 | E:nth-last-of-type(n) | 親要素の末尾からn番目の該当子E要素 |
| an+b番目の該当子要素 | E:nth-of-type(an+b) | 親要素のan+b番目の該当子E要素 |
| 唯一の子要素 | E:only-child | 親要素の唯一の子E要素 |
| 唯一の該当子要素 | E:only-of-type | 親要素の唯一の該当子E要素 |
| 入力任意要素 | E:optional | 入力必須(required属性)以外のE要素 |
| 入力必須要素 | E:required | 入力必須(required属性)のE要素 |
| 印刷右ページ | E:right | 印刷時の右側のページ |
| 文書のルート要素 | E:root | 文書のルートE要素 |
| リンク先要素 | E:target | リンク先のE要素 |
| 訪問済みリンク要素 | E:visited | 訪問済みリンクのE要素 |
| ルール | 説明 |
|---|---|
| !important | 重要 (優先) |
| @charset | 文字コード |
| @counter-style | リストスタイルカスタマイズ |
| @font-face | Web フォント |
| @font-feature-values | 代替字形 |
| @import | 外部スタイルシートのインポート |
| @keyframes | アニメーションのキーフレーム |
| @media | メディアタイプ |
| @namespace | 名前空間 |
| @page | 印刷ページ |
| @supports | サポート判定 |