DIV边距属性在Chrome和IE中的区别是什么-创新互联

这篇文章给大家分享的是有关DIV边距属性在Chrome和IE中的区别是什么的内容。小编觉得挺实用的,因此分享给大家做个参考。一起跟随小编过来看看吧。

成都创新互联自成立以来,一直致力于为企业提供从网站策划、网站设计、做网站、成都做网站、电子商务、网站推广、网站优化到为企业提供个性化软件开发等基于互联网的全面整合营销服务。公司拥有丰富的网站建设和互联网应用系统开发管理经验、成熟的应用系统解决方案、优秀的网站开发工程师团队及专业的网站设计师团队。

在Chrome下看起来很整齐的布局,在IE下变成一团糟。为了找出原因,做了一些测试,晒出来和大家分享一下

突然间,在Chrome下看起来很整齐的布局,在IE下变成一团糟。为了找出原因,我改动了p的background-color属性。最后,发现同一个p的宽度在IE和Chrome下却不一样。这大晚上的,真是怪吓人滴!
之后,做了个测试。当:

p1 
{ 
width:960px; 
margin:0px; 
padding:0px; 
}

这时,在两个浏览器下是没有区别滴!总宽度均是960px。
但是,当:

p1 
{ 
width:960px; 
margin:0px; 
padding:0px 10px 0px 10px; 
}

这时,Chrome就不干了。她居然把padding的20px加在了外面,这样p1的总宽度就是960px+10px+10px=980px;而,在IE中p1的宽度仍是960px;
按照我的思维,感觉padding应该算在width里面滴,没想到Chrome这么倔。
经过测试,border和padding一样,margin的值均算在“width”的外面。
还有,在没有设置float的情况下,Chrome会把p1当成position:absolute,而IE会把其当成poisttion:relative;所以,尽量都这是块级元素的float为left!
真悲催,浏览器不兼容让我这个门外汉很痛苦呀!

感谢各位的阅读!关于DIV边距属性在Chrome和IE中的区别是什么就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看到吧!


分享标题:DIV边距属性在Chrome和IE中的区别是什么-创新互联
标题来源:http://myzitong.com/article/djidoo.html