doctype声明决定浏览器渲染模式：存在且正确（如）触发标准模式（document.compatmode为css1compat），否则降级为怪异模式（backcompat），影响盒模型、继承等基础行为。
DOCTYPE 声明不是可有可无的装饰，它直接决定浏览器用标准模式还是怪异模式渲染页面。没它，或写错，box-sizing、line-height、margin 等基础行为就可能在不同浏览器里跑偏。
为什么浏览器需要 DOCTYPE 来触发标准模式
浏览器（尤其是旧版 IE）会根据 DOCTYPE 是否存在、是否合法，来切换内部渲染引擎的行为分支：
- 存在且正确（如
）→ 触发 <code>document.compatMode === "CSS1Compat"，走 W3C 标准盒模型、标准字体继承逻辑 - 缺失、拼错、或写成
（注意小写开头）→ 大概率降级为怪异模式（<code>document.compatMode === "BackCompat"），模拟 IE5 的非标准行为 - 即使 HTML5 不再依赖 DTD，
仍是唯一被所有现代浏览器识别为“强制标准模式”的信号，没有替代品
HTML4 / XHTML 中 DOCTYPE 的三种写法及实际影响
在 HTML4.01 和 XHTML 1.0 时期，DOCTYPE 必须引用 DTD，声明类型直接影响元素和属性的合法性校验：
：严格模式，禁用 <code><font></font>、<center></center>等表现性标签：过渡模式，允许部分废弃标签，常用于遗留系统迁移：XHTML 严格模式，要求所有标签小写、闭合、属性加引号，XML 解析器会报错
这些声明现在基本只在维护老项目时遇到；现代构建工具或 CMS 默认不会生成它们。
HTML5 的 DOCTYPE 为什么只保留一种写法
HTML5 脱离 SGML 架构，不再需要 DTD 校验，因此语法大幅简化：
- 唯一有效写法是
（大小写不敏感，但惯例全小写） - 不能加空格：
或（末尾空格）会被部分解析器忽略，退化为怪异模式 - 不能混入注释：
<!-- comment --> 会导致 IE9 及更早版本失效 - 必须位于文档第一行、
标签之前，前面不能有任何字符（包括 BOM）
验证 DOCTYPE 是否生效的实操方法
别光看代码有没有写，要确认浏览器真按标准模式跑了：
- 打开开发者工具 → 控制台执行
document.compatMode，返回"CSS1Compat"才算成功 - 在 CSS 中加一条
div { width: 100px; padding: 10px; box-sizing: border-box; }，检查实际宽度是否为 100px（怪异模式下是 120px） - 用
document.doctype查看对象：HTML5 下它是DocumentType实例，name为"html"，publicId和systemId均为空字符串
最容易被忽略的是 BOM（字节顺序标记）：UTF-8 文件若带 BOM， 就不是真正第一行，IE 和某些旧 WebView 会直接忽略它——保存文件时选“UTF-8 无 BOM”格式比什么都管用。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
