CSS两种盒子模型

所有HTML元素可以看作盒子，无论是div、span、还是a都是盒子。但是，图片、表单元素一律看作是文本，它们并不是盒子。这个很好理解，比如说，一张图片里并不能放东西，它自己就是自己的内容

CSS盒子模型本质上是一个盒子，封装周围的HTML元素，它包括：边距，边框，填充，和实际内容

切换两种盒子模型的方法

标准盒子模型
box-sizing: content-box 
IE盒子模型
box-sizing: border-box

两种盒模型的区别：宽度和高度的计算方式不同

标准盒子模型（W3C盒子模型）：
宽度/高度 = 内容的宽度/内容的高度

IE盒子模型（怪异盒子模型）：
宽度/高度 = 内容的宽度/内容的高度 + 填充的宽度/填充的高度 + 边框的宽度/边框的高度