Main content ah kal rawh Docs navigation ah kal rawh
Check
in English

Hmuh theiha thup

Heng helper te hi hmang la, elements te chu hmuh theiha thup la mahse assistive technology te hman theih turin hmang ang che.

Element pakhat chu hmuh theihin thup la, chutih rualin assistive technology (screen reader ang chi) hmanga inhriat theihna tur a la phalsak .visually-hiddenbawk. .visually-hidden-focusableElement pakhat chu default-a hmuh theiha thup nan hmang la , mahse a focus laiin a lantir theih nan hmang ang che (eg keyboard-only user-in). .visually-hidden-focusablecontainer-ah pawh hman theih a ni–thanks to :focus-within, container-a child element eng pawhin focus a dawn hunah container chu a lang ang.

Screen reader te tan title a awm

Main content ah kal rawh
A container pakhatah chuan focusable element a awm a .
html tih a ni
<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>

Both visually-hiddenleh visually-hidden-focusablemixin atan pawh hman theih a ni.

// Usage as a mixin

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

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