这是我参与「第四届青训营 」笔记创作活动的第 1 天
因为 IDE 都是 !+tab 自动补全，所以没怎么了解过 HTML 文件中一些必要语句的含义，这次刚好老师有讲到 DOCTYPE，所以略微深入地了解了一下。
为什么 HTML 文件开头会有 <!DOCTYPE html>
引用老师的话说：它代表着当前 HTML 文件版本，浏览器会根据其决定使用那种渲染模式。如果不写，浏览器会以老旧的“怪异模式”去渲染页面。
DOCTYPE（Document Type Declaration）用于声明文档类型和 DTD（Document Type Definition）规范，确保不同浏览器以相同的方式解析文档，以及执行相同的渲染模式。
那么问题来了：
Q1: 什么是 怪异模式 ？
浏览器采用 怪异模式 和 标准模式，用以把能符合新规范的网站和老旧网站区分开。在 怪异模式 下，排版会模拟 Navigator 4 与 Internet Explorer 5 的非标准行为。
标准模式与怪异模式比较常见的区别是盒模型的处理差异：怪异模式 IE 盒模型，标准模式 W3C 盒模型，二者宽高算法不同。
举个栗子：
| 标准模式 | 怪异模式 | |
|---|---|---|
| 给行内元素设置宽高 | 无效 | 生效 |
margin: 0 auto; 水平居中 | 生效 | 无效 |
| 颜色模式 | 16 进制或 rgb(a) | 16 进制 |
Q2：之前浏览器兼容遇到的带有 "W3C" 字样的 DOCTYPE 是做什么用的？
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
表示该文档遵循 html 4.01 strict 标准，盲猜这里如果不指定 W3C 标准文件，老旧的浏览器可能会使用随机标准解析，有可能导致怪异模式的产生。
因为 HTML5 不再基于 SGML，所以在声明中不需要引用 DTD，只需要根元素即可，即 <!DOCTYPE html>
DOCTYPE 语法 <!DOCTYPE root-element PUBLIC "FPI" ["URI"][内部子集声明]>
| 关键字 | 描述 |
|---|---|
| root-element | 根元素，一般是 html 元素 |
| PUBLIC | 对外开放的 DTD（文档类型定义） |
| FPI | Formal Public Identifier，即正式公共标识符，DTD 的一部分，用于唯一标识产品、规格或文档。 |
| URI | 系统标识符，也就是 DTD 规范的文件地址 |
SGML：标准通用标记语言（Standard Generalized Markup Language）是现时常用的超文本格式的最高层次标准，是可以定义标记语言的元语言，甚至可以定义不必采用< >的常规方式。由于它的复杂，因而难以普及。XML可以被认为是它的一个子集，而HTML是它的一个应用。—— wikipedia
