不是必须，但强烈建议用包裹；因其是html5语义化标签，能提升可访问性与seo，多个导航区需分别包裹并配aria-label区分，禁混入搜索框、登录按钮等非导航内容。
导航栏必须用 <nav></nav> 包裹吗？
不是必须，但强烈建议。浏览器和读屏软件会把 <nav></nav> 当作语义化导航区域识别，不加它不影响显示，但会影响可访问性和 SEO。如果只是几个链接堆在页首，用 <div> 也能跑通；但一旦有多个导航（比如顶部主菜单 + 侧边分类 + 底部快捷入口），不用 <code><nav></nav> 就容易混淆结构。
实操建议：
- 主导航用
<nav></nav>，次要导航（如“友情链接”）也可单独套一层<nav></nav>，但别嵌套 - 避免把搜索框、登录按钮硬塞进同一层
<nav></nav>—— 它们不属于导航逻辑，该用<header></header>或<aside></aside>分开 - 没 JS 时，纯 HTML 导航靠
<a></a>链接驱动，确保每个href值真实有效，别留href="#"占位
display: flex 布局下，justify-content 选哪个值最稳？
多数情况选 justify-content: space-between，不是因为“好看”，而是它对子项数量变化鲁棒性最强：2 个菜单项自动撑满，5 个也不会挤成一团。用 flex-start 或 center 在响应式断点切换时容易错位，尤其配合 media query 隐藏部分菜单后。
注意点：
- 如果导航项文字长度差异大（比如“首页” vs “关于我们”），
space-between可能导致间距不均，这时改用space-around更均衡 - 别忘了给
<nav></nav>设display: flex，只设子项display: inline-block是老办法，响应式时难控制 - 移动端折叠菜单前，先用
flex-wrap: wrap防止换行错乱，而不是等溢出再加 JS 控制
下拉菜单的 <ul></ul> 子菜单要不要加 aria-hidden="true"？
要，而且得动态切换。静态写死 aria-hidden="true" 会让读屏器直接跳过整个子菜单，哪怕它正展开着。正确做法是 JS 控制显隐时，同步更新 aria-hidden 和 aria-expanded 属性。
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
常见错误现象：
- 鼠标悬停展开，键盘
Tab却进不去子项 —— 缺少tabindex="0"和aria-hidden动态管理 - 用
display: none隐藏子菜单，但没配aria-hidden="true"，读屏器仍会朗读不可见内容 - 父级
<a></a>没加aria-haspopup="true"，辅助工具无法识别这是触发下拉的控件
移动端汉堡菜单的 aria-controls 怎么关联才不出错？
必须让汉堡按钮的 aria-controls 值，严格等于目标菜单容器的 id，大小写、连字符、空格一个都不能差。浏览器不会报错，但读屏器找不到对应元素，用户按 Enter 后不知道菜单在哪展开。
实操细节：
- 按钮写
<button aria-controls="main-menu"></button>，菜单容器就得是<ul id="main-menu"></ul>，不能是id="MainMenu"或id="main_menu" - 别用 JS 动态生成
id（比如加时间戳），否则aria-controls和id对不上 - 菜单展开后，记得给
<ul></ul>加role="menu"，子项<li>里<a></a>加role="menuitem"，这是键盘导航的基础
真正麻烦的不是写几行 HTML，而是所有语义属性、ARIA 标签、焦点流、键盘操作路径都得对齐 —— 少一个，就可能卡住某类用户。动手前先用 Chrome 的 Lighthouse 跑一次“可访问性”审计，比肉眼检查靠谱得多。
