ප්‍රධාන අන්තර්ගතය වෙත යන්න ලේඛන සංචාලනය වෙත යන්න
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;
}