如果验证失败,则设置HTML5输入类型

Question

大家好

我的问题很简单:我需要设置无法验证的输入的红色边框(或阴影？)(如电子邮件).有没有新的CSS技巧呢？

如果你仍然不明白我告诉你的是什么,那么这就是需要改变的颜色:

Answer 1

有关Firefox的详细信息,请参阅https://developer.mozilla.org/en/CSS/%3Ainvalid,但可能没有"-moz"的部分也适用于其他浏览器:

的:invalidCSS伪类以自动应用<input> ,其内容不能根据输入的类型设置,以验证元件.这使您可以轻松地使无效字段采用有助于用户识别和纠正错误的外观.

默认情况下,Gecko不会将样式应用于:invalid伪类.然而,它确实将样式(使用box-shadow属性的红色"发光")应用于:-moz-ui-invalid伪类,后者适用于案例的子集:invalid.