是html解析器的硬性开关，必须位于文档最开头且前面无任何字符，否则触发怪异模式；它启用html5标准解析规则，与dtd无关。
浏览器一看到 就切换解析模式
这不是语法糖，是 HTML 解析器的硬性开关。只要第一行是 （且前面不能有任何字符、空格或 BOM），解析器就立刻启用 HTML5 标准模式：盒模型按 border-box 计算、<code>flex 和 position: sticky 可用、<main></main> 等语义标签被识别、<script></script> 默认延迟执行。
常见错误现象：
- 文件开头有 UTF-8 BOM（如某些编辑器保存时自动添加）→ 触发怪异模式，
margin叠加异常、height: 100%失效 - 写成
（小写）或 <code>（大写）→ 多数现代浏览器仍识别，但 IE8 及更早版本会降级 - 在
前插入注释或空行 → 直接进入怪异模式
Content-Type 响应头决定“是否启动 HTML 解析器”
服务端返回的 Content-Type: text/html 是浏览器启动 HTML 解析器的前提。没有它，哪怕文件名是 index.html、内容里有 <script></script>，浏览器也只当纯文本显示。
使用场景：
- 本地双击打开
file://协议时：浏览器忽略Content-Type，只看后缀（.html→ 渲染；.txt→ 显示源码） - 走 HTTP（如
http://localhost:3000或线上部署）：完全依赖响应头。Pythonhttp.server、简易 Express 静态服务默认不设Content-Type，极易白屏
验证方法：DevTools → Network → 刷页面 → 找 HTML 请求 → 查 Response Headers 中是否有 Content-Type: text/html。
<meta charset> 不影响文档类型，只管解码
<meta charset="UTF-8"> 只告诉浏览器“用 UTF-8 解码字节流”，和 HTML 版本无关。它不参与 DOCTYPE 判断，也不影响解析器是否启动。
容易踩的坑：
- 误以为写了
<meta charset="UTF-8">就能替代Content-Type: text/html; charset=UTF-8→ 实际上后者优先级更高，前者只是 fallback - 在
file://下依赖<meta charset>解决乱码，却忽略了服务端漏配Content-Type导致整个页面不解析 - 用 Node.js
res.send()发 HTML 字符串时没显式设 header → Express 默认发text/html; charset=utf-8，但若你用res.write()+res.end()就可能漏掉
HTML5 的识别完全不依赖 DTD 或外部引用
HTML5 不基于 SGML，所以 后面不需要跟任何 DTD URL 或 PUBLIC ID。写 <code> 这类旧式声明，反而会让部分老浏览器困惑，甚至触发怪异模式。
真正关键的只有三点：
- 必须是
（大小写不敏感但推荐小写） - 必须出现在文档最开头，前面零字符
- 后续解析行为由浏览器引擎实现决定，不是靠校验 DTD 文件
如果你在调试时发现页面结构错乱、CSS 不生效、JS 报“document is not defined”，先盯住这三行：BOM 是否存在、DOCTYPE 是否完整、Content-Type 响应头是否到位——其他都是次要干扰项。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
