css - エラー クラスは [type="text"] セレクターによってオーバーライドされます

Question

テキスト入力にカスタム css を使用します。

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

errorjQueryを使用してクラスを追加して検証が失敗した場合は、背景色などを変更したいと考えています。

.error{
    background-color: #f9abab;
}

問題は、input[type="text"]セレクターが優先され、単に背景色が変更されないことです。Firebug / Inspect 要素で確認できます。

唯一の方法に追加!importantしていますか？.error

Answer 1

いいえ：CSS宣言をより具体的にすることができます。

試す

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

詳細については、CSSの優先順位に関するこの記事を参照してください