bootstrap3的alert-danger

来源:互联网 发布:安畅网络怎么样 编辑:程序博客网 时间:2024/06/06 03:50
bootstrap3alert-dangeralert-link

1、alert-danger:


      2.3版本的alert-error       3.0版本alert-danger

      新增的alert-link

     其它几个没变。

2、实验代码:

[html] view plaincopy在CODE上查看代码片派生到我的代码片
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  2. <html xmlns="http://www.w3.org/1999/xhtml">  
  3. <head>  
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
  5. <link rel="stylesheet" href="dist/css/bootstrap.css" >  
  6. <script src="dist/js/bootstrap.js"></script>  
  7. <title>无标题文档</title>  
  8. </head>  
  9.   
  10. <body style="margin:100px">  
  11. <div class="container">  
  12.     <div class="alert alert-success">  
  13.         <strong>成功!</strong>  
  14.         <a href="#" class="alert-link">这个是警告上的连接</a>  
  15.         这个是 成功 的提示!  
  16.     </div>  
  17.     <div class="alert alert-info">  
  18.         <strong>小心!</strong>  
  19.         <a href="#" class="alert-link">这个是警告上的连接</a>  
  20.         这个是 小心 的提示!  
  21.     </div>  
  22.     <div class="alert alert-warning">  
  23.         <strong>警告!</strong>  
  24.         <a href="#" class="alert-link">这个是警告上的连接</a>  
  25.         这个是 警告 的提示!  
  26.     </div>  
  27.     <div class="alert alert-danger">  
  28.         <strong>危险!</strong>  
  29.         <a href="#" class="alert-link">这个是警告上的连接</a>  
  30.         这个是 危险 的提示!  
  31.     </div>  
  32. </div>  
  33.   
  34. </body>  
  35. </html>  


3、效果图: