:read-only編集不可能な要素にスタイルを適用する

:read-only 疑似クラスは、閲覧者が編集できない要素にスタイルを適用します。多くの場合、readonly 属性が付与された input 要素や textarea 要素に使用されますが、セレクタ自体は「閲覧者が編集できない要素」すべてに適用されるため注意が必要です。

例えば、contenteditable="true" が付与されていない p 要素や div 要素なども「閲覧者が編集できない要素」です。

:read-onlyのサンプルソース

input:read-only,
textarea:read-only {
  background-color: #dddddd;
}

主要ブラウザの対応

IE11 ×
Edge(EdgeHTML)
Edge(Chromium)
Chrome
Firefox
Safari
iOS Safari
Android Chrome

用途から CSS プロパティやセレクタを探す

用途から CSS プロパティやセレクタを逆引きできます。

@-規則
メディアクエリ
セレクタ
疑似要素
疑似クラス
CSS関数
背景

対応ブラウザから CSS プロパティやセレクタを探す

対応ブラウザから CSS プロパティやセレクタを逆引きできます。

IE11
Edge(EdgeHTML)
Edge(Chromium)
Firefox
Chrome
Safari
iOS Safari
Android Chrome

このページの上部へ