盒模型

标准盒模型（W3C标准）和怪异盒模型（IE8-）

盒模型 = margin + padding + content + border 

 

标准盒模型中的宽度 = content

怪异盒模型中的宽度 = padding + content + border

 

现代浏览器中默认的是W3c标准下的标准模型，但在不少情况下怪异模型更好用，所以W3C在css3中加入了box-sizing

 

box-sizing：content-box    // 标准模型

box-sizing：border-box     //  怪异模型