bootstrap3的alert-danger

1、alert-danger:


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

      新增的alert-link

     其它幾個沒變。

2、實驗代碼:

  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、效果圖:


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章