CSS圖像精靈錯誤

Question

我試圖做一個簡單的懸浮效果與我的提交按鈕

CSS

#submit1 a:hover{ 
background-position: -1px -56px ; 
background-image:url(sprites.png); 

} 

#submit1{ 
background-position: -140px -58px ; 
width: 112px; 
height: 33px; 
background-image:url(sprites.png); 
} 

HTML

<div id="submit1"> 
<a href="#"> 
</a> 
</div> 

Answer 1

打開#submit1 a:hover到#submit1:hover

#submit1:hover { 
    background-position: -1px -56px ; 
    background-image:url(sprites.png); 
} 

#submit1 { 
    background-position: -140px -58px ; 
    width: 112px; 
    height: 33px; 
    background-image:url(sprites.png); 
} 

你可以看到結果這裏：http://jsfiddle.net/eu3zc/

編輯： 至於您的評論，當你正在編輯多個元素添加一個逗號。

例子：

#submit1:hover, a:hover { 
    color: #000; 
} 

#submit1, a { 
    color: #FFF; 
} 

#submit1, a這意味着我wan't我的CSS代碼應用到#submit1和a在任何時候。

#submit1:hover, a:hover這意味着我不想將我的CSS代碼應用於#submit1和a，但只有當我懸停時。

您可以通過添加更多逗號來添加更多元素，以將相同的CSS代碼應用於所有元素。