w3c 模型
在标准的盒子模型中,width指content部分的宽度
IE模型
在IE盒子模型中,width表示content+padding+border这三个部分的宽度
box-sizing: content-box
是W3C盒子模型
box-sizing: border-box
是IE盒子模型
box-sizing属性
content-box | 这是由 CSS2.1 规定的宽度高度行为。 宽度和高度分别应用到元素的内容框。 在宽度和高度之外绘制元素的内边距和边框。 |
border-box | 为元素设定的宽度和高度决定了元素的边框盒。 就是说,为元素指定的任何内边距和边框都将在已设定的宽度和高度内进行绘制。 通过从已设定的宽度和高度分别减去边框和内边距才能得到内容的宽度和高度。 |
inherit | 规定应从父元素继承 box-sizing 属性的值。 |