如何確保懸停時顏色被覆蓋？

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; 
}

懸停顏色不應用由於內嵌色彩風格的高特異性。同樣的問題，如果我給身份證的ID和他們的個人顏色在ID造型。我想在兩個div（或更多）上共享懸停顏色定義，同時在非懸停上顯示其獨特的顏色。這可能沒有很多冗餘的CSS？

來源

2013-02-05 ysalmi

在** CSS **代碼中使用'！important'。 'background-color：＃000！important;' – Enve

謝謝，這很有效。 – ysalmi

通過在值後面設置!important，您可以超過CSS中其他聲明的任何特殊性。覆蓋此僅適用於!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-05 13:15:36 kleinfreund

非常好！是的，我想避免任何自定義代碼去除背景顏色（因爲當鼠標不再懸停時，我不得不將其添加回去）。我從來沒有發現！重要的實際用途是有道理的，所以感謝這個例子。我會記住那條規則。 – ysalmi

有時候最好是寫更多的代碼，而不是使用'！important'，只是在這個問題上「潛行」。大多數時候，我試圖在過去使用重要的風格導致了更多的問題。請記住，當你遇到新的問題。 ;） – kleinfreund

如何確保懸停時顏色被覆蓋？

回答

相關問題