盒子模型，box-sizing属性以及标准盒子和IE盒子的区别。

box-sizing属性，box-sizing: content-box;标准流盒子

                            box-sizing: border-box;怪异盒子(IE盒子)

直接在当前盒子设置该属性。

1.标准流盒子模型

当在CSS中给盒子设置height时，该高度为盒子的content的高度。

使用padding时，盒子会被撑大，即盒子宽度等于padding+content

使用border时，盒子也会被撑大，即盒子宽度等于padding+content+border

使用margin时，盒子不会变大，但会影响周围盒子的布局。

综上，标准模型的盒子宽度为content+padding+border。

2.怪异盒子模型(IE盒子)

给盒子设置的width、height就是盒子的宽度和高度。

当给盒子设置padding属性时，盒子的大小不会变化，content内容会缩小。

当给盒子设置border属性时，盒子大小不会变化，content内容会缩小 .

 给设置margin属性时，盒子大小不会变化，会影响周围盒子的布局。

综上，怪异盒子模型的宽高读为在CSS中设置的宽高。即content(padding+border)-content包括内边距和边框。