什么是 DOCTYPE？它如何影响页面渲染？
内容提要
DOCTYPE是HTML文档中的声明，用于告知浏览器所使用的HTML版本。浏览器根据DOCTYPE确定页面的渲染模式，影响浏览器对页面的解释和显示方式。建议使用最新的Web标准规范。
延伸解读
DOCTYPE 的语法细节与兼容性
文章指出，DOCTYPE 的语法对大小写不敏感，但必须遵循特定顺序：以 <!DOCTYPE 开头，后跟一个或多个空格，然后是 html，最后以 > 结束。HTML5 允许简写为 <!DOCTYPE HTML>，但若系统无法生成此短格式，可使用遗留字符串 <!DOCTYPE html SYSTEM "about:legacy-compat"> 来确保触发 No quirks mode。开发者常因可读性选择大写或小写，但需注意空格和引号的使用，避免因细微错误导致渲染模式异常。
渲染模式的历史背景与现状
文章回顾了 1990 年代末，网页常为 Netscape Navigator 和 Internet Explorer 分别编写，导致兼容性问题。W3C 和 WHATWG 随后制定 Web 标准，但为兼容旧网站，浏览器引入了多种渲染模式。目前主流浏览器支持三种模式：Quirks mode 模拟旧浏览器行为，No quirks mode 遵循现代标准，Limited quirks mode 介于两者之间。文章强调，新网站应优先使用 No quirks mode，以确保布局和 CSS 解析符合最新规范。
渲染模式对页面行为的具体影响
不同渲染模式会影响浏览器对盒模型、CSS 和 HTML 标签的解析。例如，在 Quirks mode 下，盒模型的计算方式可能与标准不同，导致元素尺寸和布局出现偏差；一些过时或非标准的 CSS 属性可能被忽略或错误应用；HTML 标签的解析也可能出现差异。文章提醒，这些影响可能因浏览器版本、操作系统和设备而异，因此遵循最新 Web 标准是获得一致渲染结果的关键。
如何检测当前渲染模式
文章提供了检测渲染模式的方法：通过 JavaScript 访问 document.compatMode 属性。若返回 "BackCompat"，表示文档处于 Quirks mode；若返回 "CSS1Compat"，则表示处于 No quirks mode 或 Limited quirks mode。开发者可利用此属性在代码中判断当前模式，例如在 Quirks mode 下执行特定兼容逻辑。这有助于调试因 DOCTYPE 缺失或错误导致的渲染问题，确保页面按预期显示。
Q&A
DOCTYPE的作用是什么？
DOCTYPE用于告知浏览器所使用的HTML版本，从而影响页面的渲染模式和显示方式。
使用DOCTYPE的好处是什么？
使用DOCTYPE可以确保浏览器以推荐的No quirks mode渲染页面，从而提高兼容性和稳定性。
HTML5的DOCTYPE是什么？
HTML5的DOCTYPE可以简化为<!DOCTYPE HTML>，以提高兼容性和易用性。
浏览器如何确定渲染模式？
浏览器根据文档顶部的DOCTYPE声明来决定渲染模式，如果缺少或不正确，可能会触发Quirks mode。
Quirks mode和No quirks mode有什么区别？
Quirks mode模拟旧版浏览器的行为，不推荐使用；而No quirks mode遵循现代Web标准，是推荐的渲染模式。
如何检查当前的渲染模式？
可以通过document.compatMode属性检查当前的渲染模式，返回值可以是'BackCompat'或'CSS1Compat'。
