التنبيهات
Bootstrap يوفر طريقة سهلة لإنشاء رسائل التنبيه مسبقا:
× النجاح! يشير هذا المربع في حالة تأهب عمل ناجح أو إيجابيا.
× معلومات! يشير هذا مربع التنبيه تغيير بالمعلومات محايد أو العمل.
× تحذير! يشير هذا مربع التنبيه تحذيرا التي قد تحتاج إلى عناية.
× خطر! يشير هذا المربع في حالة تأهب عمل خطير أو سلبي محتمل.
يتم إنشاء التنبيهات مع .alert الطبقة، تليها واحدة من الطبقات السياقية أربعة .alert-success ، .alert-info ، .alert-warning أو .alert-danger :
مثال
<div class="alert alert-success">
<strong>Success!</strong>
Indicates a successful or positive action.
</div>
<div class="alert alert-info">
<strong>Info!</strong> Indicates a neutral informative change or action.
</div>
<div class="alert alert-warning">
<strong>Warning!</strong> Indicates a warning that might need attention.
</div>
<div class="alert alert-danger">
<strong>Danger!</strong> Indicates a dangerous or potentially negative
action.
</div>
انها محاولة لنفسك » تنبيهات الإغلاق
لإغلاق رسالة تنبيه، إضافة class="close" و data-dismiss="alert" إلى ارتباط أو عنصر الزر:
مثال
<div class="alert alert-success">
<a href="#"
class="close" data-dismiss="alert" aria-label="close">×</a>
<strong>Success!</strong> Indicates a successful or positive action.
</div>
انها محاولة لنفسك » و aria-* السمة و × شرح
للمساعدة في تحسين إمكانية الوصول للأشخاص الذين يستخدمون قارئات الشاشة، يجب أن تشمل aria-label="close" السمة، عند إنشاء زر الإغلاق.
× (×) × (×) هو كيان HTML الذي هو رمز المفضل للأزرار وثيق، وبدلا من الحرف "x" .
تنبيهات المتحركة
و .fade و .in الطبقات يضيف تأثير يتلاشى عند إغلاق رسالة تنبيه:
اختبر نفسك مع تمارين!
التمرين 1 » التمرين 2» التمرين 3 »
استكمال Bootstrap تنبيه المرجعي
للإشارة كاملة لجميع خيارات التنبيه والأساليب والأحداث، انتقل إلى لدينا Bootstrap شبيبة تنبيه المرجعي .