是语义化导航容器，仅用于主跳转路径如顶部菜单、分页控件等，须用包裹链接并添加aria-label；不可滥用在页脚协议或文章内链接中，且IE8需JS创建元素+CSS声明display。
导航条必须用 <nav></nav> 包裹，但不是所有链接组都适用
浏览器和屏幕阅读器靠 <nav></nav> 识别“主跳转路径”，它不是视觉容器，而是语义断言。常见错误是把页脚的“隐私协议”、文章末尾的“上一篇/下一篇”也塞进 <nav></nav> ——这些属于上下文链接，不构成主导航。
使用场景很明确：顶部主导航菜单、左侧栏目树、分页控件（如“第1页 / 第2页 / 下一页”）；而面包屑、友情链接、社交分享按钮都不该用 <nav></nav>。
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
- 一个页面可有多个
<nav></nav>，比如顶部主导航 + 底部快捷入口，但需用不同aria-label区分用途 -
<nav></nav>内部不要混入 logo 图片、搜索框或按钮——它们不属于导航链接本身 - 若导航是横向排列，样式由 CSS 控制（如
display: flex），<nav></nav>标签本身不带任何默认布局行为
<nav></nav> 里该用 <ul></ul> 还是 <div>？
<p>必须用 <code><ul></ul>（或 <ol></ol>）。导航链接天然具有顺序性与集合性，<ul></ul> 提供语义层级和无障碍支持（屏幕阅读器会读作“列表，共 X 项”），而 <div> 是无意义容器，会切断这一链路。
<p>错误写法：<code><nav><div class="nav-item">首页</div>
<div class="nav-item">关于</div></nav>
立即学习“前端免费学习笔记（深入）”；
正确写法：<nav aria-label="主导航"><ul>
<li><a href="/">首页</a></li>
<li><a href="/about">关于</a></li>
</ul></nav>
-
aria-label是强建议项，不加则屏幕阅读器可能只读“导航”，无法说明这是什么导航 -
<li>不可省略——它是列表项的语义单元，去掉后语义断裂，部分辅助技术会降级为普通文本 - 横向布局靠 CSS 实现（如
ul { display: flex; }），不要用<table> 或浮动 hack <h3>横向导航条嵌套在 <code><header></header>里是否合规？完全合规，而且是推荐结构。因为
<header></header>表示“页面或区块的头部”，不单指顶部横幅；它天然适合包裹站点标识 + 主导航组合。但要注意边界：不能把整个
<header></header>当成导航容器，也不能反过来把<nav></nav>嵌套进<main></main>或<aside></aside>——前者破坏<main></main>的唯一性，后者混淆内容角色。- 典型合法结构：
<header><h1>站点名</h1> <nav aria-label="主导航">...</nav></header> - 禁止结构：
<main><nav>...</nav></main>（<main></main>只能装核心内容，不含导航） -
<header></header>可多次出现，比如每个<article></article>也可有自己的<header></header>，但其中的<nav></nav>必须是该文章内部的局部导航（如章节跳转），而非全站主导航
IE8–IE9 对
<nav></nav>的兼容处理要点IE8 及更早版本完全不认识
<nav></nav>，会把它当作文本节点忽略，导致样式丢失、结构错乱；IE9 支持标签但默认不设display，需手动声明。最小可行方案是两行代码：
document.createElement('nav');加在
的 script 中；再配一条 CSS：nav { display: block; }现代项目若已放弃 IE 支持，可跳过；但若需兼容旧政企系统，这两句缺一不可。
- 仅靠 CSS 重置（如
nav { display: block; }）对 IE8 无效，必须先用 JS 创建元素 - 不用引入 html5shiv 全量库，单行
document.createElement足够，轻量且可控 - 注意：这段 JS 必须在 CSS 加载前执行，否则可能闪动
真正容易被忽略的，是
<nav></nav>的语义边界——它不取决于位置（顶部/底部）、样式（横向/纵向）或数量（一个/多个），而只取决于“用户是否靠它完成主要页面跳转”。一旦这个判断出错，后续所有结构、样式、无障碍适配都会偏移。 - 典型合法结构：
