Прескокнете до главната содржина Прескокнете до навигацијата со документи
Check
in English

Визуелно скриен

Користете ги овие помошници за визуелно да ги скриете елементите, но да ги одржувате достапни за помошните технологии.

Визуелно сокријте елемент додека сè уште ќе му дозволите да биде изложен на помошни технологии (како што се читачи на екран) со .visually-hidden. Користете .visually-hidden-focusableза визуелно да се скрие елементот стандардно, но за да се прикаже кога е фокусиран (на пр. од корисник само со тастатура). .visually-hidden-focusableможе да се примени и на контејнер – благодарение на :focus-within, контејнерот ќе се прикаже кога кој било детски елемент од контејнерот ќе добие фокус.

Наслов за читачи на екран

Прескокнете до главната содржина
Контејнер со елемент што може да се фокусира .
html
<h2 class="visually-hidden">Title for screen readers</h2>
<a class="visually-hidden-focusable" href="#content">Skip to main content</a>
<div class="visually-hidden-focusable">A container with a <a href="#">focusable element</a>.</div>

И двете visually-hiddenи visually-hidden-focusableисто така може да се користат како мешавини.

// Usage as a mixin

.visually-hidden-title {
  @include visually-hidden;
}

.skip-navigation {
  @include visually-hidden-focusable;
}