CSS在IE6中常见的兼容性问题

最新推荐文章于 2024-04-21 22:53:42 发布

转载最新推荐文章于 2024-04-21 22:53:42 发布 · 157 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/wuyufei/p/10503225.html

本文详细介绍了在IE6浏览器中遇到的常见兼容性问题及其解决办法，包括png24图片透明度、position:fixed无效、双边距问题及布局异常等，并提供了具体的代码示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.在IE6中png24格式的图片不透明

解决办法：写一个条件注释语句，引入一个js插件，然后调用一下js中的方法，把需要处理的元素的类名写在括号中，如下

（插件下载地址：http://www.dillerdesign.com/experiment/DD_belatedPNG/）

<!--[if IE 6]>
    <script src="DD_belatedPNG_0.0.8a-min.js"></script>
    <script>
         DD_belatedPNG.fix('.png-img1,.png-img2');
    </script>
<![endif]-->

2.IE6中position:fixed;无效

　　可以用position:absolute;进行定位，right控制右边的距离，top值用通过js获取各种值去计算

3.IE6中双边距问题

　　即：浮动元素拥有同向margin值（left和margin-left，right和margin-right），第一个元素会出现同向的margin值

　　例如三个margin-left:10px;的div都float:left;第一个（最左边的）div的margin-left是20px，或者margin-right:20px;float:right;最右边的会出现margin-right:40px;

　　解决办法：针对IE6，把元素转成内联，在那个元素的css中写上 _display:inline; 下划线的意思是针对IE6，只有IE6才解析（顺便提一下，星号 * 是针对IE7的）

4.谍影重重

　　写了几行正常的标签

　　正常情况下应该是

　　但在IE6中可能会这样，但把div上边的注释删了之后就会恢复正常

　　造成这个BUG的原因可能是多重混合的，如浮动，注释，宽高定义等等。并且注释条数越多，溢出的文本也会随之增多。

　　所以解决办法：删除box1和box2之间所有的注释、不设置浮动等。

转载于:https://www.cnblogs.com/wuyufei/p/10503225.html