このウェブサイトはご利用の端末での閲覧に対応していません。
This website does not support your device.

:read-only”擬似クラスCSS Selectors Level 4で追加

記事Jul. 15th,2021
ユーザーが編集できない要素を選択する擬似クラス、“:read-only”について
この記事はCSS3に対応しています。
この記事はCSS3に対応しています。

:read-only”擬似クラス

:read-only”擬似クラスはユーザーによる編集ができない、読み取り専用の要素を選択する擬似クラスです。

どの状態が編集できない状態なのかは文書の記述言語によって定義されます。

HTMLでは:read-write”擬似クラスに選択されない要素はすべて“:read-only”擬似クラスによって選択されるとしています。

使用例

input:read-only {
border: solid 5px #43676b; /**/
}

input:read-write {
border: solid 5px #00a381; /**/
}
<p><label>猫が好きですか?:<input type="text" value="好き" readonly></label></p>
<p><label>犬が好きですか?:<input type="text"></label></p>

仕様書

定義されている仕様書
Level 1 Level 2 Level 3 Level 4
勧告(REC) 勧告(REC) 勧告(REC) 作業草稿(WD)
:read-only
定義なし

定義なし

定義なし

定義あり
一番上へ
トップにもどる
シェアする
シェアする
Facebookでシェアする
ツイート
Google+でシェア
Pocket
はてなブックマーク