CSS - 圖像精靈：主動不工作，即

這是我的代碼，它完全適用於所有，但ie！主動根本不火CSS - 圖像精靈：主動不工作，即

a.Button span { 
background: transparent url('images/form_sprite.png') no-repeat 0 0; 
display: block; 
height:45px; 
line-height: 30px; 
padding: 7px 0 5px 20px; 
color: #fff; 
background-position: 0 -44px; 
} 

a.Button { 
background: transparent url('images/form_sprite.png') no-repeat top right; 
display: block; 
float: left; 
height: 45px; 
margin-right: 6px; 
padding-right: 27px; 
text-decoration: none; 
font-family: Arial, Helvetica, sans-serif; 
font-size:12px; 
font-weight:bold; 
} 

a.Button:hover span { 
background-position: 0 -136px; 
} 

a.Button:hover { 
background-position: right -90px; 
} 

a.Button:active span { 
background-position: 0 -225px; 
} 

a.Button:active { 
background-position: right -181px; 
}

這是HTML：

<div class="clearbutton"> <a class="Button" href="#"><span>Button text</span></a> </div>

任何想法嗎？

來源

2011-12-31 Darren Sweeney

哪個版本的IE？ 6 - 7 - 8 - 9？ – TH1981 2011-12-31 18:20:40

所有版本@Aninemity – 2011-12-31 18:36:14

如果你添加了另一個效果：active，如顏色變化，它在IE中觸發嗎？ – TH1981 2011-12-31 18:53:13

嘗試在您的css中更改a.Button:active至a.Button span:active。這似乎是射擊的:active CSS，仍然適用於我的鉻合金。

來源

2011-12-31 19:14:05 TH1981

這在一定程度上是有效的，但是，因爲這是一個滑動門類的類，所以它有兩個半部分 - 將它改爲你所說的，現在點擊任一半都可以工作，但不會一起開火 - 這個噩夢 – 2011-12-31 20:03:47

是的，:active psuedo-class只在IE中觸發，當用戶點擊直接對該對象。在這種情況下，鏈接。如果你點擊一個子對象（跨度），鏈接的活動事件將不會觸發。

正如Aninemity所說，您可以將樣式應用於span:active（正確的方法）。但是在IE6/7中，:active只會引發鏈接。如果你需要IE6/7支持，你必須找到一些方法來擺脫跨度。

來源

2011-12-31 19:22:11 benesch

CSS - 圖像精靈：主動不工作，即

回答

相關問題