border-box的使用 CSS box-sizing属性为什么没有margin-box?

[更新]
·
·
分类:互联网
3776 阅读

CSS

CSS box-sizing属性为什么没有margin-box?

box-sizing属性为什么没有margin-box?

首先谢谢邀请吧。
Box-sizing是CSS3的Box属性之一,那他当然也遵循CSS的Box model原理,CSS中Box model是分为两种,第一种是W3C的标准模型,另一种是IE的传统模型,他们相同之处都是对元素计算尺寸的模型,具体说就是对元素的width,height,padding,border以及元素实际尺寸的计算关系。
1、W3C的标准Box Model:
/*外盒尺寸计算(元素空间尺寸)*/ Element空间高度 content height padding border margin Element 空间宽度 content width padding border margin /*内盒尺寸计算(元素大小)*/ Element Height content height padding border (Height为内容高度) Element Width content width padding border (Width为内容宽度)。
2、IE)传统下Box Model(IE6以下,不含IE6版本或“QuirksMode下IE5.5 ”):
/*外盒尺寸计算(元素空间尺寸)*/ Element空间高度 content Height margin (Height包含了元素内容宽度,边框宽度,内距宽度) Element空间宽度 content Width margin (Width包含了元素内容宽度、边框宽度、内距宽度) /*内盒尺寸计算(元素大小)*/ Element Height content Height(Height包含了元素内容宽度,边框宽度,内距宽度) Element Width content Width(Width包含了元素内容宽度、边框宽度、内距宽度)。
box-sizing 属性:
1、content-box:此值为其默认值,其让元素维持W3C的标准Box Model,也就是说元素的宽度/高度(width/height)等于元素边框宽度(border)加上元素内边距(padding)加上元素内容宽度/高度(content width/height)即:Element Width/Height border padding content width/height。
2、border-box:此值让元素维持IE传统的Box Model(IE6以下版本),也就是说元素的宽度/高度等于元素内容的宽度/高度。(从上面Box Model介绍可知,我们这里的content width/height包含了元素的border,padding,内容的width/height【此处的内容宽度/高度width/height-border-padding】)。
说这么多为什么没有margin-box 属性,个人觉也许是用户场景需求不足导致未制定该属性。

服装设计相关时尚读物哪里找?

1.相关网络,2.服装设计学校,3.培训机构!4.相关书本教材!