代码改变世界

IE下hover失效的bug

2011-01-06 16:41  惟恐天下不乱哥  阅读(642)  评论(3)  编辑  收藏  举报

需要做这么一个简单的效果，鼠标放置在文字上的时候(即鼠标悬停)，显示手状的鼠标状态。按道理来讲，还是很容易实现的。步骤如下：

设置了这么一个样式

   1: li a 
   2: {   font-size:13px; 
   3:     text-decoration:none; 
   4: } 
   5: a:hover,a:active 
   6: {   cursor:hand; 
   7:      text-decoration:none;
   8: }
   9: 
HTML代码片段 
   1: <div style="overflow:hidden; display:none; height:470px">
   2: <ul>
   3: <li><a>鼠标悬停..</a></li></ul>
   4: </div>

结果却是：当我把这段代码放置到不同的地方时，得到的结果却不相同。有的能够显示悬停手状效果，有的不行。

后来发现，a,a:hover{cursor:hand;}要一起用才有效果。也就是说在a,和a:hover样式同时指定cursor:hand才会起作用