css盒模型

基本概念

盒模型的组成由里向外内容(content)+填充(padding)+边框(border),外边距(margin)

盒模型是有两种标准的，一个是标准模型，一个是IE模型。

 从上面两图不难看出在标准模型中，盒模型的宽高只是内容（content）的宽高，

而在IE模型中盒模型的宽高是内容(content)+填充(padding)+边框(border)的总宽高。

css如何设置两种模型

这里用到了CSS3 的属性 box-sizing

/* 标准模型 */
box-sizing:content-box;

 /*IE模型*/
box-sizing:border-box;