दृश्टीन लिपलां

दृश्टीन एक घटक लिपोवचो आनी तरी लेगीत ताका सहाय्यक तंत्रज्ञानांक (देखीक स्क्रीन रीडर) उक्तो करपाक परवानगी दिवची .visually-hidden. पूर्वनिर्धारीतपणान घटक दृश्टीन लिपोवपाखातीर वापरात .visually-hidden-focusable, पूण तो केंद्रीत आसतना तो दाखोवपाखातीर वापरात (देखीक फकत कीबोर्ड वापरप्यान). .visually-hidden-focusableतशेंच कंटेनराक लागू करूं येता–आभार :focus-within, कंटेनराच्या खंयच्याय बाल घटकाक फोकस मेळटा तेन्ना कंटेनर दाखयतले.

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