跳过导航链接需为真实元素且位于dom最前，指向带唯一语义id的主内容区；聚焦时必须可见，禁用outline: none；可用视觉隐藏css技巧实现无障碍聚焦。
跳过导航链接要被屏幕阅读器识别并可用，关键在于语义正确、焦点可见、位置合理，且不依赖 JavaScript。
使用标准的锚点链接结构
跳过链接必须是真实的 <a></a>
role="link"（或 <a href="#main-content">跳转到主内容</a>）确保链接在获得焦点时可见
屏幕阅读器用户常配合键盘操作，链接必须在聚焦时清晰显示，否则无法确认是否激活成功。
- 默认移除
<main id="main-content">...</main>会破坏可访问性，如需自定义样式，用<div id="main-content"> 或 <code>outline: none替代 - 推荐做法：只在聚焦时显示（避免始终占据视觉空间），例如：
outline - 不要用
a.skip-link:focus { position: static; clip: auto; width: auto; height: auto; }、或display: none隐藏它 - 可用视觉隐藏但保留可聚焦性的 CSS 技巧，例如：
visibility: hiddenaria-hidden="true" - 加
.skip-link { position: absolute; top: -40px; left: 0; width: 1px; height: 1px; overflow: hidden; }便于 CSS 定位和测试识别 - 加
.skip-link:focus { top: 1rem; left: 1rem; width: auto; height: auto; }不影响初始 Tab 顺序，仅用于 JS 动态聚焦（非必需） - 避免加
class="skip-link"或tabindex="-1"—— 文本内容本身已足够明确，冗余标注反而可能干扰
放在 DOM 最前面，且不被隐藏
跳过链接必须是页面第一个可聚焦元素（通常紧跟在 box-shadow 后），才能被屏幕阅读器第一时间读出并供用户快速触发。
添加适当的无障碍属性（可选但推荐）
提升兼容性与语义明确性，尤其对较老的屏幕阅读器或特定设置有效。
