CSS懸停圖像位置改變

我敢肯定它的東西超級愚蠢的，但我一直堅持了一段時間，現在......所以，我在網站上有圖像，我希望他們繼續前進小幅徘徊。CSS懸停圖像位置改變

所以我在HTML：

<a href="someaddress"><img class="thumb" src="somefile"/></a>

並在CSS：

img.thumb { 
    position:relative; 
    top:0px; 
    background:#333399; 

} 

img.thumb:hover { 
    position:relative; 
    top:5px;  
    background:#00CCCC; 

}

背景是那裏只是看到的東西是否正在發生。實際上，背景沒有改變，所以懸停從未被考慮。有沒有人有一個想法，爲什麼這可能是??

編輯

非常感謝，大家好！

我其實解決它通過在投擲：

a > img.thumb:hover { 
position:relative; 
top:2px; 
}

哪些工作。不過也不清楚爲什麼它不只是img.thumb工作：懸停......

來源

2013-05-07 ProgressiveMonkey

沒你在CSS的「IMG」標籤之前嘗試「一」的標籤。。？ – kumar 2013-05-07 09:40:09

或者只是刪除位置屬性？ – 2013-05-07 09:40:52

作品[這裏jsFiddle]（http://jsfiddle.net/X9qqu/）。你確定你正在鏈接你的CSS文件嗎？ – George 2013-05-07 09:41:23

這裏是solution。

的HTML：

<div> 
<a href="someaddress"><img class="thumb" src="http://www.google.co.in/images/srpr/logo4w.png"/></a> 
</div>

的CSS：

img.thumb { 
    position:relative; 
    top:0px; 

} 

img.thumb:hover { 
    position:relative; 
    top:5px;  
    background:#00CCCC; 

}

我希望這有助於。

來源

2013-05-07 09:45:08 Nitesh

看不到什麼不同？ – ocanal 2013-05-07 09:46:23

奇怪的是，心理上的滿足感和確認沒有什麼東西叫做要解決的問題。只需通過添加div和谷歌圖片來滿足他/她 - @ocanal – Nitesh 2013-05-07 09:53:19

您的代碼應該工作，我在這裏檢查的話：http://cssdesk.com/XcV2D

一些其他風格應該影響...

來源

2013-05-07 09:46:32 Galen

CSS懸停圖像位置改變

回答

相關問題