CSS懸停圖片不適用於Firefox，但適用於Chrome

CSS懸停圖片不適用於Firefox，但適用於ChromeCSS懸停圖片不適用於Firefox，但適用於Chrome

這些是我的代碼。

.col-md-2 .angelhack { 
height: 65px; 
width: 188px; 
content: url(../img2/logo_angelhack.png);

}

.col-md-2 .angelhack:hover { 
    height: 65px; 
    width: 188px; 
    content: url(../img2/logo_angelhack_colored.png); 
}

來源

2013-11-04 marx

試着改變你的CSS '內容' 到 '背景圖片'。圖像路徑周圍引號是可選的：

background-image: url(../img2/logo_angelhack.png);

我在這裏補充一個例子：http://jsfiddle.net/dKcdK/

注意，例如假設.angelhack是一個塊級元素。如果情況並非如此，那麼您還需要在您的CSS中應用display: block;。 *如果下面的註釋包含您的HTML，我會完全從源HTML中移除圖像標籤，並將您的class="angelhack"設置爲錨標籤。然後在CSS中添加display: block;。

更新的jsfiddle這裏：http://jsfiddle.net/dKcdK/2/

來源

2013-11-04 17:02:12

我已經試過了，但它不工作。 :( – marx

有趣的是，有一次，我將設置一個jsFiddle進行測試/例子。 –

'.angelhack'是什麼類型的元素？如果默認爲內聯，那麼你需要給它顯示：block; in你的CSS –

CSS懸停圖片不適用於Firefox，但適用於Chrome

回答

相關問題