:read-write - CSS（层叠样式表） 编辑

:read-write CSS 伪类 代表一个元素（例如可输入文本的 input元素）可以被用户编辑。

/* 选择所有可编辑的 <input> 元素 */
/* Firefox 中需要加前缀 */
input:-moz-read-write {
  background-color: #bbf;
}

/* Supported in Blink/WebKit/Edge without a prefix */
input:read-write {
  background-color: #bbf;
}

注意：这个选择器不仅仅选择 <input> 元素，它也会选择所有可以被用户编辑的元素，例如设置了 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>This is a normal paragraph.</p>
<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; }

输出

规范

规范	状态	备注
HTML Living Standard :read-write	Living Standard	No change.
HTML5 :read-write	Recommendation	Defines the semantics regarding HTML and constraint validation.
Selectors Level 4 :read-write	Working Draft	Defines the pseudo-class, but not the associated semantics.

浏览器兼容性

BCD tables only load in the browser

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.

参阅

• :read-only
• HTML contenteditable attribute