DOCTYPE
DOCTYPE，或者称为 Document Type Declaration（文档类型声明，缩写 DTD）。通常情况下，DOCTYPE 位于一个 HTML 文档的最前面的位置，位于根元素 HTML 的起始标签之前。因为浏览器必须在解析 HTML 文档正文之前就确定当前文档的类型，以决定其需要采用的渲染模式，不同的渲染模式会影响到浏览器对于 CSS 代码甚至 JavaScript 脚本的解析。尤其是在 IE 系列浏览器中，由 DOCTYPE 所决定的 HTML 页面的渲染模式至关重要。
浏览器解析HTML方式
有三种解析方式:
- 非怪异（标准）模式
- 怪异模式
- 部分怪异（近乎标准）模式
我们通常用到的就是标准模式。在标准模式下，那么浏览器就必须老老实实地按照W3C的标准来解析渲染页面，这样一来，我们的页面在所有的浏览器里显示的就都是一个样子了。
理想是美好的，但现实总是不如我们所愿。怪异模式就不遵从W3C的标准，用于历史原因，它尝试模拟更旧的浏览器行为。
在出现这两种渲染模式之后，一些浏览器（那些基于 Mozilla 的 Gecko 渲染引擎的，或者 Internet Explorer 8 在 strict mode 下）还尝试于在这两种模式之间寻求妥协，于是便产生了“近乎标准”(almost standards) 模式。它会实施一种表单元格尺寸的怪异行为，除了这一点，其他都符合W3C的标准。
如何决定哪种模式渲染
我们可以根据页面开始的文档（DocumentType）声明来判断用何种渲染模式。如果要使用标准模式,推荐使用<!DOCTYPE html>来声明HTML文档。
但是当我们出现下面几种情况是，就会触发怪癖模式：
- 缺少文档声明
- 文档声明错误
- 在ie6,7,8,9的DocumentType之前放注释
<html>
<head></head>
<body>
<script>
document.write(document.compatMode);
</script>
</body>
</html>
上面这段代码无论在哪个浏览器中执行所返回的结果都是一致的，页面上会显示 “BackCompat”。document.compatMode 这个属性最初其实是由IE所创建的。这是一个只读的属性，只拥有两个返回值：
- BackCompat：标准兼容模式未开启；
- CSS1Compat：标准兼容模式已开启。
怪癖模式的影响
怪癖模式带来的影响主要是css布局，怪癖模式和标准模式他们拥有一个比较突出的不同，就是对于盒模型的解析。
对于“盒模型”一词并没有明确的文档定义，它是开发人员描述 CSS 中块级元素的一种约定俗称。但是，由于历史的原因，早期的IE将盒子的margin、padding 和 border 的宽度都算在了width里。
另外也值得一提的是，对于行内元素的垂直对齐。标准模式下，基于 Gecko 的浏览器将会对齐至基线；而在怪癖模式下，它们会以底部为基准对齐。
网友评论