IE Firefox css 差别

2024-03-22 08:31•css•阅读 4647

1、单位问题

问题：任何距离的数值ie可以不加单位，ff必须要求写单位（0除外）

解决：写全单位如padding:0px;

2、水平居中

问题：div里的内容，ie默认为center，而ff默认left

解决：mairgin:0px auto;

3、高度问题

问题：如果设置了一个DIV的高度，当DIV里实际内容大于所设高度，ie会自动拉伸以适应DIV容器大小，ff会固定DIV的高度，超过部分超出DIV底线以外，出现和下面的内容重叠的现象

解决：控制恰当的高度，或者不写，让浏览器自动调节高度，或者设置overflow:hidden;

4、clear:both;

问题：如果上面用float控制了n列DIV，下面ie会自动检测自动排列，ff则可能很不老实，到处乱动

解决：float结束后的下一个标签加clear:both;以结束float的控制

5、最大/小宽度问题

问题：min-width,max-width只是ff的命令，如何让ie实现同样的效果

解决：ie不认识min-和max-，实际ie认为min-width、max-width和width效果一样，可以用下面方法解决

#cctext{

min-width: 700px;

max-width: 1000px;

width:expression_r(document.body.clientWidth<700 ? \”700px\” : document.body.clientWidth>1000 ? \”1000px\” : \”auto\”);

}

6、!important支持

问题：ff支持ie不支持

解决：无。ie会忽略。

7、游标状态

问题：cursor:hand;仅ie支持，显示手指状态

解决：使用cursor:pointer;ie和ff都支持

8、实际像素

IE/Opera：对象的实际宽度 = (margin-left) + width + (margin-right)

Firefox/Mozilla：对象的实际宽度= (margin-left) + (border-left-width) + (padding- left) + width + (padding-right) + (border-right-width) + (margin-right)

所以排列好及列的表格时ie和ff显示宽度稍有区别