html文档结构核心是、、三个必需容器，顺序不可乱；必须为唯一根元素且直接包裹和；中须置于最前以防乱码；任何内容出现在前会被隐式归入，bom等不可见字符亦会干扰解析。
HTML 文档结构不是“先写什么再写什么”的流程，而是围绕浏览器如何解析和渲染来组织的——核心是 、、 这三个必需容器，缺一不可，顺序不能乱。
为什么
浏览器启动解析时，遇到第一个非注释、非空格的标签就必须是 ；如果漏掉，或把它包在别的标签里（比如 <div>...</div>），会导致 DOM 构建异常：部分样式不生效、JavaScript 获取 document.documentElement 失败、SEO 元信息被忽略。
-
是整个文档的唯一根节点，document.documentElement指向它 - 它必须直接包裹
和，中间不能插其他标签 - 某些编辑器或 CMS 会自动补全，但手写时务必显式写出 —— 不要依赖自动修复
不渲染内容，但它决定页面怎么加载、怎么被识别。很多初学者只放 <title></title>，结果遇到编码乱码、字体加载失败、HTTPS 资源被拦截等问题。
-
<meta charset="UTF-8">必须放在最前面（越早声明越好），否则浏览器可能按默认编码（如 ISO-8859-1）解析后续 HTML，导致中文变乱码 -
<meta name="viewport" content="width=device-width, initial-scale=1">不加的话，移动端页面会以桌面宽度缩放显示，文字小到看不清 -
<link rel="stylesheet" href="style.css">的位置影响渲染阻塞：CSS 在中会阻塞渲染，但这是预期行为；放在底部会导致页面先闪白再样式化 -
<script></script>标签默认同步执行，放在里会阻塞 HTML 解析 —— 如需立即执行且无依赖，可加defer或移至底部
严格来说，不能。任何文本、空格、注释出现在 之前（但在 内），都会被浏览器当作 的隐式子内容处理 —— 这不是 bug，是 HTML 规范定义的“纠错机制”，但后果难控。
- 例如：
Hello<p>World</p>中的Hello会被当成的第一个文本节点，位置在<p></p>上方，且无法用 CSS 精确控制其样式 - 服务器返回的 BOM（字节序标记）也可能导致类似问题：UTF-8 BOM（
EF BB BF）出现在文件开头，会让浏览器误判为不可见字符，进而触发隐式插入 - 验证方式：用浏览器开发者工具查看 Elements 面板，确认所有内容是否都在预期的
内部
真正麻烦的不是结构本身，而是那些看不见的细节：BOM、换行符、自动补全逻辑、解析容错机制——它们让“写对”比“写出来”难得多。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
