由内容区域、内容区域周围的空间（内边距，padding）、内边距的外边缘（边框，border）和边框外面将元素与相邻元素隔开的不可见区域（外边距，margin）构成。具体如下图
浏览器中元素的宽度与其width属性值并不一致（除非没有内边距和边框）。CSS中的宽度指示的是内边距里内容区域的宽度，而在浏览器中显示宽度则是内容宽度、左右内边距和左右边框的总和，显示高度与之类似。
当使用了box-sizing:border-box;则元素的显示宽度就等于width属性的值。内容宽度、内边距和边框都包含在里面。如下图
看起来似乎是CSS设置的宽度变大了，但其实，更改的并不是CSS，改变的是浏览器对于宽度的计算，我们来看一个例子：
Test
查看更多关于关于盒模型的理解_html/css_WEB-ITnose的详细内容...
声明：本文来自网络，不代表【好得很程序员自学网】立场，转载请注明出处：http://haodehen.cn/did111631