मुख्य विषयवस्तु में जाएं डॉक्स नेविगेशन पर जाएं
in English

दृष्टिगत रूप से छिपा हुआ

तत्वों को देखने के लिए इन सहायकों का उपयोग करें लेकिन उन्हें सहायक तकनीकों तक पहुंच योग्य रखें।

किसी तत्व को अभी भी .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;
}