浏览器严格模式和混杂模式的直观表现差异

一、引言

众所周知，Doctype是文件类型定义（DTD），用来告诉浏览器用什么规范来解析当前文档。当过渡 DTD没有 URI，DTD不存在或者格式不正确时，浏览器会用混杂模式来解析文档。（也就是依据自己的一套标准，最大程度地展示文档）。

HTML5不是基于SGML的，所以不用DTD。这里用4.0.1做示例。

二、直观表现

下面是在IE6下 严格模式(标准模式) 和 混杂模式(怪异模式) 的展现：

如图，怪异模式下：

1）盒模型的高宽包含内边距padding和边框border（对应test1）

2）可以设置行内元素的高宽（对应test2）

3）可设置百分比的高度（对应test3，这点需要用IE10以上或其他现代浏览器才能看出来！）

4）用margin:0 auto设置水平居中在IE下会失效（对应test4）

5）设置图片的padding会失效（对应test5）

6）table中的字体属性不能继承上层的设置（对应test6）

7）white-space:pre会失效（对应test7）

下面是测试代码：

dtd-presentation