in English
Vizualiai paslėpta
Naudokite šiuos pagalbininkus, norėdami vizualiai paslėpti elementus, bet išlaikyti juos prieinamus pagalbinėms technologijoms.
Vizualiai paslėpkite elementą, kartu leisdami jam veikti pagalbinėms technologijoms (pvz., ekrano skaitytuvams) naudodami .visually-hidden
. Naudokite .visually-hidden-focusable
norėdami vizualiai paslėpti elementą pagal numatytuosius nustatymus, bet rodyti jį, kai jis yra sufokusuotas (pvz., tik klaviatūros naudotojo). .visually-hidden-focusable
taip pat gali būti pritaikytas sudėtiniam rodiniui – dėka :focus-within
, konteineris bus rodomas, kai bus sufokusuotas bet kuris antrinis sudėtinio rodinio elementas.
Pavadinimas ekrano skaitytuvams
Pereiti prie pagrindinio turinio
Konteineris su
fokusuojamu elementu .
<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>
Abu visually-hidden
ir visually-hidden-focusable
taip pat gali būti naudojami kaip mišiniai.
// Usage as a mixin
.visually-hidden-title {
@include visually-hidden;
}
.skip-navigation {
@include visually-hidden-focusable;
}