html文档必须以开头，否则触发怪异模式；为根节点，仅含和；控制解析与加载，承载可见内容，三者职责分明不可越界。
HTML文档必须以开头
浏览器靠它识别这是HTML5文档，不是旧版HTML或XHTML。漏写或写错（比如全小写、空格错位、多斜杠）会导致触发怪异模式（Quirks Mode），页面布局和CSS行为会不可预测。
常见错误现象：margin塌陷异常、box-sizing失效、Flex布局不生效。
必须严格写在第一行，前面不能有任何字符（包括空格、BOM、注释）- 大小写不敏感，但推荐全大写+小写
html组合，即 - 不要加
public或SYSTEM等旧式DTD声明，HTML5不需要
这是HTML树的根节点，所有其他标签都必须嵌套在它里面。很多人误把<script></script>或<div>直接写在<code>外，或插在和之间——浏览器会自动纠错，但可能造成脚本执行时机混乱或DOM解析顺序偏差。
使用场景：国际化项目常在中加lang属性，影响屏幕阅读器和SEO。
-
和是并列子元素，没有先后强制顺序，但惯例先写 -
本身可带lang、dir等全局属性，不建议塞样式或事件 - 别在
里直接写文本内容——会被忽略或意外包裹进
不是装饰性容器，它控制字符编码、视口、标题、资源加载优先级等关键行为。漏掉<meta charset="UTF-8">会导致中文乱码；没写<meta name="viewport">会让响应式布局在手机上失效。
性能影响：CSS文件用<link rel="stylesheet">放在会阻塞渲染；而<script></script>默认也会阻塞，除非加defer或async。
-
<title></title>必须有，且只能出现一次，内容显示在浏览器标签页上 -
<meta charset="UTF-8">应紧贴开头，避免因编码识别延迟导致前几个字节乱码 -
<link>、<style></style>、<script></script>可以放这里，但<script></script>慎用document.write()——它会清空整个页面
所有可见元素——文字、图片、表单、视频——都得放在里。有人把<header></header>、<main></main>、<footer></footer>直接扔到下，结果语义丢失、SEO降权、辅助技术无法识别结构。
容易踩的坑：在里写或标签，浏览器会自动闭合，但可能导致脚本读取document.body时为空或结构错乱。
-
支持onload等事件，但现代开发更倾向用DOMContentLoaded监听 - 不要用
或等过时属性，全部交给CSS控制 - 若需全局JS变量或初始化逻辑，确保DOM已就绪——检查
document.readyState是否为"interactive"或"complete"
<meta charset="UTF-8"><title>页面标题</title><p>Hello World</p>真正容易被忽略的，不是标签怎么写，而是每个层级的职责边界——
