文档模式与怪异模式

doctype 会影响浏览器选择标准模式、有限怪异模式或怪异模式。它不是用来选择“HTML 版本的运行时”，而是避免历史兼容布局在新页面中被意外触发。

<!doctype html>
<html lang="zh-CN">

在控制台读取 document.compatMode，CSS1Compat 表示标准或有限怪异模式，BackCompat 表示怪异模式。要判断差异，必须在同一浏览器、同一尺寸下比较盒模型、表格和图片等行为；简单文字页面可能看不出变化。

实验与练习

创建带短 doctype 和不带 doctype 的两个文件，比较 compatMode、盒模型和一个无明确高度图片容器的结果。恢复 doctype 后记录哪些差异消失，哪些问题其实来自旧 CSS。

可运行微实验：先复现旧行为再迁移

为旧页面保留一个基线副本，分别在 quirks mode、table layout、float 多列和现代布局下运行。记录 DOM、尺寸、换行和脚本选择结果，再一次只迁移一个约束；迁移后必须用相同输入比较截图和交互行为。

常见错误

• 认为 doctype 是浏览器下载的 HTML 版本。
• 只看页面截图，不读取文档模式。
• 直接删除旧 doctype，却没有先记录布局基线。

继续阅读

下一篇处理旧页面中常见的表格布局：表格布局维护。

练习

1. 用最小输入复现“文档模式与怪异模式”的成功路径，并记录可观察结果。
2. 改变一个时序、数据或宿主条件，解释结果为何变化。
3. 删除清理、校验或降级分支，写出能证明缺陷的断言。

查看本节答案