css3之box-sizing

首先，box-sizing 属性是以特定的方式定义匹配某个区域的特定元素，以适应指定区域，是css3中新增的属性。

**
语法格式

box-sizing: content-box/border-box/inherit;

**

属性介绍
①.content-box: 由 CSS2.1 规定的宽度高度行为。宽度和高度分别应用到元素的内容框。
在宽度和高度之外绘制元素的内边距和边框。也就是我们所说的标准盒模型；

即： Element空间高度 = content height + padding + border + margin
Element 空间宽度 = content width + padding + border + margin
**
②.border-box: 为元素指定的任何内边距和边框都将在已设定的宽度和高度内进行绘制。通过从已设定的宽度和高度分别减去边框和内边距才能得到内容的宽度和高度。；

即： Element空间高度 =（ content height + padding + border）+ margin
Element 空间宽度 = （ content width+ padding + border）+ margin
**
③inherit ： 规定应从父元素继承 box-sizing 属性的值。