对盒模型的理解

CSS3 中的盒模型有以下两种：标准盒子模型、IE 盒子模型

盒模型都是由四个部分组成的，分别是 margin、border、padding 和 content。

标准盒模型和 IE 盒模型的区别在于设置 width 和 height 时，所对应的范围不同：

1.标准盒模型的 width 和 height 属性的范围只包含了 content，

2.IE 盒模型的 width 和 height 属性的范围包含了 border、padding 和 content。

可以通过修改元素的 box-sizing 属性来改变元素的盒模型：

1.box-sizeing: content-box表示标准盒模型（默认值）

2.box-sizeing: border-box表示 IE 盒模型（怪异盒模型）