Bootstrap-常用图标glyphicon

时间：2022-05-11 11:17:50
 <!DOCTYPE html>

 <html lang="zh-cn">

 <head>

     <meta charset="utf-8">

     <meta http-equiv="X-UA-Compatible" content="IE=edge">

     <meta name="viewport" content="width=device-width, initial-scale=1">

     <title>Bootstrap 101 Template</title>

     <!-- Bootstrap -->

     <link href="css/bootstrap.css" rel="stylesheet">

     <link href="css/bootstrap.min.css">

     <!--[if lt IE 9]>

     <script src="js/html5shiv.min.js"></script>

     <script src="js/respond.min.js"></script>

     <![endif]-->

 </head>

 <body>

 <div class="container">

     <h1>常用图标字体</h1>

     <h3>首页-glyphicon-home</h3>

     <a class="btn btn-success" href="#">

         <span class="glyphicon glyphicon-home"></span>

     </a>

   <h3>齿轮-glyphicon-cog</h3>

     <a class="btn btn-success">

         <span class="glyphicon glyphicon-cog"></span>

     </a>

     <h3>定位-glyphicon-map-marker</h3>

     <a class="btn btn-success">

         <span class="glyphicon glyphicon-map-marker"></span>

     </a>

     <h3>邮件-glyphicon-envelope</h3>

     <a class="btn btn-success">

         <span class="glyphicon glyphicon-envelope"></span>

     </a>

     <h3>实星-glyphicon-star，空星-glyphcion-srat-empty</h3>

     <a class="btn btn-success">

         <span class="glyphicon glyphicon-star"></span>

         <span class="glyphicon glyphicon-star-empty"></span>

     </a>

     <h3>实心glyphicon-heart，空心glyphicon-heart-empty</h3>

     <a class="btn btn-success">

         <span class="glyphicon glyphicon-heart"></span>

         <span class="glyphicon glyphicon-heart-empty"></span>

     </a>

     <h3>+号glyphicon-plus，-号-glyphicon-minus</h3>

     <a class="btn btn-success">

         <span class="glyphicon glyphicon-plus"></span>

         <span class="glyphicon glyphicon-minus"></span>

     </a>

 </div>

 <script src="js/jquery-1.11.3.js"></script>

 <script src="js/bootstrap.js"></script>

     <script>

     (function () {

         var s = document.createElement("script");

         s.onload = function () {

             bootlint.showLintReportForCurrentDocument([]);

         };

         s.src = "js/bootlint.js";

         document.body.appendChild(s)

     })();

 </script>

 </body>

 </html>

相关文章