:default

CSS の :default 疑似クラスは、関連する要素のグループ内で既定となっているフォーム上の要素を表します。

このセレクターは <button>、 <input type="checkbox">、 <input type="radio">、 <option> 要素に使用することができます。

/* Selects any default <input> */
input:default {
  background-color: lime;
}

複数選択ができるグループ化要素は複数の値を持つことがあります。つまり、最初から複数の項目が選択されていることがあります。この場合、全ての既定値が :default 疑似クラスを使用して表されます。例えば、チェックボックスの中で既定値のチェックボックスにスタイルを適用することができます。

構文

:default

例

HTML

<input type="radio" name="season" id="spring">
<label for="spring">Spring</label>

<input type="radio" name="season" id="summer" checked>
<label for="summer">Summer</label>

<input type="radio" name="season" id="fall">
<label for="fall">Fall</label>

<input type="radio" name="season" id="winter">
<label for="winter">Winter</label>

CSS

input:default {
  box-shadow: 0 0 2px 1px coral;
}

input:default + label {
  color: coral;
}

結果

仕様書

ブラウザー実装状況