nav仅标记导航区域，多级结构需嵌套列表实现；必须用组织，子菜单嵌套在内并配aria-haspopup/expanded；多nav须用aria-label或aria-labelledby区分；混入非导航内容或单链接会破坏语义。
nav本身不定义层级，只标记“这是主要导航区”；真正的多级结构靠
- 嵌套实现，语义和可访问性都依赖这一组合。
- 用
<ul><li>@#@#@#@#@#@#@#@#@#@0</li></ul>组织一级项 - 子菜单放在对应
<li>内部，再嵌一个<ul class="submenu"></ul> - 避免用
<div> 或 <code><span></span>替代列表项，否则失去焦点流与计数能力（读屏器读不出“共5项，第2项是产品中心”）多级菜单的 HTML 结构要点
二级及以上菜单不是靠 JavaScript 补充的，而是原生 DOM 嵌套。关键在位置和属性：
- 父级
<li>需加aria-haspopup="true"，表明有子菜单 - 同级加
aria-expanded="false"（初始收起），交互时由 JS 动态切换为true - 子
<ul></ul>不要脱离父<li>，否则语义断裂，键盘用户 Tab 到父项后无法进入子项 - 所有
@#@#@#@#@#@#@#@#@#@1），读屏器降级为普通段落，失去导航地标（landmark）作用 - JS 动态渲染的 SPA 导航，若首屏未生成真实
<a href="..."></a>，语义即告缺失
- 父级
nav 是容器，不是菜单生成器
它只是告诉浏览器和读屏器：“这里是一组用于页面跳转的核心链接”。不自动排版、不支持下拉、也不识别父子关系。写成 <nav>首页 产品</nav> 合法但无效——没有结构，辅助技术无法遍历，SEO 也难提取导航意图。
必须配合列表结构才能激活语义价值：
