云南网站建设创新企业 昆明多彩网络公司

为什么标签:hover在ie6下无效?

来源：昆明多彩网络公司 日期：2011-10-13 阅读： 发表评论

来看一下代码：

HTML代码：<a href="http://www.kmwzjs.com">昆明网站制作</a>；

CSS代码：a:hover { color: #c00 }；

这样做的效果就是鼠标移动到a标签上文字变成红色。

看到这里很多朋友就会试着在其他标签上加上hover伪类，比如下面的代码：

HTML代码：<li>云南网站建设</li>；

CSS代码：li:hover { color: #c00}

预想的效果是鼠标移动到li标签上，li内的文字变成红色，但是很快就会发现这个效果在IE6下面无法如愿。

这里就是我们要说的网站制作技巧之一：IE6下的hover伪类唯一性，浏览器市场上大致就：是ie6和ie8以上系列；火狐系列；chrome系列；其中的ie6只支持a标签的hover伪类，而其他浏览器则支持多个标签的hover伪类，这就很容易解释为什么li的hover标签效果不能在ie6下面实现了。

那么遇到这种情况，该如何去解决呢？有两个办法：

1. css嵌套办法：html代码：<a href="http://www.kmwzjs.com"><img src="test.jpg" /></a>，要让图片鼠标移动上去的时候需要有css效果就必须用a标签将图片包含进去，该办法有局限性。
2. js的mouseover事件来实现，这种效果比较通用，兼容ie6和其他浏览器，是比较理想的解决方案。