疑似クラス read-only
疑似クラス read-onlyは、
属性 readonlyを持つ入力フィールドのスタイルを設定します。
このような入力フィールドは読み取り専用であり、
つまり、データを入力したり変更したりすることはできませんが、
データを選択してコピーすることは可能です。
構文
セレクター:read-only {
}
例
読み取り専用の入力フィールドに 薄い灰色の境界線を設定してみましょう:
<p>
<label>テキストを入力</label>
<input type="text">
</p>
<p>
<label>読み取り専用テキスト</label>
<input type="text" value="テキスト" readonly>
</p>
input:read-only {
border: 1px solid #D8DFE8;
}
:
関連項目
-
疑似クラス
:read-write,
編集可能な入力フィールドのスタイルを設定します -
疑似クラス
:default,
デフォルトの要素のスタイルを設定します -
疑似クラス
:indeterminate,
不確定な状態にあるトグル要素のスタイルを設定します -
疑似クラス
:optional,
required属性を持たない入力フィールドのスタイルを設定します -
疑似クラス
:placeholder-shown,
プレースホルダーテキストが表示されている要素のスタイルを設定します -
疑似クラス
:required,
required属性が設定された入力フィールドのスタイルを設定します -
疑似クラス
:focus-within,
フォーカスされた要素のスタイルを設定します -
プロパティ
caret-color,
入力フィールド内のテキストカーソルの色を設定します
