屏幕阅读器

使用screenreader工具隐藏除屏幕阅读器之外的所有设备上的元素。

透过 .sr-only将一个元素对所有设备隐藏,除了屏幕阅读器,只有屏幕阅读器可以读取到 .sr-only 中的内容。 将 .sr-only.sr-only with .sr-only-focusable 结合,以便在其被 focused 时再次显示该元素(例如通过键盘使用)。也可以用作 Sass mixins。

跳到主要内容
<a class="sr-only sr-only-focusable" href="#content">Skip to main content</a>
// Usage as a mixin
.skip-navigation {
  @include sr-only;
  @include sr-only-focusable;
}