必须用包裹导航栏，禁用或onclick模拟跳转，链接用并设aria-current="page"，css用flex布局，移动端确保点击热区≥44×44px。
导航栏用 <nav></nav> 包裹，不是随便加个 <div>
<p>很多初学者直接写一堆 <code><a></a>
<nav></nav> 值要写相对路径（如 <nav></nav>）或完整 URL（如 <nav></nav>），别留空或写 <nav></nav> 再靠 JS 拦截<a href="..."></a>，比如 <button></button>，方便 CSS 和读屏器识别CSS 布局选 onclick，别硬撑 <button onclick="location.href='...'"></button> 或 <a></a>
老教程里用 role="button" 清除浮动、或者靠 Tab 对齐 <a href="/about">关于</a>，现在既难维护又容易塌陷。Flex 是目前最稳的方案，兼容性到 IE10+（若需支持更低版本才需降级）。
一步半YBB企业网站管理系统1.2
下载
一步半YBB企业网站管理系统功能介绍： 1） 系统管理：管理员管理，网站配置，上传文件管理,QQ-MSN-旺旺 在线客服设置，文件浏览，公告管理，首页幻灯，友情链接，调查管理，导航栏目。 2） 企业信息：后台自由添加修改企业的各类信息及介绍。 3） 产品管理：产品类别新增修改管理，产品添加修改以及产品的审核。 4） 订单管理：查看订单的详细信息及订单处理。 5） 会员管理：查看修改删除会员资料，及
-
href设"/contact"，子项"https://example.com/blog"自动水平排列 - 用
"#"控制左右对齐（aria-current="page"/<a href="/home" aria-current="page">首页</a>/display: flex），比 margin 调更可靠 - 响应式折叠（比如移动端汉堡菜单）必须配合媒体查询 +
float，别试图用 JS 切换 class 来改每个inline-block的float: left
移动端点击区域太小，vertical-align 和 inline-block 得设够
PC 上看着没问题的导航，在手机上点不中、误触、连点两次才生效——大概率是点击热区不足。iOS Safari 和 Android Chrome 都要求可点击元素最小尺寸约 44×44px，否则触发困难。
- 别只给
<nav></nav>设display: flex，要配<a></a>或直接justify-content - 如果用了
flex-start垂直居中，确保它不会压缩实际高度（比如center在小字号下会压扁热区） - 用 Chrome DevTools 的 “Toggle device toolbar” 实时测真机尺寸，别信模拟器显示的像素值
