盒子模型（四）
坑军之王
203
CSS模型有两种：一种是W3C盒子模型，现在算是最常用的模型。另一种是IE浏览器所使用的怪异盒模型，它的宽是包括内容区、padding属性和margin属性。对其设置主要是由border-box所决定的，其中默认值（content-box）是指W3C盒子，而border-box是指怪异盒模型。
W3C盒子模型 怪异盒模型
默认的W3C盒子模型就像上图所展示的一样，其宽度计算的时候是不算边框和内填充的，而怪异盒模型就不一样，它的宽度计算是包括边框和内填充的。
正常盒模型和怪异盒模型的区别：
1.用途：正常盒模型主要用于PC端，怪异盒模型主要用于手机端。
2.原理：正常盒模型的大小是由内到外的，由内部决定外部的大小；而怪异盒模型是由外而内的。
3.怪异盒模型和border有关：
设置border宽度可以影响其他元素的布局：但是在IE5及以下里面只是影响其子元素；
4.可以同时设置 box-sizing属性来使用这一特性，是其改变border宽度也不影响其他元素；
5.box-sizing:简单理解就是盒子大小基于什么计算的;