简述CSS盒模型

CSS有两种盒模型

分别是

content-box ： 内容盒 - 内容就是盒子的边界
border-box ：边框盒 - 边框才是盒子的边界

公式：
content-box width = 内容宽度
border-box width = 内容宽度 + padding + border

看下图，设置成border-box的div，明显比content-box的要小很多，一般建议用border-box，这样布局的时候元素的宽高就好计算。