DOCTYPE，或者称为 Document Type Declaration（文档类型声明，缩写 DTD）。通常情况下，DOCTYPE 位于一个 HTML 文档的最前面的位置，根元素 html 的起始标签之前,前面没有任何内容，不区分大小写。因为浏览器必须在解析 HTML 文档正文之前就确定当前文档的类型，以决定其需要采用的渲染模式。不同的渲染模式会影响到浏览器对于 CSS 代码甚至 JavaScript 脚本的解析。尤其是在 IE 系列浏览器中，由 DOCTYPE 所决定的 HTML 页面的渲染模式至关重要。
公共 DTD，名称格式为：注册//组织//类型 标签//语言,注册指组织是否由国际标准化组织(ISO)注册，+表示是，-表示不是。组织即组织名称，如：W3C。类型一般是 DTD。标签是指定公开文本描述，即对所引用的公开文本的唯一描述性名称，后面可附带版本号。最后语言是 DTD 语言的 ISO 639 语言标识符，如：EN 表示英文，ZH 表示中文。XHTML 1.0 可声明三种 DTD 类型。分别表示严格版本，过渡版本，以及基于框架的 HTML 文档。
当一个 HTML 文档在没有 DOCTYPE 时
```
CSS1CompatCSS1Compat
``` 这个页面在所有的浏览器中均返回一致的结果，页面上打印出了“BackCompat”。 document.compatMode 属性最初由微软在 IE 中创造出来，这是一个只读的属性，返回一个字符串，只可能存在两种返回值：
- BackCompat：标准兼容模式未开启；(混杂模式、怪异模式)
- CSS1Compat：标准兼容模式已开启。(标注模式、严格模式)
值得注意的是，IE 的版本号一路从 6.0 升级，但升级仅限于标准模式。对于混杂模式，IE 的版本号永久的冻结在 5.5，这也算是为了向后兼容的巨大牺牲。也就是说即使我们使用着最新最高级的 IE9，但若我们不书写 DOCTYPE 或者使用了能够触发混杂模式的 DOCTYPE，那我们所面对的浏览器仍相当于是那个十几年前的老古董 IE5.5。而其他那些浏览器的混杂模式和标准模式之间却没有想 IE 中这么大的差别。
在 html 中，docutype 有两个主要目的：
- 对文档进行有效性验证。它告诉用户代理和校验器这个文档是按照什么 DTD 写的。这个动作是被动的，每次页面加载时，浏览器并不会下载 DTD 并检查合法性，只有当手动校验页面时才启用。
- 决定浏览器的呈现模式。对于实际操作，通知浏览器读取文档时用哪种解析算法。如果没有写，则浏览器则根据自身的规则对代码进行解析，可能会严重影响 html 排版布局。
混杂模式与标准模式
不使用 DOCTYPE 一定会使 HTML 文档处于混杂模式，然而使用了 DOCTYPE，也不一定就能够使文档在所有浏览器中均处于标准模式。这个和以下2个条件有关：
- 使用了本身就会使浏览器进入混杂模式的古老的甚至是错误的 DOCTYPE；
- 正确的 HTML 类型的 DOCTYPE 有很多种。先看一个标准的 DOCTYPE：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">这个DOCTYPE 包含 6 部分： 1. 字符串“<!DOCTYPE” 2. 根元素通用标识符“HTML” 3. 字符串“PUBLIC” 4. 被引号括起来的公共标识符（publicId）“-//W3C//DTD HTML 4.01//EN” 5. 被引号括起来的系统标识符（systemId）“http://www.w3.org/TR/html4/strict.dtd” 6. 字符串“>”``` 其实浏览器在嗅探 DOCTYPE 时只考虑了上述 6 部分中的第 1、2、4、6 部分，且不区分大小写。如果力求最简，则 HTML5 的 DOCTYPE 是最佳选择：<!DOCTYPE html>，所有的主流浏览器均将这种只包含第 1、2、6 部分的最短的 DOCTYPE 视为标准模式。
如果力求稳妥，则较早的 HTML4.01 Strict 的 DOCTYPE 也是一种好的选择：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">，它在各主流浏览器中触发的模式与上面的 HTML5 的完全一致。
有时候我们处于特殊情况也希望浏览器能够都处于准标准模式，则可选择：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">。 ```
- 在 DOCTYPE 之前出现了其他内容，如注释，甚至是 HTML 标签
DOCTYPE 之前不能出现的内容
- 对于普通文本和 HTML 标签，各浏览器均进入了混杂模式，都看到疑似的 HTML 文档正文了，浏览器不太会往下追查 DOCTYPE 在哪里。
- 对于 HTML 注释和 XML 声明，它们跟上面的普通文本和 HTML 标签有些差别，它们不会在页面中展示出来，即不可视。而有的浏览器则显得十分“智能”，非 IE 浏览器均会忽略它们的存在，DOCTYPE 被正确解析。但是在 IE6 中，DOCTYPE 之前的 XML 声明会导致页面进入混杂模式，而所有的 IE 均会使 DOCTYPE 之前出现了 HTML 注释的页面进入混杂模式。在 IE9 中当出现这种情况时，浏览器在控制台中给出了提示：“HTML1113: 文档模式从 IE9 标准 重新启动到 Quirks ”，看来微软在这一点上不打算“随大流”，这样做也可以敦促作者尽量避免在 DOCTYPE 之前加入其他内容。
有的前端工程师很聪明，他既在 DOCTYPE 之前加入了他需要的内容，却又没有使 IE 由于这些内容而进入混杂模式。他可能会这么写：
``` <![if !IE]><![endif]> <![if false]><![endif]> 又或者是
``` 上面这些 IE 条件注释在非 IE 浏览器中，可能完全被忽略，可能被解释为普通 HTML 注释。但是在 IE 中它们全部消失了，因为这就是 IE 条件注释的作用。所以这也是目前比较合适的在 DOCTYPE 之前写点什么又保证所有浏览器均为标准模式的做法，但我们仍然不推荐在 DOCTYPE 之前加入任何非空白内容。
由于历史的原因，各个浏览器在对页面的渲染上存在差异，甚至同一浏览器在不同版本中，对页面的渲染也不同。在W3C标准出台以前，浏览器在对页面的渲染上没有统一规范，产生了差异(Quirks mode或者称为Compatibility Mode)；由于W3C标准的推出，浏览器渲染页面有了统一的标准(CSScompat或称为Strict mode也有叫做Standars mode)，这就是二者最简单的区别。 W3C标准推出以后，浏览器都开始采纳新标准，但存在一个问题就是如何保证旧的网页还能继续浏览，在标准出来以前，很多页面都是根据旧的渲染方法编写的，如果用的标准来渲染，将导致页面显示异常。为保持浏览器渲染的兼容性，使以前的页面能够正常浏览，浏览器都保留了旧的渲染方法（如：微软的IE）。这样浏览器渲染上就产生了怪异模式（Quircks mode）和标准模式（Standars mode），两种渲染方法共存在一个浏览器上。
火狐一直工作在标准模式下，但IE（6，7，8）标准模式与怪异模式差别很大，主要体现在对盒子模型的解释上，这个很重要，下面就重点说这个。那么浏览器究竟该采用哪种模式渲染呢？这就引出的DTD，既是网页的头部声明，浏览器会通过识别DTD而采用相对应的渲染模式：
- 浏览器要使老旧的网页正常工作，但这部分网页是没有doctype声明的，所以浏览器对没有doctype声明的网页采用quirks mode解析。
- 对于拥有doctype声明的网页，什么浏览器采用何种模式解析，这里有一张详细列表可参考。
- 对于拥有doctype声明的网页，这里有几条简单的规则可用于判断：对于那些浏览器不能识别的doctype声明，浏览器采用严格（strict mode）解析。
- 在doctype声明中，没有使用DTD声明或者使用HTML4以下（不包括HTML4）的DTD声明时，基本所有的浏览器都是使用quirks mode呈现，其他的则使用strict mode解析。
- 可以这么说，在现有有doctype声明的网页，绝大多数是采用strict mode进行解析的。
- 在ie6中，如果在doctype声明前有一个xml声明(比如:<?xml version=”1.0″ encoding=”iso-8859-1″?>)，则采用quirks mode解析。这条规则在ie7中已经移除了。 如何设置为怪异模式：
方法一：在页面项部加 <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”>
方法二：什么也不加。
如何设置为标准模式：
加入以下任意一种：HTML4提供了三种DOCTYPE可选择： 1. 2. 3. 4. XHTML1.0提供了三种DOCTYPE可选择： * 过渡型（Transitional ） * 严格型（Strict ） * 框架型（Frameset ）
如何判定现在是标准模式还是怪异模式：
方法一：执行以下代码
alert(window.top.document.compatMode) ;
//BackCompat 表示怪异模式
//CSS1Compat 表示标准模式
方法二：jquery为我们提供的方法，如下：
alert($.boxModel)
alert($.support.boxModel)