:valid 伪类选择具有根据元素设置进行验证的值的 <form> 元素。
:valid 选择器仅适用于具有 min 和 max 属性的表单 <input> 元素、具有合法电子邮件的电子邮件字段、具有数值的数字字段或者非空值的必填字段。
语法
:valid {
css declarations;
}
:valid 选择器示例：
<!DOCTYPE html>
<html>
<head>
<title>文档的标题</title>
<style>
input {
border: 1px solid #cccccc;
padding: 5px 10px;
}
input:valid {
background-color: #eeeeee;
}
</style>
</head>
<body>
<h2>:valid selector example</h2>
<form>
<input type="email" value="onitroad@example.com">
</form>
</body>
</html>
在给定的示例中，当输入非法电子邮件地址时，样式会消失。
日期：2020-06-02 22:14:51 来源：oir作者：oir