Alert
Bootstrap menyediakan jalan yang mudah class .alert dalam membuat pesan Alert. Alert dibuat dengan class yang dikuti dengan salah satu dari 4 class contextual
.alert-success
, .alert-info
, .alert-warning
atau.alert-danger
, dengan contoh sebagai berikut:<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>
Alert Links
tambahkan class alert-link untuk memasukkan link didalam box dengan menyesuaikan warna pada color link, contoh sebagai berikut :
Contoh :
<div class="alert alert-success">
<strong>Success!</strong> You should <a href="#"class="alert-link">read this message</a>.
</div>
Closing Alert
untuk dapat menutup pesan peringatan, tambahkan class dalam Class Alert. lalu tambahkan class="close" dan data-dismiss="alert" kepada link atau elemen tombol, sehingga kotak peringatan akan menghilang. Contoh :
<div class="alert alert-success alert-dismissible">
<a href="#" class="close" data-dismiss="alert" aria-label="close">×</a>
<strong>Success!</strong> Indicates a successful or positive action.
</div>
Animated Alert
class .fade dan .in menambah efek fading ketika Alert di close, seperti :
<div class="alert alert-danger fade in">