盒模型的理解

盒模型有两种，W3C 和IE 盒子模型

1、W3C定义的盒模型包括margin、border、padding、content，元素的宽度width=content的宽度

2、IE盒模型与W3C盒模型的唯一区别就是元素的宽度，元素的width=border + padding + content

 

IE定义的盒模型较为合理，所以在css3中新增了box-sizing，包含两个属性content-box和border-box。

    （1） content-box 元素的width = content

    （2）border-box 元素的width = border + padding + content