1

HTML：

<div class="hovertest" style="background-color: #fff">
    Test 1
</div>
<div class="hovertest" style="background-color: #eee">
    Test 2
</div>

CSS：

.hovertest:hover {
     background-color: #000;
}

インラインカラースタイルの特異性が高いため、ホバーカラーは適用されません。divにIDを指定し、IDスタイリングで個々の色を適用した場合も同じ問題が発生します。ホバー以外の色を表示しながら、両方のdiv（またはそれ以上）でホバーの色の定義を共有したいと思います。これは多くの冗長なCSSなしで可能ですか？

4

1 に答える 1

4

値の後に設定することで、CSSの他の宣言の特異性を上回ることができ!importantます。これをオーバーライドするには、。を使用した別の宣言を使用する必要があり!importantます。

.hovertest:hover {
    background-color: black !important;
}

#hovertest:hover {
    background-color: red; /* Even using an ID won't override `!important` */
}

ただし、注意してください。CSSで使用!importantすると、非常に難しい問題が発生する可能性があります。多くの場合、CSSをできるだけ使用しない方法でCSSを作成する方が便利です。

!important 反応性を使用しないでください、予防的に使用してください。

于 2013-02-05T13:15:36.647 に答える