锐英源软件
第一信赖

精通

英语

开源

擅长

开发

培训

胸怀四海 

第一信赖

当前位置:锐英源 / 开源技术 / Bootstrap / Bootstrap警告
服务方向
人工智能数据处理
人工智能培训
kaldi数据准备
小语种语音识别
语音识别标注
语音识别系统
语音识别转文字
kaldi开发技术服务
软件开发
运动控制卡上位机
机械加工软件
软件开发培训
Java 安卓移动开发
VC++
C#软件
汇编和破解
驱动开发
联系方式
固话:0371-63888850
手机:138-0381-0136
Q Q:396806883
微信:ryysoft

Bootstrap警告


警告框

警告框–结构与样式

<div class="alert alert-success" role="alert">      
<button class="close"  
data-dismiss="alert" type="button" >&times;</button>      
<p>恭喜您操作成功!
</p>  
</div>

警告中的链接

在警告中创建链接的步骤如下:

  • 通过创建一个 <div>,并向其添加一个 .alert class 和四个上下文 class(即 .alert-success、.alert-info、.alert-warning、.alert-danger)之一,来添加一个基本的警告框。
  • 使用 .alert-link 实体类来快速提供带有匹配颜色的链接。
<!DOCTYPE html>  
<html>  
<head>     
<title>Bootstrap 实例 - 警告(Alerts)中的链接</title>     
<link href="/bootstrap/css/bootstrap.min.css" rel="stylesheet">     
<script src="/scripts/jquery.min.js"></script>     
<script src="/bootstrap/js/bootstrap.min.js"></script>  
</head>  
<body>    
<div class="alert alert-success">     
<a href="#" class="alert-link">成功!很好地完成了提交。</a>  
</div>  
<div class="alert alert-info">     
<a href="#" class="alert-link">信息!请注意这个信息。</a>  
</div>  <div class="alert alert-warning">     
<a href="#" class="alert-link">警告!请不要提交。</a>  
</div>  <div class="alert alert-danger">     
<a href="#" class="alert-link">错误!请进行一些更改。</a>  
</div>      
</body>  
</html>

可取消的警告

  • 通过创建一个 <div>,并向其添加一个 .alert class 和四个上下文 class(即 .alert-success、.alert-info、.alert-warning、.alert-danger)之一,来添加一个基本的警告框。
  • 同时向上面的 <div> class 添加可选的 .alert-dismissable
  • 添加一个关闭按钮。
<!DOCTYPE html>  
<html>  
<head>     
<title>Bootstrap 实例 - 可取消的警告(Dismissal Alerts)</title>     
<link href="/bootstrap/css/bootstrap.min.css" rel="stylesheet">     
<script src="/scripts/jquery.min.js"></script>     
<script src="/bootstrap/js/bootstrap.min.js"></script>  
</head>  
<body>    
<div class="alert alert-success alert-dismissable">     
<button type="button" class="close" data-dismiss="alert"         
aria-hidden="true">        
&times;     
</button>     
成功!很好地完成了提交。  
</div>  
<div class="alert alert-info alert-dismissable">     
<button type="button" class="close" data-dismiss="alert"         
aria-hidden="true">        
&times;     
</button>     
信息!请注意这个信息。  
</div>  <div class="alert alert-warning alert-dismissable">     
<button type="button" class="close" data-dismiss="alert"         
aria-hidden="true">        
&times;     
</button>     
警告!请不要提交。  
</div>  
<div class="alert alert-danger alert-dismissable">     
<button type="button" class="close" data-dismiss="alert"         
aria-hidden="true">       
&times;     
</button>     
错误!请进行一些更改。  
</div>      
</body>  
</html>
友情链接
版权所有 Copyright(c)2004-2021 锐英源软件
公司注册号:410105000449586 豫ICP备08007559号 最佳分辨率 1024*768
地址:郑州大学北校区院(文化路97号院)内