您的位置:首页 > 其它

IE6的bug修复方法

2015-07-15 18:05 260 查看
1、父元素相对定位,并设置padding-left,子元素绝对定位。两者在ff和ie6中表现不一致

.fu{
  position:relative;
  padding-left:13px;
}
.zi{
  position:absolute;
}

<div class="fu">
<div class="zi"></div>
</div>


解决办法:父元素添加zoom:1

.fu{
zoom:1;
}


2、IE6中,鼠标移动到图片上,图片会闪(重加载)

解决办法,在页面头部<head></head>之间添加下面一段javascript代码

<!--[if lte IE 7]>
<script type="text/javascript">
try {
document.execCommand('BackgroundImageCache', false, true);
} catch (e) {}
</script>
<![endif]-->


3、鼠标移动在线客服图标,会出现两个图标,也即内容复制了。

这叫:IE6注释bug,也叫浮动容器的字符复制bug

顾名思义,“浮动容器的复制bug“中的”浮动“二字给了我们解决的灵感,既然有可能是因为浮动而引起的bug,那么不浮动是不是就没这问题了呢?

所以,其中一个解决办法就是不浮动,用其他的方法达到浮动的效果。

4、子元素相对定位,父元素不设置定位,发现在Firefox和ie6中 top: 0 的定位圆点不一致

解决办法:父元素设置相对定位,子元素绝对定位

(top: 0 ; "0"值可以用来定位问题,找到正确的问题所在,才能治本啊!!!)

5、IE6下周无法实现height:1px 的高度问题

原因:默认情况下,div中设置div较小高度会不起作用,在ie6中,默认的字体尺寸大致在12-14之间,当你试图定义一个高度小于这个默认值的div的时候,就会无效。

   不管小于这个默认值的高度是多少,ie6中显示的高度都是其默认高度。

解决方案:

01.使用overflow属性来限制高度自动调整

div
height:1px ;
overflow:hidden;


02.添加line-height:1px;同时div添加空格符 

div
height:1px ;
line-height:1px ;


<div> </div>


03.添加font-size:0; (测试结果:结果是2px,不是1px),这时候再加一个overflow:hidden;就大功告成啦!

div
background-color:red;
height:1px;
font-size:0;
overflow:hidden;
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: