「元素：懸停的」顏色屬性不起作用，可能是什麼錯誤？

我有一個類「navIcon」的元素，我給它一個顏色和背景顏色。我想當用戶將鼠標懸停在這個元素上時，它的顏色會變爲黑色，以便考試和背景更改。背景顏色成功更改，但顏色仍與第一種顏色相同。這是我的風格：「元素：懸停的」顏色屬性不起作用，可能是什麼錯誤？

.navIcon{ 
    width: 45px; 
    height: 100%; 
    text-align: center; 
    font-size: 1.3em; 
    font-weight: normal; 
    float: left; 
    padding-top: 8px; 
    color: #f7f8f8; 
} 

.navIcon:hover{ 
    background-color: #f7f8f8; 
    color: #3a3e3e; 
}

和HTML是在這裏：

<div id="userAuth" class="navIcon"> 
     <i class="icon-user"></i> 
    </div>

，也是我使用字體真棒。

什麼可能是錯誤？

來源

2013-07-31 bobsilon

這是你的CSS的確切順序？如果.navIcon：hover在另一個CSS文件中或在.navIcon之前，它將被覆蓋。 – tobspr

你也可以嘗試'color：＃3a3e3e！important; '，但它不應該是必需的，通常是 – tobspr

請將你的相關代碼放在一起[jsfiddle]（http://jsfiddle.net） - 你可以看到它在這裏工作得很好：http://jsfiddle.net/cHzVJ/1/ – Adrift

沒有辦法這是不行的，它只是一個基本的:hover所以它應該工作，我懷疑的唯一的事情就是你的CSS必須是具有!important聲明:hover或具有更高特異性的另一個規則。

例如

div a { 
    color: #f00; /* Red */ 
} 

div a:hover { 
    color: #0f0; /* Green */ 
} 

a:hover { 
    color: #0ff; /* Blue */ 
}

Demo

這裏，div a:hover比較簡單a:hover從而更具體的，你的情況，你必須具有更高特異性的選擇，或者你已經!important聲明。

來源

2013-07-31 18:06:19

您實際上在錨點上徘徊。 OP沒有提及它在懸停的「什麼」。怎麼樣一個不透明的圖像？ –

@MilchePatern如果他會徘徊在圖像上，他不會在第一時間使用顏色 –

我確定它是特異性的。「 –

「元素：懸停的」顏色屬性不起作用，可能是什麼錯誤？

回答

相關問題