你有使用:valid和:invalid来校验表单吗？

是的，:valid 和 :invalid 是两个非常有用的 CSS 伪类，它们允许我们根据表单输入字段是否有效来应用样式。

:valid 伪类选择器用于选择所有有效的 <input> 元素，而 :invalid 则用于选择所有无效的 <input> 元素。这些选择器通常与 HTML5 的表单验证功能一起使用，例如，当 <input> 元素的 type 属性设置为 email，number，url 等时，浏览器会自动进行验证。

以下是一个简单的例子：

<form>
  <label for="email">Email:</label>
  <input type="email" id="email" name="email" required>
  <input type="submit" value="Submit">
</form>

然后，你可以使用 CSS 来改变有效和无效输入字段的样式：

input:invalid {
  border-color: red;
}

input:valid {
  border-color: green;
}

在这个例子中，如果用户输入的不是有效的电子邮件地址，输入框的边框将变为红色。如果输入的是有效的电子邮件地址，边框将变为绿色。

但请注意，虽然这种方法对于简单的验证很有用，但对于更复杂的验证需求，你可能需要使用 JavaScript 或后端语言进行更深入的验证。此外，:valid 和 :invalid 伪类的行为可能会受到浏览器支持的限制，因此在使用之前，最好检查一下目标浏览器的兼容性。