:valid

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

:valid CSS 伪类表示内容验证正确的<input> 或其他 <form> 元素。这能简单地将校验字段展示为一种能让用户辨别出其输入数据的正确性的样式。

css
/* Selects any valid <input> */
input:valid {
  background-color: powderblue;
}

该伪类对于高亮正确字段是很有用的。

语法

Error: could not find syntax for this item

例子

参见 :invalid

Accessibility concerns

绿色常用于表示有效输入。但某些色盲的人将无法确定输入的状态(颜色),除非使用不依赖于颜色来传达意义的附加指示器。通常,指示器使用描述性文本和(或)图标。

规范

Specification
HTML Standard
# selector-valid
Selectors Level 4
# validity-pseudos

浏览器兼容性

BCD tables only load in the browser

参见