擬似クラス optional
擬似クラス optional は、
required 属性が設定されていない入力フィールド、
つまり、この擬似クラスが適用されるのは
オプションの入力フィールドです。
構文
セレクター:optional {
}
例
オプションの入力フィールドに グレーの背景を設定してみましょう：
<form>
<p>
<label>数値を入力</label>
<input type="number" required>
</p>
<p>
<label>テキストを入力</label>
<input type="text">
</p>
</form>
input:optional {
background-color: #D8DFE8;
}
:
関連項目
-
デフォルトの要素にスタイルを設定する擬似クラス
:default -
不確定状態のトグルにスタイルを設定する擬似クラス
:indeterminate -
プレースホルダーテキストが表示されている要素にスタイルを設定する擬似クラス
:placeholder-shown -
変更不可の入力フィールドにスタイルを設定する擬似クラス
:read-only -
required属性が設定された入力フィールドにスタイルを設定する擬似クラス
:required -
フォーカスされた要素にスタイルを設定する擬似クラス
:focus-within -
入力フィールド内のテキストカーソルの色を設定するプロパティ
caret-color
