IE6常见兼容问题

IE6常见兼容问题

1.margin加倍问题

解决方法:设置为float的div在IE下设置的margin会加倍,这是一个IE6都存在的bug。解决方案是在这个div里面加上display:inline;

2.子集中有设置position,则父级overflow失效

解决方法:为父级设置position:relative

3.<!DOCTYPE HTML>文档类型的声明

产生条件:没写
解决方法:书写文档声明

4.默认行高

产生条件:设置的文字高度超出盒模型内容区域设置的高度会影响布局
解决方法:给超出部分设置overflow:hidden

5.img的外部border

产生条件:当img标签外部有a标签时
解决方法:给img设置border:0;

6.经典3像素bug

产生条件:在ie6中浮动元素与非浮动元素在一行时,间距会出现三像素
解决方法:给非浮动元素设置浮动

7.a标签不适用于所有标签

产生条件:ie6中hover只是适用于a标签
解决方法:使用JavaScript方法模拟a标签使用方法

8.png图片

产生条件:IE6浏览器,不能设置透明
解决方法:使用JavaScript,或者换成GIF,jpg格式的图片

9.透明rgba与opacity

产生条件:IE6中不支持这两种设置方法
解决方法:使用ie6中的滤镜代替,如:opacity:0.5;filter:alpha(opacity=50)。

10.table标签中的border-color属性设置无效

产生条件:ie6中设置无效
解决方法:在css中更改样式

11.子选择器不能使用

产生条件:ie6,R>f无效
解决方法:采用其他选择或者使用后代选择器

12.不支持最大最小宽高

产生条件:ie6,标签的最高min/max-hight
解决方法:_height:最小高度值 只针对ie6

13.img图片下部多出5px

产生条件:ie6
解决方法:将图片转化成块级元素;display:block;

14.多显示一个字错误

产生条件:多个浮动元素中间夹杂着HTML注释语句,浮动元素宽度设置为100%;则在下一行多显示一个上一行的最后一个字符
解决方法:果断删掉注释

15.待续