Accessibility
Sr Only
The sr-only
utility only shows an element to screen readers. It is hidden on all other devices.
Utility | Value |
---|---|
sr-only | border:0; clip:rect(0, 0, 0, 0); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; white-space:nowrap; width:1px; |
Sr Only Focusable
The sr-only-focusable
utility should be used with sr-only
. It only displays an element when focused by a keyboard.
Copied!
<a class="btn btn-link sr-only sr-only-focusable" href="#skip-to-content"
>Skip to Content</a
>