Quirks（怪异模式）和标准模式的区别

以 IE6 为例，如果写了 DTD，就意味着这个页面将采用对 CSS 支持更好的布局，而如果没有，则采用兼容之前的布局方式。这就是 Quirks 模式（怪癖模式，诡异模式，怪异模式）。

总体会有布局、样式解析和脚本执行三个方面的区别：

在 IE6 之前 CSS 还不够成熟，所以 IE5 等之前的浏览器对 CSS 的支持很差，IE6 将对 CSS 提供更好的支持，然而这时的问题就来了，因为有很多页面是基于旧的布局方式写的，而如果 IE6 支持 CSS 则将令这些页面显示不正常。如何在即保证不破坏现有页面，又提供新的渲染机制呢？

IE6 将 DTD（文档类型定义）当成了"参数"，因为以前的页面大家都不会去写 DTD，所以 IE6 就假定如果写了 DTD，就意味着这个页面将采用对 CSS 支持更好的布局，而如果没有，则采用兼容之前的布局方式。这就是 Quirks 模式。

总体会有布局、样式解析和脚本执行三个方面的区别。

盒模型：在 W3C 标准中，如果设置一个元素的宽度和高度，指的是元素内容的宽度和高度，而在 Quirks 模式下，IE 的宽度和高度还包含了 padding 和 border。
设置行内元素的高宽：在 Standards 模式下，给 <span> 等行内元素设置 width 和 height 都不会生效，而在 Quirks 模式下，则会生效。
设置百分比的高度：在 Standards 模式下，一个元素的高度是由其包含的内容来决定的，如果父元素没有设置百分比的高度，子元素设置一个百分比的高度是无效的。
用 margin: 0 auto 设置水平居中：使用 margin: 0 auto 在 Standards 模式下可以使元素水平居中，但在 Quirks 模式下却会失效。

补充

补充：标准模式遵循 W3C 规范，Quirks 模式兼容 IE5 时代的"老经验"，二者的差异集中在盒模型、行内元素高宽、百分比高度、自动居中等几个点。