最标准、最无障碍的方式是在当前页面的导航链接上使用 aria-current="page" 属性，仅限 <a> 标签，配合 CSS 属性选择器实现视觉高亮，不可用 class="active" 替代或重复添加。
在导航菜单中标识当前页面的链接，最标准、最无障碍的方式是使用 aria-current="page" 属性。
什么时候用 aria-current="page"
当某个导航链接指向用户当前正在浏览的页面时，就应加上这个属性。它不是用来标记“选中状态”或“高亮样式”的视觉效果，而是向屏幕阅读器等辅助技术明确传达：“这个链接代表你此刻所在的位置”。
- 适用于顶部导航栏、侧边栏菜单、分页、面包屑中的当前页链接
- 只加在
<a>标签上（不能加在<li>或容器上） - 不要同时加
aria-current="page"和aria-current="true"—— 后者语义不明确，应避免
基本写法示例
假设当前页面是 /products，导航中对应链接应这样写：
浏览器正常渲染，视觉样式不变；但屏幕阅读器会读作“产品（当前页面）”。
立即学习“前端免费学习笔记（深入）”；
配合 CSS 实现视觉高亮
aria-current 本身不影响样式，但你可以用属性选择器来统一控制外观：
color: #007bff;
font-weight: bold;
}
这样既保持语义正确，又无需额外 class，维护更干净。
