آموزش بوت استرپ

ساخت هشداردهنده alert در بوت استرپ bootstrap

بررسی و آشنایی با نحوه ساخت ،ایجاد و کار  با alerts  در بوت استرپ bootstrap  ، چگونه خط هشدار را با بوت استرپ ایجاد کنیم.

هشدارها

بوت استرپ  bootstrap یک راه آسان برای ایجاد پیام های هشداردهنده alerts از پیش تعریف شده می باشد:

هشدارها  alertsبا کلاس .alert ایجاد می شوند و به دنبال آن یکی از چهار کلاس متنی هستند .alert-success، .alert-info، .alert-warning یا .alert-danger:

 

ساخت لینک هشداردهده

با کلاس alert-link براحتی می توانید لینک های هشدار دهنده به رنگ های مختلف ایجاد کنید.

برای این کار کافی است کلاس alert-link را درون جعبه ای که می خواهید هشدار دهنده باشد قرار دهید.

 

بسته شدن هشداردهنده

برای بستن پیام هشدار، یک کلاس .alert-dismissable را به ظرف هشدار اضافه کنید. سپس کلاس = “close” و “data-dismiss = “alert را به یک پیوند یا یک عنصر دکمه اضافه کنید (وقتی روی این کلیک میکنید کادر هشدار ناپدید می شود).

ویژگی aria * و & times؛ توضیح

برای کمک به ارتقاء قابلیت دسترسی برای افرادی که از screen reader  ماننده تبلت و موبایل استفاده می کنند، باید هنگام ایجاد یک دکمه بستن، آرگومان “aria-label = “close را اضافه کنید.

&time؛ (×) عنصر HTML است که نماد مورد نظر برای دکمه های نزدیک است، به جای حرف “x”.

هشدارهای متحرک

Animated Alerts در بوت استرپ bootstrap

کلاس های fade و .in در هنگام بستن پیام هشدار یک اثر محو کننده می افزاید:

 

نوشته های مشابه

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

بستن