انتقل إلى محتوى الدرس

BootStrap Closing Alerts اغلاق التحذيرات في bootstrap

سوف تتعلم في هذا الدرس استخدام الرسايل الملونة مثل التحذيرات ورسايل الخطر ورسايل النجاح في فعل شئ ما بواسطة bootstrap.

1 صفوف تعليمية
Bootstrap
2,835 مشاهدة

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي

التحذيرات هي عناصر غير اساسية في الصفحة, وتظهر فقط عند حدوث action حدث معين داخل الموقع ويجب ان يتم وضع زر لاخفائها.

يوفر bootstrap اماكانية اخفاء التحذيرات على خطوتين:

  • اولا: اضافة كلاس alert-dismissible الى العنصر الذي قمت باعطائه كلاس alert.
  • ثانيا: انشاء عنصر button او link داخل عنصر التحذير ونقوم باضافة كلاس btn-close و attribute اخر هو "data-bs-dismiss = "alert الى هذا الزر.


Alert Closing

عمل زر لاغلاق التحذير بساتخدام كلاس alert-dismissible.

HTML
<div class="alert alert-success alert-dismissible">
   <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
   <strong>Light!</strong> Light grey alert.
</div>