怪异盒模型&弹性盒

怪异盒模型

怪异盒模型又叫IE盒模型，它可以使padding和border都在元素宽高的内部，不会把盒子撑大一般在移动端开发时使用。
触发条件：box-sizing:border-box;
例：

我们设置了一个宽400px高300px的盒子，给它添加了10px的border和50px的padding，标准盒模型中，padding会把盒子撑大且border会在盒子的外部，而添加**box-sizing:border-box;**后，元素整体的宽高不会发生变化：

怪异盒模型在移动端布局中经常用到，比如固定两栏布局，中间的主要内容区，可以给父元素加padding（是头部和底部的大小）把子元素挤到内容区，且不改变父元