CSS 疑似クラス プロパティ 一覧 関数 要素 使い方・書き方 例 CSS サンプル
疑似クラスプロパティ・セレクタ
| CSS プロパティ | 例の説明 要約 | 例 |
|---|---|---|
:active 詳細 情報:active 実例 プロパティ 使い方 コード | :activeとは、アクティブリンクを選択することができる。 | a:active |
:checked 詳細 情報:checked 実例 プロパティ 使い方 コード | :checkedとは、チェックされたすべての <input>要素を選択することができる。 | input:checked |
:disabled 詳細 情報:disabled 実例 プロパティ 使い方 コード | :disabledとは、無効なすべての <input>要素を選択することができる。 | input:disabled |
:empty 詳細 情報:empty 実例 プロパティ 使い方 コード | :emptyとは、子を持たないすべての <p>要素を選択することができる。 | p:empty |
:enabled 詳細 情報:enabled 実例 プロパティ 使い方 コード | :enabledとは、有効なすべての <input>要素を選択することができる。 | input:enabled |
:first-child 詳細 情報:first-child 実例 プロパティ 使い方 コード | :first-childとは、親の最初の子であるすべての <p>要素を選択することができる。 | p:first-child |
:first-of-type 詳細 情報:first-of-type 実例 プロパティ 使い方 コード | :first-of-typeとは、親の最初の <p>要素であるすべての<p>要素を選択することができる。 | p:first-of-type |
:focus 詳細 情報:focus 実例 プロパティ 使い方 コード | :focusとは、フォーカスを持つ <input>要素を選択することができる。 | input:focus |
:hover 詳細 情報:hover 実例 プロパティ 使い方 コード | :hoverとは、マウスオーバーでリンクを選択する | a:hover |
:in-range 詳細 情報:in-range 実例 プロパティ 使い方 コード | :in-rangeとは、指定された範囲内の値を持つ <input>要素を選択することができる。 | input:in-range |
:invalid 詳細 情報:invalid 実例 プロパティ 使い方 コード | :invalidとは、無効な値を持つすべての <input>要素を選択することができる。 | input:invalid |
:lang(language) 詳細 情報:lang(language) 実例 プロパティ 使い方 コード | :lang(language)とは、"it"で始まるlang属性値を持つすべての<p>要素を選択することができる。 | p:lang(it) |
:last-child 詳細 情報:last-child 実例 プロパティ 使い方 コード | :last-childとは、親の最後の子であるすべての <p>要素を選択することができる。 | p:last-child |
:last-of-type 詳細 情報:last-of-type 実例 プロパティ 使い方 コード | :last-of-typeとは、親の最後の <p>要素であるすべての<p>要素を選択することができる。 | p:last-of-type |
:link 詳細 情報:link 実例 プロパティ 使い方 コード | :linkとは、未訪問のリンクをすべて選択することができる。 | a:link |
:not(selector) 詳細 情報:not(selector) 実例 プロパティ 使い方 コード | :not(selector)とは、<p>要素ではないすべての要素を選択することができる。 | :not(p) |
:nth-child(n) 詳細 情報:nth-child(n) 実例 プロパティ 使い方 コード | :nth-child(n)とは、親の2番目の子であるすべての <p>要素を選択することができる。 | p:nth-child(2) |
:nth-last-child(n) 詳細 情報:nth-last-child(n) 実例 プロパティ 使い方 コード | :nth-last-child(n)とは、最後の子から数えて、親の2番目の子であるすべての <p>要素を選択することができる。 | p:nth-last-child(2) |
:nth-last-of-type(n) 詳細 情報:nth-last-of-type(n) 実例 プロパティ 使い方 コード | :nth-last-of-type(n)とは、最後の子から数えて、親の2番目の <p>要素であるすべての<p>要素を選択することができる。 | p:nth-last-of-type(2) |
:nth-of-type(n) 詳細 情報:nth-of-type(n) 実例 プロパティ 使い方 コード | :nth-of-type(n)とは、親の2番目の <p>要素であるすべての<p>要素を選択することができる。 | p:nth-of-type(2) |
:only-of-type 詳細 情報:only-of-type 実例 プロパティ 使い方 コード | :only-of-typeとは、親の唯一の <p>要素であるすべての<p>要素を選択することができる。 | p:only-of-type |
:only-child 詳細 情報:only-child 実例 プロパティ 使い方 コード | :only-childとは、親の唯一の子であるすべての <p>要素を選択することができる。 | p:only-child |
:optional 詳細 情報:optional 実例 プロパティ 使い方 コード | :optionalとは、「必須」属性を持たない <input>要素を選択することができる。 | input:optional |
:out-of-range 詳細 情報:out-of-range 実例 プロパティ 使い方 コード | :out-of-rangeとは、指定された範囲外の値を持つ <input>要素を選択することができる。 | input:out-of-range |
:read-only 詳細 情報:read-only 実例 プロパティ 使い方 コード | :read-onlyとは、"readonly"属性が指定された<input>要素を選択することができる。 | input:read-only |
:read-write 詳細 情報:read-write 実例 プロパティ 使い方 コード | :read-writeとは、"readonly"属性のない<input>要素を選択する | input:read-write |
:required 詳細 情報:required 実例 プロパティ 使い方 コード | :requiredとは、「必須」属性が指定された <input>要素を選択することができる。 | input:required |
:root 詳細 情報:root 実例 プロパティ 使い方 コード | :rootとは、ドキュメントのルート要素を選択することができる。 | root |
:target 詳細 情報:target 実例 プロパティ 使い方 コード | :targetとは、現在アクティブな #news要素を選択することができる。（そのアンカー名を含むURLをクリックすることができる。） | #news:target |
:valid 詳細 情報:valid 実例 プロパティ 使い方 コード | :validとは、有効な値を持つすべての <input>要素を選択することができる。 | input:valid |
:visited 詳細 情報:visited 実例 プロパティ 使い方 コード | :visitedとは、訪問されたすべてのリンクを選択することができる。 | a:visited |
