दृष्टिगत रूप से छिपल बा

कवनो तत्व के दृष्टिगत रूप से छिपाईं जबकि ओकरा के सहायक तकनीक (जइसे कि स्क्रीन रीडर) के संपर्क में आवे के अनुमति दीं .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;
}