document.compatMode 是判断浏览器渲染模式的直接依据：返回 "CSS1Compat" 为标准模式，"BackCompat" 为怪异模式； 必须严格位于文档第一字符，前面不得有任何空格、注释、BOM 或其他内容。
没加 ，或者写错位置、大小写、拼写，浏览器大概率进怪异模式——这不是兼容性问题，是整套渲染逻辑切换了。
document.compatMode 是什么？怎么查当前模式
这是判断 DOCTYPE 是否生效最直接的依据。打开 DevTools → Console 输入 document.compatMode：
- 返回
"CSS1Compat"：标准模式，正常 - 返回
"BackCompat"：怪异模式，出问题了
注意：这个值在页面加载后就固定了，刷新页面才能重置；不能靠“看起来能显示”来判断，很多布局 bug（比如 width 计算异常、vertical-align 失效）只在怪异模式下才暴露。
a style="color:#f60; text-decoration:underline;" title= "html"href="https://m.php.cn/zt/15763.html" target="_blank">html> 必须放在哪？前面能有空格或注释吗
必须是文档第一个字符，前面**不能有任何内容**，包括：
- 空格、换行、BOM 字节（某些编辑器保存 UTF-8 时会偷偷加）
-
（哪怕只是说明用的） - PHP 或模板引擎输出的空白（如
前的回车）
错误示例： → 怪异模式；正确写法只有 单独占首行，且前面无任何字符。
大小写、拼写、多余字符会影响吗
HTML5 规范中 不区分大小写，但实际工程中要小心这些细节：
-
缺少末尾感叹号 → 怪异模式（不是拼写错误，是语法不匹配）合法但无必要，反而增加出错概率是 HTML4 写法，仍触发标准模式，但已过时，不推荐
结论：统一用全小写 ，不加引号、不加 DTD 路径、不加注释、不混用大小写。
为什么删掉 DOCTYPE 页面还能显示？这很危险
浏览器会降级兜底，自动启用怪异模式模拟 IE5 行为——盒模型变成 border-box、getComputedStyle 返回值异常、document.body.clientWidth 计算逻辑不同。这些差异不会报错，但会让 CSS 布局在不同浏览器间表现不一致，尤其在涉及百分比宽度、浮动清除、表格对齐时极易踩坑。真正复杂的是：这些问题往往只在特定设备或缩放比例下才浮现，调试成本远高于一开始就写对 。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
