box-sizing的值有3个:content-box,border-box,inherit
value | description |
---|---|
content-box | 在宽度和高度之外绘制元素的内边距和边框 |
border-box | 为元素指定的任何内边距和边框都在已设定的高度和宽度内进行绘制,通过从设定的高度和宽度减去内边距和边框才得到内容的宽度和高度 |
(貌似句子太长碰见“-”会换行,求大神指点)
我们在做页面的时候,为了避免div的实际长度和高度与我们的设定值不符,我们采用border-box这个属性,在全局css中加入如下代码:
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}