Screenreaders

スクリーンリーダーを除くすべてのデバイスの要素を非表示にします。

.sr-only でスクリーンリーダーを除くすべてのデバイスで要素を非表示できます。.sr-only と .sr-only-focusable を組み合わせると, 要素がフォーカスされているときに再表示します（例：キーボードのみのユーザーなど）。mixinとしても使用可能です。

<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;
}