html5文档层级由语义化标签嵌套决定：main必须唯一且不嵌套于header等标签内；article表独立内容，section作主题分组；header/footer可多级复用但须匹配上下文；nav仅含导航链接，aside放非必需补充信息。
HTML5 文档层级不是靠视觉缩进或样式决定的，而是由语义化标签之间的嵌套关系真实构建的 DOM 树结构。这种结构直接反映内容的逻辑归属：外层标签是容器，内层标签是被包含的内容主体。用对标签，浏览器、屏幕阅读器和搜索引擎才能准确理解“谁属于谁”。
main 必须独立且居中
- 正确写法：
<header>...</header><main>正文内容</main><footer>...</footer> - 错误写法：
<header><main>...</main></header>（main 被包裹在 header 中，语义冲突） - 错误写法：
<main><main>...</main></main>（重复 main，浏览器只识别第一个）
article 和 section 的嵌套有明确分工
- 一个
内可以包含多个 ，比如一篇博客文章里分“背景”“方法”“结论”几个小节 - 一个
内也可以包含多个 ，比如“最新评论区”这个区块里列出多条用户留言 - 两者都支持嵌套，但不能互相替代：用
包裹整篇新闻是错的，因为它不是“分组”，而是独立内容
header 和 footer 可多级复用，但需匹配上下文
- 页面级
通常含网站 Logo 和主导航 - 文章级
可含文章标题、作者、发布时间，放在 开头 - 同理，
内的 - 关键点：每个
应描述其直接父容器的主题，而非全局主题
nav 和 aside 要严格限定作用范围
- 两者都可以出现在
内部，也可以作为兄弟元素与 并列，取决于设计意图
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
