盒子模型（怪异模型）

1.什么是盒子模型？

CSS盒子模型（Box model）就是在网页设计中经常用到的CSS技术所使用的一种思维模型。网页中所有元素都具备以下四个属性：

• 内容(content)，也就是元素的 width、height
• 内边距(padding)
• 边框(border)
• 外边距(margin)
  

2.盒子模型能够为我们解决什么问题?

• 盒子模型主要是针对页面布局的时候来使用，它规范我们的页面的所有元素的一个布局标准是由外向内进行布局。
• 盒子模型由外向内：margin(外边距)—>border(边框)---->padding(内边距)---->content(元素)

上面所说的盒子模型是基于W3C标准的盒子模型，大多数浏览器都采用标准盒模型。而还有一种怪异盒子模型，这种怪异模式主要表现在IE内核的浏览器

3.标准盒子模型和怪异盒子模型（IE盒子模型）

• 在标准模式下，一个块的总宽度 = 内容的width + padding(左右) + border(左右) + margin(左右)