HTML4 DOCTYPE必须带完整DTD URL，如Strict型为<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">，缺URL会触发怪异模式，导致盒模型、行高等渲染异常。
HTML4 的 DOCTYPE 怎么写，为什么不能乱缩写
HTML4 有三种文档类型，但实际项目里基本只用 Strict 和 Transitional。它们必须带完整的 DTD URL，否则浏览器可能进怪异模式（Quirks Mode），导致盒模型、行高、表单控件渲染全都不一样。
常见错误是只写 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> —— 缺少 URL，浏览器无法定位 DTD，等同于没写。
-
HTML4 Strict：不支持表现性标签（如<font>、<center>），适合语义化开发<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
-
HTML4 Transitional：兼容旧标签，适合改造老站<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
HTML5 的 DOCTYPE 就一行，但大小写和空格有讲究
HTML5 的 <!DOCTYPE html> 不区分大小写，但必须是这七个字符（html 小写），且前后不能多空格、不能加引号、不能拼错成 htm 或 HTML5。哪怕写成 <!doctype html> 或 <!DOCTYPE HTML> 都能工作，但统一用小写是规范做法，也避免团队协作时被 ESLint 或预处理器报错。
它不指向任何 DTD，只是触发标准模式（Standards Mode）的开关。没有 URL，也不需要联网验证。
立即学习“前端免费学习笔记（深入）”；
- ✅ 正确：
<!DOCTYPE html> - ❌ 错误：
<!DOCTYPE html5>、<!DOCTYPE HTML PUBLIC "">、<!DOCTYPE html >（尾部空格在某些旧构建工具里会出问题）
记不住？直接用编辑器 snippet 或模板文件
死记硬背容易混淆 HTML4 的 URL 路径或大小写，不如把最常用的几种存成可复用片段：
- VS Code 用户：配置用户代码片段（
html.json），绑定前缀如doc4s→ HTML4 Strict，doc5→ HTML5 - Sublime / Vim：用 snippet 插件或自定义模板文件，新建 HTML 时自动插入
- 团队项目：在
templates/下放html4-strict.html和html5.html，新人直接复制粘贴
比查文档快，也比每次 Google 更可靠——毕竟连 W3C 官网现在都默认推 HTML5，HTML4 的 DTD 地址早就不在首页显眼位置了。
混用或漏写 DOCTYPE 会导致什么实际问题
没声明或声明错误，浏览器会退回到 Quirks Mode，典型表现包括：
-
box-sizing: border-box在 IE8–IE11 下失效（宽度计算回归 content-box） -
line-height在表格单元格中异常偏高 -
getBoundingClientRect()返回值在 Chrome/Firefox 下与预期不符 - CSS 选择器如
input[type="number"]::-webkit-inner-spin-button根本不生效
这些问题不会报错，调试时往往绕半天才想到查 DOCTYPE —— 所以与其事后排查，不如把正确的声明设为新建文件的默认头。
