box-sizing: content-box/ border-box
content-box: 浏览器对盒模型的解释遵W3C 标准,width
和height
不包括border
和padding
。
border-box: 浏览器对盒模型的解释与 IE6
之前的版本相同,border
和padding
被包含在width
和height
之内的。内容的宽和高可以通过定义的width
和height
减去相应方向的padding
和border
的宽度得到。内容的宽和高必须保证不能为负,必要时将自动增大该元素border box
的尺寸以使其内容的宽或高最小为0。
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;