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;
}