0 
<html>
<head>
    <style>
        input[type='text'], select {
            background: blue
        }

        .error {
            background: red
        }
    </style>
</head>
<body>
<input type="text" class="error"/>
<select class="error">
    <option>non-sense</option>
</select>
</body>
</html>

クラスの.error背景が赤の場合は、赤でなければなりません。input[type="text"]青い背景があっても。IE および GC でテスト済み。

4

3 に答える 3

5

あなたが見ている問題の理由は、input[type=text]より具体的で.errorあるため、それを上書きします。より具体的なセレクターを使用します。

input.error

または、本当に安全になりたい場合は、次のようにします。

input[type=text].error

CSS の特異性とその計算方法に関する詳細情報

もう 1 つの方法は、現在のセレクターを保持!importantし、ルールにキーワードを追加することです。

.error { background: red !important; }

これにより、要素に一致する他のルールが即座にオーバーライドされます。これは非常に強力なツールであり、将来的に予期しない結果につながる可能性があることに注意してください。

于 2012-10-29T11:55:00.923 に答える
2

使用する.error { background: red !important }

これには制限があることに注意してください。次を参照してください: !重要なルール (CSS 2.1 セクション 6.4.2)

于 2012-10-29T11:53:49.890 に答える
0

これを試して

<html>
   <head>
       <style>

           input[type='text'], select { background: blue }
           .error { background: red; }
           input.error { background: red; }

       </style>
    </head>
    <body>
        <input type="text" class="error" />
        <select class="error">
            <option>non-sense</option>
        </select>
    </body>
</html>
于 2012-10-29T12:07:34.513 に答える