Alert 1.x 提供12种可选颜色样式。
#可调用的颜色类,注:具体可参阅 1.x 颜色体系
1 .alert-red
2 .alert-orange
3 .alert-yellow
4 .alert-olive
5 .alert-green
6 .alert-teal
7 .alert-blue
8 .alert-violet
9 .alert-purple
10 .alert-pink
11 .alert-brown
12 .alert-black
#颜色类调用方法
<div class="alert-red">
Best check yo self, you're not looking too good.
</div>
Alert 1.x 提供5种可选图标样式。
#可调用的图标类
.alert-error
.alert-warning
.alert-success
.alert-info
#图标类调用方法
<div class="alert-warning">
<div class="alert-close">×</div>
<div class="alert-icons"></div>
<b>Warning!</b> Best check yo self, you're not looking too good.
</div>
Alert 1.x 提供2种可选结构样式。
<!--结构示例一-->
<div class="alert-success">
<div class="alert-close">×</div>
<div class="alert-icons"></div>
Best check yo self, you're not looking too good.
</div>
<!--结构示例二-->
<div class="alert-success alert-block">
<div class="alert-close">×</div>
<div class="alert-icons"></div>
<b>Warning!</b> Best check yo self, you're not looking too good.
</div>
<div class="alert">
<div class="alert-close">×</div>
<div class="alert-icons"></div>
<b>Warning!</b> Best check yo self, you're not looking too good.
</div>
<div class="alert-warning">
<div class="alert-close">×</div>
<div class="alert-icons"></div>
<b>Warning!</b> Best check yo self, you're not looking too good.
</div>
<div class="alert-error">
<div class="alert-close">×</div>
<div class="alert-icons"></div>
<b>Warning!</b> Best check yo self, you're not looking too good.
</div>
<div class="alert-success">
<div class="alert-close">×</div>
<div class="alert-icons"></div>
<b>Warning!</b> Best check yo self, you're not looking too good.
</div>
<div class="alert-info">
<div class="alert-close">×</div>
<div class="alert-icons"></div>
<b>Warning!</b> Best check yo self, you're not looking too good.
</div>
<div class="alert alert-block">
<div class="alert-close">×</div>
<div class="alert-icons"></div>
<b>Warning!</b> Best check yo self, you're not looking too good.
</div>
<div class="alert-warning alert-block">
<div class="alert-close">×</div>
<div class="alert-icons"></div>
<b>Warning!</b> Best check yo self, you're not looking too good.
</div>
<div class="alert-error alert-block">
<div class="alert-close">×</div>
<div class="alert-icons"></div>
<b>Warning!</b> Best check yo self, you're not looking too good.
</div>
<div class="alert-success alert-block">
<div class="alert-close">×</div>
<div class="alert-icons"></div>
<b>Warning!</b> Best check yo self, you're not looking too good.
</div>
<div class="alert-info alert-block">
<div class="alert-close">×</div>
<div class="alert-icons"></div>
<b>Warning!</b> Best check yo self, you're not looking too good.
</div>
<div class="alert-red">
Best check yo self, you're not looking too good.
</div>
<div class="alert-orange">
Best check yo self, you're not looking too good.
</div>
<div class="alert-yellow">
Best check yo self, you're not looking too good.
</div>
<div class="alert-olive">
Best check yo self, you're not looking too good.
</div>
<div class="alert-green">
Best check yo self, you're not looking too good.
</div>
<div class="alert-teal">
Best check yo self, you're not looking too good.
</div>
<div class="alert-blue">
Best check yo self, you're not looking too good.
</div>
<div class="alert-violet">
Best check yo self, you're not looking too good.
</div>
<div class="alert-purple">
Best check yo self, you're not looking too good.
</div>
<div class="alert-pink">
Best check yo self, you're not looking too good.
</div>
<div class="alert-brown">
Best check yo self, you're not looking too good.
</div>
<div class="alert-black">
Best check yo self, you're not looking too good.
</div>