使用css将输入的蓝色边框颜色更改为红色

Question

我们知道，当我们点击一​​个文本框时，那将是蓝色边框颜色，如下面的图像

而我想要的是，如果用户提供了错误的输入，那么它将变为红色，这种风格在css中的名称是什么？

感谢。

Answer 1

尝试使用:invalid伪类：

  

:invalid CSS伪类代表任何<input>或<form>元素   其内容无法根据输入的类型设置进行验证。   这允许您轻松地使无效字段采用外观   帮助用户识别和纠正错误。

请参阅example：

input:focus {
    box-shadow: 0 0 1.5px 1px #0000FF;
} 
input:focus:invalid {
    box-shadow: 0 0 1.5px 1px #FF0000;
}