码迷,mamicode.com
首页 > 其他好文 > 详细

盒子模型(W3C盒子模型、IE盒子模型)

时间:2016-05-16 10:42:42      阅读:144      评论:0      收藏:0      [点我收藏+]

标签:

盒子模型包含以下几种元素:

padding;margin;content;border

这是大家都知道的,也是书本上定义说明的,但是在ie的情况下是有点区别的;这是俩种标准

Firefox中采用W3C标准模型,而IE中则采用Microsoft自己的标准

下面我用公式来说明一下:

W3C:

技术分享

宽=width+(padding-left)+(padding-right)+(margin-left)+(margin-right)+(border-left)+(border-right) 
高=height+(padding-top)+(padding-bottom)+(margin-top)+(margin-bottom)+(border-top)+(border-bottom)

IE盒子模型:

技术分享:

宽=width+(border-left)+(border-right) 
高=height+(border-top)+(border-bottom) 

盒子模型(W3C盒子模型、IE盒子模型)

标签:

原文地址:http://www.cnblogs.com/zhaodemo/p/5497015.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!