Alert 提示
文字提示
使用ax-alert类表示提示，默认颜色是黄色（warning）。
这是一个告示。
提醒注意。
提醒注意。
<div class="ax-alert">这是一个告示。<br />提醒注意。</div>
颜色
本框架一共定义了7种颜色提示，分别是ax-primary，ax-secondary，ax-success，ax-danger，ax-warning(默认)，ax-info，ax-light。详细说明和举例如下：
主色。
与系统颜色保持一致。
与系统颜色保持一致。
次要色
操作成功！
很危险！
提示注意！
这是一个广告！
名词解释
浅灰色文字提示
<div class="ax-alert ax-primary">主色。<br />与系统颜色保持一致。</div>
<div class="ax-break-md"></div>
<div class="ax-alert ax-secondary">次要色</div>
<div class="ax-break-md"></div>
<div class="ax-alert ax-success">操作成功！</div>
<div class="ax-break-md"></div>
<div class="ax-alert ax-danger">很危险！</div>
<div class="ax-break-md"></div>
<div class="ax-alert ax-warning">提示注意！</div>
<div class="ax-break-md"></div>
<div class="ax-alert ax-ad">这是一个广告！</div>
<div class="ax-break-md"></div>
<div class="ax-alert ax-info">名词解释</div>
<div class="ax-break-md"></div>
<div class="ax-alert ax-light">浅灰色文字提示</div>
无边框
提示默认带有边框，使用ax-borderless可取消边框。
主色。
与系统颜色保持一致。
与系统颜色保持一致。
次要色
<div class="ax-alert ax-primary ax-borderless">主色。<br />与系统颜色保持一致。</div>
<div class="ax-break-md"></div>
<div class="ax-alert ax-secondary ax-borderless">次要色</div>
方边
提示默认带有3px的圆角，使用ax-square可取消圆角。
主色。
与系统颜色保持一致。
与系统颜色保持一致。
次要色
<div class="ax-alert ax-primary ax-square">主色。<br />与系统颜色保持一致。</div>
<div class="ax-break-md"></div>
<div class="ax-alert ax-secondary ax-square">次要色</div>
使用关闭按钮 JS
在ax-alert中加入ax-close的类标签即可。点击可关闭该提示。
<div class="ax-alert ax-primary">主色。<br />与系统颜色保持一致。<a href="###" class="ax-close"></a></div>
<div class="ax-break-md"></div>
<div class="ax-alert ax-secondary">次要色<a href="###" class="ax-close"></a></div>
<div class="ax-break-md"></div>
<div class="ax-alert ax-success">操作成功！<a href="###" class="ax-close"></a></div>
<div class="ax-break-md"></div>
<div class="ax-alert ax-danger">很危险！<a href="###" class="ax-close"></a></div>
<div class="ax-break-md"></div>
<div class="ax-alert ax-warning">提示注意！<a href="###" class="ax-close"></a></div>
<div class="ax-break-md"></div>
<div class="ax-alert ax-ad">这是一个广告！<a href="###" class="ax-close"></a></div>
<div class="ax-break-md"></div>
<div class="ax-alert ax-info">名词解释<a href="###" class="ax-close"></a></div>
<div class="ax-break-md"></div>
<div class="ax-alert ax-light">浅灰色文字提示<a href="###" class="ax-close"></a></div>
使用标题+简介
使用ax-title和ax-des即可，注意查看html结构。
原始社会
中国的原始社会，起自大约170万年前的元谋人
奴隶社会
公元前16世纪至公元前11世纪的商朝，是奴隶社会的发展时期。商朝的农业、手工业较发达，青铜冶炼和铸造有很高水平。中国有文字可考的历史是从商朝开始的。商纣王统治时，周武王兴兵伐纣，商亡。
<div class="ax-alert ax-primary">
<div class="ax-title">原始社会</div>
<div class="ax-des">中国的原始社会，起自大约170万年前的元谋人</div>
</div>
<div class="ax-break-md"></div>
<div class="ax-alert ax-secondary">
<div class="ax-title">奴隶社会</div>
<div class="ax-des">公元前16世纪至公元前11世纪的商朝，是奴隶社会的发展时期。商朝的农业、手工业较发达，青铜冶炼和铸造有很高水平。中国有文字可考的历史是从商朝开始的。商纣王统治时，周武王兴兵伐纣，商亡。</div>
</div>
使用小图标
对ax-alert追加ax-sm类即可，注意查看html结构。
原始社会
中国的原始社会，起自大约170万年前的元谋人
奴隶社会
公元前16世纪至公元前11世纪的商朝，是奴隶社会的发展时期。商朝的农业、手工业较发达，青铜冶炼和铸造有很高水平。中国有文字可考的历史是从商朝开始的。商纣王统治时，周武王兴兵伐纣，商亡。
<div class="ax-alert ax-danger ax-sm">
<i class="ax-iconfont ax-icon-close-o-fill"></i>
<div>
<div class="ax-title">原始社会</div>
<div class="ax-des">中国的原始社会，起自大约170万年前的元谋人</div>
</div>
</div>
<div class="ax-break-md"></div>
<div class="ax-alert ax-warning ax-sm">
<i class="ax-iconfont ax-icon-warning-o-fill"></i>
<div>
<div class="ax-title">奴隶社会</div>
<div class="ax-des">公元前16世纪至公元前11世纪的商朝，是奴隶社会的发展时期。商朝的农业、手工业较发达，青铜冶炼和铸造有很高水平。中国有文字可考的历史是从商朝开始的。商纣王统治时，周武王兴兵伐纣，商亡。</div>
</div>
</div>
使用大图标
对ax-alert追加ax-lg类即可，注意查看html结构。
原始社会
中国的原始社会，起自大约170万年前的元谋人
奴隶社会
公元前16世纪至公元前11世纪的商朝，是奴隶社会的发展时期。商朝的农业、手工业较发达，青铜冶炼和铸造有很高水平。中国有文字可考的历史是从商朝开始的。商纣王统治时，周武王兴兵伐纣，商亡。
<div class="ax-alert ax-success ax-lg">
<i class="ax-iconfont ax-icon-check-o-fill"></i>
<div>
<div class="ax-title">原始社会</div>
<div class="ax-des">中国的原始社会，起自大约170万年前的元谋人</div>
</div>
</div>
<div class="ax-break-md"></div>
<div class="ax-alert ax-ad ax-lg">
<i class="ax-iconfont ax-icon-question-o-fill"></i>
<div>
<div class="ax-title">奴隶社会</div>
<div class="ax-des">公元前16世纪至公元前11世纪的商朝，是奴隶社会的发展时期。商朝的农业、手工业较发达，青铜冶炼和铸造有很高水平。中国有文字可考的历史是从商朝开始的。商纣王统治时，周武王兴兵伐纣，商亡。</div>
</div>
</div>