Гузаштан ба мундариҷаи асосӣ Ба новбари ҳуҷҷатҳо гузаред
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;
}