css - 错误类被 [type="text"] 选择器覆盖

Question

我为我的文本输入使用自定义 css：

input[type="text"]{
    background-color: #f9f9f9;
}

error如果使用 jQuery添加类验证失败，我想更改背景颜色 - 等等：

.error{
    background-color: #f9abab;
}

问题是input[type="text"]选择器具有优先权，并且背景颜色保持不变。我可以在 Firebug / Inspect 元素中看到它。

是添加!important到.error唯一的方法吗？

Answer 1

否：您可以在 CSS 声明中更加具体。

尝试

input[type="text"].error{
   //stuff
}

有关更多信息，请参阅有关 CSS 优先级的这篇文章