IE 6 混杂模式也称为怪异模式，在 CSS 2 中，盒子的实际宽度实际上是 width+2*padding+2*border 计算出来的，但在混杂模式下，盒子的实际宽度就是 width。

要使用混杂模式，需要将 box-sizing 设置为 border-box，此时 width 和 height 所设置的就是 border-box 了，或者说是整个盒子的总高度就由 width 和 height 决定了。

为什么叫做 IE 6 混杂模式？
虽然 box-sizing 是 CSS 3 新提出的属性，但这种宽高计算方式在 IE 6 中就已经存在了，这种计算方式确实会带来一些便捷，所以 CSS 3 中提供了这样一个属性。

为什么说这种写法会带来一些方便呢，因为我们不怎么关注内容区的宽高，因为我们测量尺寸一般测量的是整个盒子，或者说是边框的尺寸，而不是内容区，内容区的尺寸有时候也并不是很好量，所以其实很多时候我们更希望 width 和 height 直接作用到 border-box 上。