辅助功能 跳过链接
为什么
使用键盘、屏幕阅读器、开关控制和其他辅助技术的人可以使用跳过链接更轻松、更快速地访问主要内容或其他重要部分。
什么
最常见的跳过链接是页面上的第一个交互元素。它将用户带到主要内容，跳过徽标、搜索和导航等全局元素。它几乎总是隐藏的，直到它获得焦点。
如何
自己试试
HTML
跳过链接的 HTML 很简单。
假设您在您的站点中使用了 <header> 和 <main>，就像您在 地标 中学到的那样。跳过链接是一个全局元素，因此您应该将其包含在 <header> 中。您还需要在 <main> 上有一个 ID，以便能够使用锚点链接到它。
<header>
<a href="#main" class="skip">跳到主要内容</a>
…
</header>
…
<main id="main">
就是这样。无需 JavaScript。一个链接和一个 ID。
CSS
您可能在 HTML 中注意到了，链接具有类 skip，以便我们能够隐藏它。
.skip {
position: absolute;
left: -10000px;
top: auto;
width: 1px;
height: 1px;
overflow: hidden;
}
此代码将链接移到浏览器外部。如果您不熟悉绝对定位，请阅读有关 CSS position 属性 的信息。1px 大小和 overflow: hidden; 用于用户已禁用绝对定位的特殊情况。
当链接获得焦点时，它必须可见。这也通过 CSS 完成
.skip:focus {
position: static;
width: auto;
height: auto;
}
此方法对依赖键盘和类似输入的用户非常有用且重要。如果您有一个复杂的站点，您可能希望添加更多跳过链接，而不仅仅是到主要内容。我们稍后将介绍。
