Active and Disabled Buttonsحالات تفعيل وتعطيل الأزرار
أتقن تصميم الأزرار وزر الإغلاق في بوتستراب 5.3 من الألوان الدلالية والأزرار المفرغة والأحجام إلى أزرار العرض الكامل عبر d-grid وحالات التعطيل ومكوّن btn-close.
2 صفوف تعليمية
بوتستراب 5
0 مشاهدة
شرح صفوف ومحتوى الفقرة
الصف 1
شرح توضيحي
لتعطيل عنصر <button> حقيقي نضيف السمة المنطقية الأصيلة disabled فيخفض بوتستراب شفافيته إلى 65% ويمنع النقر والتركيز تلقائياً. أما عناصر الرابط <a> فلا تدعم سمة disabled في مواصفة HTML! لذلك لتعطيل رابط مصمم كزر يجب إضافة الكلاس .disabled مع السمتين الإلزاميتين aria-disabled="true" وtabindex="-1" وإزالة الوجهة الفعالة.
كما يمكنك تحويل الزر إلى زر تبديل ثنائي الحالة يحتفظ بوضع الضغط عبر data-bs-toggle="button" مع تحديث aria-pressed="true" تلقائياً.
الصف 2
ملاحظة هامة
جميع فقرات هذا الدرس (الأزرار وزر الإغلاق في بوتستراب 5)