您当前的位置: 站长圈 > 网页前端

阿Q老师CSS基础教程第四课 ie常见的bug

来源:站长圈|0 作者:adminzzq 点击: 0
ie常见的bug

color:red //所有浏览器
color:blue\0 //ie8
+color:orange //ie7
_color:blue   //ie6

1)3px 的bug
     出现的条件:一个容器里面,一个元素浮动,另一个没有浮动。ie6就会给浮动的元素加上3px空白边。

    解决的方法:1,建议另一个元素也浮动。2,把浮动的元素加上-3px 空白边。

2)li标签呈阶梯状

    li标签里面有a标签,a标签浮动,设为块(行内元素浮动之后,会自动转换为块。),ie6里会   阶梯状显示。

解决方法:把li也浮动即可。

3)不能显示小高度的bug
    ie里元素的高度不能小于字体的大小。

解决方案:1:font-size:0; 2:overflow:hidden;

4)跨出边界
    出现的条件:父元素overflow:auto;子元素高度超出父元素,并且有定位。

解决方案:把父元素也设为相对定位

5)min-height的bug
    ie6不支持min-height。
解决方案:
 min-height:100px;
 height:auto !important;
 height:100px;

6)display:inline-block 的bug
    出现的条件:块元素display:inline-block时会出现,行内元素和列表元素不会出现

解决方案:单独写一条针对ie6的样式:display:inline;

7)input元素不显示背景图片
     出现的条件:input元素,有background-image:时候,不显示背景图片,
解决的方法:1,background:url(); 2,加上background-color:

8)双倍margin:
    出现的条件:浮动元素的水平margin会翻倍
解决的方法:display:inline就可以了。