IE6的bug修复方法

最新推荐文章于 2024-09-14 18:52:56 发布

weixin_30498921

最新推荐文章于 2024-09-14 18:52:56 发布

阅读量102

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/dragonlong/p/4648560.html

版权

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>&nbsp;</div>

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

div
    background-color:red;
    height:1px;
    font-size:0;
    overflow:hidden;

转载于:https://www.cnblogs.com/dragonlong/p/4648560.html

weixin_30498921

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫