必须使用<!DOCTYPE html>，因为它是HTML5唯一被浏览器认可的现代文档类型声明，能确保标准模式渲染；其他写法可能触发怪异模式，导致布局异常。
html 文档类型必须用 <!doctype html>，别的写法要么过时，要么触发怪异模式。
为什么只能是 <!DOCTYPE html>？
这是 HTML5 唯一被浏览器认可的现代 DOCTYPE。它不区分大小写，但惯例全小写；不带任何参数或版本号，也不需要系统标识（比如旧版的 SYSTEM 或 PUBLIC）。浏览器看到这个声明，就确定以标准模式渲染页面。任何其他形式——比如漏掉空格、多加斜杠、写成 <!doctype html>（虽能工作但不推荐）、或者抄老式 XHTML 的 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" ...>——都可能让 IE 或某些旧环境降级到怪异模式，导致盒模型、高度计算、浮动行为全乱。
常见错误现象和对应修复
页面布局在 Chrome 看正常，IE 或 Edge（旧版）里元素错位、width: 100% 不生效、margin 叠加异常……大概率就是 DOCTYPE 没写对或根本没写。检查时注意以下几点：
- 必须出现在 HTML 文件最开头，前面不能有任何字符（包括空格、BOM、注释）
- 不能写成
<!-- -->—— 注释会使其失效 - 不要写成
<!DOCTYPE HTML5>或<!DOCTYPE html5>—— 浏览器不认识 - 避免复制粘贴时带隐藏 Unicode 字符（比如零宽空格），用纯文本编辑器重打一遍最稳
它和 <html lang="zh-CN"> 有什么关系？
完全无关。<!DOCTYPE html> 只负责告诉浏览器“用标准模式解析”，而 lang 属性影响的是语义、语音朗读、字体回退和部分 CSS 伪类（如 :lang()）。两者要一起写，但不能互相替代。漏掉 lang 不会让页面崩，但漏掉或写错 DOCTYPE，整个渲染基础就偏了。
记住：只要写对 <!DOCTYPE html>，且它在第一行无干扰位置，剩下的事浏览器自己会处理。复杂点在于——很多人根本没意识到，自己改了半天 CSS 却忘了查这一行。
立即学习“前端免费学习笔记（深入）”；
