## box-sizing的属性和作用 ### 兼容问题 首先，box-sizing属性在FireFox中存在兼容问题，所以需要使用-moz-box-sizing做一下兼容。 #### 属性值 ```css .demo { box-sizing：content-box; box-sizing：border-box; box-sizing：inherit; } ``` ***** `content-box` 标准模式 这是box-sizing的默认属性值 是CSS2.1中规定的宽度高度的显示行为 在CSS中定义的宽度和高度就对应到元素的内容框 在CSS中定义的宽度和高度之外绘制元素的内边距和边框 `border-box` 怪异模式 在CSS中微元素设定的宽度和高度就决定了元素的边框盒 即为元素在设置内边距和边框是在已经设定好的宽度和高度之内进行绘制 CSS中设定的宽度和高度减去边框和内间距才能得到元素内容所占的实际宽度和高度 `inherit` 规定元素是从父元素那里继承box-sizing的属性值