: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 | ○ |