li上改變李元素的背景：用css背景圖像懸停

我有一堆李元素，背景圖像在正常狀態下工作正常。當我將鼠標懸停在特定圖像上時，我將鼠標懸停類添加到它們在y軸上移動的圖像中的任何一個大約25px左右。我試圖在懸停狀態下設置「background-position：0 0」以及餘量等，但都沒有成功。我也嘗試改變元素，所以它使用「a：hover」來代替，而且這也不起作用。li上改變李元素的背景：用css背景圖像懸停

我在做什麼錯了？我怎麼能得到這個懸停位置是在同一個地方？

我的代碼：

<div class="contentBottom"> 
<ul class="featuredIn"> 
<li class="featured1"><a href="mylink1.html"></a></li> 
<li class="featured2"><a href="mylink2.html"></a></li> 
<li class="featured3"><a href="mylink3.html"></a></li> 
</ul> 
</div> 

li.featured1 { 
    background: url(featured_in/1.png) no-repeat; 
    text-indent:-9999px; 
    width: 83px;  
    height: 43px; 
} 

li.featured1:hover { 
    background: url(featured_in/1_hover.png) no-repeat; 
} 

li.featured2 { 
    background: url(featured_in/2.png) no-repeat; 
    width: 203px; 
    height: 42px; 
    text-indent:-9999px; 
} 

li.featured2:hover { 
    background: url(featured_in/2_hover.png) no-repeat; 
} 

li.featured3 { 
    background: url(featured_in/3.png) no-repeat; 
    width: 143px; 
    height: 21px; 
    text-indent:-9999px; 
} 

li.featured3:hover { 
    background: url(featured_in/3_hover.png) no-repeat; 
}

來源

2013-03-17 cibit

請提供一個在線的例子，其中的問題得以重現，包括您的實際背景圖片（否則我們什麼也看不到）（您的服務器上，或一個的jsfiddle或東西）。以及這個問題涉及哪些瀏覽器的信息。 – CBroe 2013-03-17 00:17:04

找到了解決方案。這只是我的懸停圖像比正常狀態更大。 – cibit 2013-03-17 00:31:12

你嘗試添加圖像背景要素，像這樣。

background-image: url(featured_in/3.png) no-repeat;

你也可以嘗試像這樣向url元素添加''。

background: url('featured_in/3.png') no-repeat;

我希望這有助於:)

來源

2013-04-16 14:39:32 dragonloverlord

li上改變李元素的背景：用css背景圖像懸停

回答

相關問題