セレクタ・擬似要素・疑似クラス・ルール
メモ
- 大文字・小文字の区別なし
- セレクタを複数要素に適用する場合、カンマ(,)区切り (例: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 | サポート判定 |