您当前的位置:首页 > 网页设计 > Web开发 > 正文

IE和FF对盒模型的解释区别

【字体大小: 2009-04-02 11:44 来源:未知 作者:编辑整理 

  IE和FF对盒模型的解释也不一样,代码说明:

  1. #test { width650px !important;width648px;padding-left:2px;background:#fff; }  

  test 显示的宽带是 650px

  IE Box的总宽度是: width+padding+border+margin宽度总和

  FF Box的总宽度就是 width的宽度,padding+border+margin的宽度在含在width内。

  如果有BOX{WIDTH:”300″; PADDING:”5PX”;}

  则BOX在IE的宽度应该为:310

  而在FF的宽度则是300

  所以在BOX有填充的情况下应该这样使用

  BOX{WIDTH:”290″!IMPORTANT; WIDTH: “300″;}

  这样子才能确保BOX的宽度始终在300px,而不会出现被撑开的现象

  而在FF里面则不会造成浮动层填不满的情况

  ul 标签在 Mozilla 中有 padding 值的,而在 IE 中只有 margin 有值。

  设置ul{margin:0;padding:0}

  IE和Mozilla浏览器对盒模型的解释不一致,造成定位上的困难,主要差别是:

  1.IE计算2个div之间的距离时候,会把1px的border计算在内,而mozilla没有.

  2.设定div的宽度后,如果给padding加一个值,IE5会在宽度内减去这个值,而M ozilla会在宽度基础上加上这个值。

  针对firefox ie6 ie7的css样式

  现在大部分都是用!important来hack,对于ie6和firefox测试可以正常显示,

  但是ie7对!important可以正确解释,会导致页面没按要求显示!找到一个针

  对IE7不错的hack方式就是使用“*+html”,现在用IE7浏览一下,应该没有问题了。

    顶一下
    (6)
    54.5%
    踩一下
    (5)
    45.5%
    【责任编辑:绝口不提】 标签:
    最新评论 查看所有评论
    发表评论 查看所有评论
    请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
    评价:
    表情:
    用户名:密码:验证码: