:read-write
该:read-writeCSS伪类表示能被用户编辑的元素（诸如文本输入框）。
/* Selects any element that is editable */
/* Supported in Firefox with a prefix */
input:-moz-read-write {
background-color: #ccc;
}
/* Supported in Blink/WebKit/Edge without prefix */
input:read-write {
background-color: #ccc;
}注意：这个选择器不只是选择文本输入框; 它将选择用户可以编辑的任何元素，例如一个设置了它的contenteditable属性的<p>元素。
语法
:read-write实例
HTML
<input type="text" value="Type whatever you want here.">
<input type="text" value="This is a read-only field." readonly>
<p contenteditable="true">You can edit this paragraph!</p>CSS
input { min-width: 25em; }
input:-moz-read-write { background: cyan; }
input:read-write { background: cyan; }
p:-moz-read-write { background: lightgray; }
p:read-write { background: lightgray; }
p[contenteditable="true"] { color: blue; }结果
规范
Specification | Status | Comment |
|---|---|---|
HTML Living StandardThe definition of ':read-write' in that specification. | Living Standard | No change. |
HTML5The definition of ':read-write' in that specification. | Recommendation | Defines the semantic regarding HTML and constraint validation. |
Selectors Level 4The definition of ':read-write' in that specification. | Working Draft | Defines the pseudo-class, but not the associated semantic. |
浏览器兼容性
Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|---|
Basic support | (Yes) | (Yes) | (Yes)-mozbug 312971 | Nightly build 1 | (Yes) | (Yes) |
Editable element (except for text input fields) | No support | No support | (Yes)-mozbug 312971 | No support | No support | No support |
Feature | Android | Chrome for Android | Edge | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|---|
Basic support | ? | (Yes) | (Yes) | (Yes)-mozbug 312971 | ? | ? | ? |
Editable element (except for text input fields) | No support | No support | No support | (Yes)-mozbug 312971 | No support | No support | No support |
本文档系腾讯云开发者社区成员共同维护，如有问题请联系 cloudcommunity@tencent.com
