示例 2 : 可关闭的警告框 示例 3 : 警告框中的链接
警告框
<!DOCTYPE html>
<script src="https://how2j.cn/study../../../js/jquery/2.0.0/jquery.min.js"></script>
<link href="https://how2j.cn/study../../../css/bootstrap/3.3.6/bootstrap.min.css" rel="stylesheet">
<script src="https://how2j.cn/study../../../js/bootstrap/3.3.6/bootstrap.min.js"></script>
<div class="alert alert-success" role="alert">操作成功</div>
<div class="alert alert-info" role="alert">信息提示</div>
<div class="alert alert-warning" role="alert">警告提示</div>
<div class="alert alert-danger" role="alert">危险提示</div>
<!DOCTYPE html> <script src="https://how2j.cn/study../../../js/jquery/2.0.0/jquery.min.js"></script> <link href="https://how2j.cn/study../../../css/bootstrap/3.3.6/bootstrap.min.css" rel="stylesheet"> <script src="https://how2j.cn/study../../../js/bootstrap/3.3.6/bootstrap.min.js"></script> <div class="alert alert-success" role="alert">操作成功</div> <div class="alert alert-info" role="alert">信息提示</div> <div class="alert alert-warning" role="alert">警告提示</div> <div class="alert alert-danger" role="alert">危险提示</div>
可关闭的警告框
<!DOCTYPE html>
<script src="https://how2j.cn/study../../../js/jquery/2.0.0/jquery.min.js"></script>
<link href="https://how2j.cn/study../../../css/bootstrap/3.3.6/bootstrap.min.css" rel="stylesheet">
<script src="https://how2j.cn/study../../../js/bootstrap/3.3.6/bootstrap.min.js"></script>
<div class="alert alert-warning alert-dismissible" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>
警告提示
</div>
<!DOCTYPE html> <script src="https://how2j.cn/study../../../js/jquery/2.0.0/jquery.min.js"></script> <link href="https://how2j.cn/study../../../css/bootstrap/3.3.6/bootstrap.min.css" rel="stylesheet"> <script src="https://how2j.cn/study../../../js/bootstrap/3.3.6/bootstrap.min.js"></script> <div class="alert alert-warning alert-dismissible" role="alert"> <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button> 警告提示 </div>
警告框中的链接
<!DOCTYPE html>
<script src="https://how2j.cn/study../../../js/jquery/2.0.0/jquery.min.js"></script>
<link href="https://how2j.cn/study../../../css/bootstrap/3.3.6/bootstrap.min.css" rel="stylesheet">
<script src="https://how2j.cn/study../../../js/bootstrap/3.3.6/bootstrap.min.js"></script>
<div class="alert alert-success" role="alert">
<span>大减价!!!</span><a href="#nowhere" class="alert-link">点击购买</a>
</div>
<div class="alert alert-info" role="alert">
<span>大减价!!!</span><a href="#nowhere" class="alert-link">点击购买</a>
</div>
<div class="alert alert-warning" role="alert">
<span>大减价!!!</span><a href="#nowhere" class="alert-link">点击购买</a>
</div>
<div class="alert alert-danger" role="alert">
<span>大减价!!!</span><a href="#nowhere" class="alert-link">点击购买</a>
</div>
<!DOCTYPE html> <script src="https://how2j.cn/study../../../js/jquery/2.0.0/jquery.min.js"></script> <link href="https://how2j.cn/study../../../css/bootstrap/3.3.6/bootstrap.min.css" rel="stylesheet"> <script src="https://how2j.cn/study../../../js/bootstrap/3.3.6/bootstrap.min.js"></script> <div class="alert alert-success" role="alert"> <span>大减价!!!</span><a href="#nowhere" class="alert-link">点击购买</a> </div> <div class="alert alert-info" role="alert"> <span>大减价!!!</span><a href="#nowhere" class="alert-link">点击购买</a> </div> <div class="alert alert-warning" role="alert"> <span>大减价!!!</span><a href="#nowhere" class="alert-link">点击购买</a> </div> <div class="alert alert-danger" role="alert"> <span>大减价!!!</span><a href="#nowhere" class="alert-link">点击购买</a> </div>
HOW2J公众号,关注后实时获知最新的教程和优惠活动,谢谢。
提问已经提交成功,正在审核。 请于 我的提问 处查看提问记录,谢谢
|