如下图，盒模型从内到外包括content，Padding，Border，Margin。
盒模型有一个尺寸的计算公式，一般浏览器都遵循W3C的标准盒模型的计算公式，但是IE6以及以下版本的浏览器却有自己的盒模型定义，具体如下
W3C标准盒模型计算公式：
/*外盒计算尺寸*/
Element空间高度 = content height + padding + border + margin
Element空间宽度 = content width + padding + border + margin
/*内盒计算尺寸*/
Element空间高度 = content height + padding + border
Element空间宽度 = content width + padding + border
IE6以及以下版本浏览器盒模型计算公式：
/*外盒计算尺寸*/
Element空间高度 = content height + margin
Element空间宽度 = content width + margin
/*内盒计算尺寸*/
Element空间高度 = content height (包含了content padding border)
Element空间宽度 = content width (包含了content padding border)
接下来，重点来了：在css中设置的width，指的是上面公式中的content width(同理，height也一样)；所以，ie6下的css设置的width，其实是包含了padding和border的宽度；但在其他浏览器中，css的width，不包含padding和border。
理清了盒模型，现在再来说一下CSS3中的属性box-sizing，这个属性有助于对盒模型的理解，
box-sizing：content-box 表示元素遵循W3C标准盒模型计算公式，即：css 的width不包括padding border
box-sizing：border-box 表示元素遵循IE6以及以下版本浏览器盒模型计算公式，即：css 的width包括padding border