Asosiy tarkibga o'tish Hujjatlar navigatsiyasiga oʻtish
Check
in English

Vizual ravishda yashirin

Elementlarni vizual ravishda yashirish uchun ushbu yordamchilardan foydalaning, lekin ularni yordamchi texnologiyalar uchun ochiq holda saqlang.

Elementni vizual ravishda yashirish va unga yordamchi texnologiyalar (masalan, ekranni o'qish dasturlari) bilan ta'sir qilishiga ruxsat berish .visually-hidden. Sukut bo'yicha elementni vizual ravishda yashirish uchun foydalaning .visually-hidden-focusable, lekin uni diqqat markazida bo'lganda ko'rsatish uchun (masalan, faqat klaviatura foydalanuvchisi tomonidan). .visually-hidden-focusablekonteynerga ham qo'llanilishi mumkin - tufayli :focus-withinkonteynerning har qanday yordamchi elementi fokusni olganida konteyner ko'rsatiladi.

Asosiy tarkibga o'tish
Fokuslanadigan elementi bo'lgan konteyner .
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>

Ikkalasi ham visually-hidden, visually-hidden-focusablearalash sifatida ham ishlatilishi mumkin.

// Usage as a mixin

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

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