الفرق بين المراجعتين لصفحة: «Bootstrap/screenreaders»
إنشاء الصفحة |
لا ملخص تعديل |
||
| (3 مراجعات متوسطة بواسطة مستخدمين اثنين آخرين غير معروضة) | |||
| سطر 1: | سطر 1: | ||
<noinclude>{{DISPLAYTITLE:قارئات الشاشة Screenreaders في إطار العمل Bootstrap}}</noinclude> | <noinclude>{{DISPLAYTITLE:قارئات الشاشة Screenreaders في إطار العمل Bootstrap}}</noinclude> | ||
استخدم أدوات قارئات الشاشة التي يقدّمها إطار العمل Bootstrap لإخفاء العناصر على جميع الأجهزة ما عدا قارئات الشاشة. | |||
يُستخدَم الصنف <code>.sr-only</code> لإخفاء عنصُر على جميع الأجهزة '''ما عدا قارئات الشاشة'''. استخدم الصنف <code>.sr-only-focusable</code> إلى جانب الصنف <code>.sr-only</code> لإظهار العنصُر مرةً أخرى عند تلقّيه المؤشّر (مثلًا بالنسبة للزوّار الذين يستخدمون لوحة المفاتيح فقط). يتوافر الصنفان بصيغة [[Sass/mixins|المخاليط في Sass]] أيضًا.<syntaxhighlight lang="html"> | |||
<a class="sr-only sr-only-focusable" href="#content">الانتقال إلى المحتوى الرئيسيّ</a> | |||
</syntaxhighlight><syntaxhighlight lang="sass"> | |||
// استخدام المخلوط | |||
.skip-navigation { | |||
@include sr-only; | |||
@include sr-only-focusable; | |||
} | |||
</syntaxhighlight> | |||
== مصادر == | |||
* [https://getbootstrap.com/docs/4.5/utilities/screen-readers/ صفحة Screenreaders في توثيق Bootstrap]. | |||
[[تصنيف:Bootstrap|{{SUBPAGENAME}}]] | |||
[[تصنيف:Bootstrap utilities|{{SUBPAGENAME}}]] | |||
المراجعة الحالية بتاريخ 08:38، 13 يوليو 2020
استخدم أدوات قارئات الشاشة التي يقدّمها إطار العمل Bootstrap لإخفاء العناصر على جميع الأجهزة ما عدا قارئات الشاشة.
يُستخدَم الصنف .sr-only لإخفاء عنصُر على جميع الأجهزة ما عدا قارئات الشاشة. استخدم الصنف .sr-only-focusable إلى جانب الصنف .sr-only لإظهار العنصُر مرةً أخرى عند تلقّيه المؤشّر (مثلًا بالنسبة للزوّار الذين يستخدمون لوحة المفاتيح فقط). يتوافر الصنفان بصيغة المخاليط في Sass أيضًا.
<a class="sr-only sr-only-focusable" href="#content">الانتقال إلى المحتوى الرئيسيّ</a>
// استخدام المخلوط
.skip-navigation {
@include sr-only;
@include sr-only-focusable;
}