网乐原科技

直播中

news center新闻中心
首页 > 资讯中心 > 软件技术

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

发布时间:2013-03-15     阅读数: 次       来源:网乐原科技

来看一下代码:

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

网乐原科技

客服热线:0771-5761507

QQ:53290011

QQ邮箱:53290011@qq.com

工作时间:周一到周五 9:00-18:00

地址:广西南宁市江南万达写字楼C16栋1309室

物联网开发

关注我们

微信小商店 腾讯QQ客服 微信客服