我的网页上有一个类为“btnNewL1”的按钮。我的CSS类是如下CSS：悬停时更改按钮外观
.btnNewL1
{
background: url(../images/btnbgnew.png);
border:1px solid #818181;
padding-left:3px;
padding-right:3px;
font-family:Arial;
font-size:12px;
padding-top:1px;
padding-bottom:1px;
}
当用户将鼠标放在按钮，我想chnage外观像背景图片和边框颜色等chnage的变化......。我想这样做将CSS本身。它应该被IE6支持IE 7，火狐
如何做到这一点？
不幸：hover伪选择器不被IE6比<a>任何其它元件上的支持。
如果你希望实现的：hover在IE6中，您可以：
一）如果可能的话，改变你的<input class="btnNewL1" type="button" value="click me!" />到<a class="btnNewL1" href="#">click me!</a>。您需要添加display：block和其他几个CSS规则。这将使用<a>标签简单地“模拟”按钮。这不是完美的解决方案，因为有时您必须使用正确的<input>（即使用asp.net控件时）。
B）使用JavaScript，使解决办法，例如jQuery是：
<script type="text/javascript">
$(document).ready(function(){
$("input.btnNewL1").mouseover(function(){
$(this).toggleClass('buttonSelected');
}).mouseout(function(){
$(this).toggleClass('buttonSelected');
});
});
</script>
<input type="button" value="click me!" class="btnNewL1" />
C）包装你的代码这样的：
<a class="acont" href="#"><input type="button" value="click me!" /></a>
所以，你将能够使用CSS：
.acont:hover input { background:red; }
这将做这项工作，但据我记得这是无效的HTML（<input>不应该被放置在<a>标签内）
哪一个你会选择 - 取决于你。这篇文章的主要观点是：：悬停伪选择器只能用于IE6上的锚点元素
.btnNewL1:hover{
background: url(../images/different.png);
}
你想要:hover伪类。使用.btnNewL1:hover { ... }作为鼠标悬停式样式。
有关伪类的更多信息，另请参见CSS2 spec。
大多数时间翻转效果并不重要，我不必担心IE6兼容解决方案。但是OP确实提到了IE6，我给了你一个解决这个问题的+1。 – 2009-11-16 19:59:34
谢谢史蒂夫。我也这么认为，但我们仍应该记住IE6，因为很多人都在使用它。哦，顺便说一句，我编辑我的帖子，所以现在有三种解决方案。 – rochal 2009-11-16 20:00:51