Aqbeż għall-kontenut prinċipali Aqbeż għan-navigazzjoni tad-dokumenti
Check
in English

Viżwalment moħbija

Uża dawn l-helpers biex taħbi viżwalment l-elementi iżda żżommhom aċċessibbli għal teknoloġiji ta’ assistenza.

Aħbi viżwalment element filwaqt li xorta tħallih jiġi espost għal teknoloġiji ta' assistenza (bħal screen readers) b' .visually-hidden. Uża .visually-hidden-focusablebiex taħbi viżwalment element awtomatikament, iżda biex turih meta jkun iffukat (eż. minn utent tat-tastiera biss). .visually-hidden-focusablejista 'jiġi applikat ukoll għal kontenitur—grazzi għal :focus-within, il-kontenitur se jintwera meta kwalunkwe element tifel tal-kontenitur jirċievi fokus.

Aqbeż għall-kontenut prinċipali
Kontenitur b'element li jista' jiffoka .
html 
<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>

It- tnejn visually-hiddenu visually-hidden-focusablejistgħu jintużaw ukoll bħala mixins.

// Usage as a mixin

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

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