<!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>

Bootstrap-常用图标glyphicon的更多相关文章

  1. bootstrap字体图标

    bootstrap字体图标 http://v3.bootcss.com/components/ <!DOCTYPE HTML> <html> <head> < ...

  2. BootStrap常用组件及响应式开发

    BootStrap常用组件 PS:所有的代码必须写在<class="container/container-fluid">容器当中 常用组件包含内容: 字体图标 下拉菜 ...

  3. Bootstrap 字体图标、下拉菜单、按钮组

    Bootstrap 字体图标(Glyphicons) 需要引入fonts文件夹中的文件,而且该文件夹必须命名为fonts,然后引进css文件,jQuery文件,以及bootstrap的js文件. 用法 ...

  4. 解决本地Bootstrap字体图标不可见的问题

    原文:https://www.jianshu.com/p/70ac459d33e7 作为Bootstrap的初学者,我最近遇到了一个问题:在使用Bootstrap字体图标时,图标不可见.使用代码如下: ...

  5. JS组件系列——不容错过的两款Bootstrap Icon图标选择组件

    前言:最近好多朋友在群里面聊到bootstrap icon图标的问题,比如最常见的菜单管理,每个菜单肯定需要一个对应的菜单图标,要是有一个可视化的图标选择组件就好了,最好是直接选择图标,就能得到对应的 ...

  6. bootstrap字体图标在谷歌显示正常，在火狐显示异常的问题

    bootstrap字体图标的使用 现在有很多的网站支持字体图标,我所知道的有bootstrap,fontawesome,iconmoon,等等,可能还有其他我并不知道 bootstrap只要你的文件夹 ...

  7. bootstrap的图标无法正常显示解决方法

    bootstrap的图标无法在火狐浏览器上正常显示,出现的是乱码,如下图所示: 解决方案: 直接把bootstrap整个文件夹放到项目中,引用的时候../static/bootstrap-3.3.5- ...

  8. Bootstrap中的Glyphicon 字体图标

    在Bootstrap框架中也为大家提供了近200个不同的icon图片,而这些图标都是使用CSS3的@font-face属性配合字体来实现的icon效果. 1 <!DOCTYPE html> ...

  9. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 字体图标(Glyphicons)：glyphicon glyphicon-envelope

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name ...

随机推荐

  1. Improved SEO with mod_rewrite

    PHP Advanced and Object-Oriented Programming Third Edition <?php //D:\wamp64\www\0613pm\w_wwwroot ...

  2. wfp（Application的运用）

    1.Application中封装了wpf的一些常用的功能,如检查未经处理的异常,处理命令行参数等. 2.如何启动wpf程序: app.xaml可用于启动wpf的窗体.也可以不用这用方式.直接创建一个a ...

  3. Page13：跟踪问题、最优控制[Linear System Theory]

    内容包含跟踪问题及其结构框图.内模原理.可跟踪条件 各种线性二次型最优控制问题指标含义

  4. Copycat - 状态

    Member.Status status的变迁是源于heartbeat heartbeat,append空的entries /** * Triggers a heartbeat to a majori ...

  5. Js_protoType_原型

    1.什么是原型? 之前在网上看了好多,各种说法的都有,说的很晦涩,很难理解,我觉得用的多了就会慢慢理解它的意思,总之来说,每个对象都有一个指向它原型,也就是每个对象都有原型. 2.原型有什么用? 原型 ...

  6. oracle创建表空间 授权

    --创建表空间 临时表空间 create temporary tablespace xiaodai_temp tempfile '/main/app/oracle/oradata/devdb/xiao ...

  7. u-boot 编译，启动流程分析，移植

    分析u-boot-1.1.6 的启动流程 移植u-boot 2012.04版本到JZ2440开发板 源码百度云链接:https://pan.baidu.com/s/10VnxfDWBqJVGY3SCY ...

  8. Spring 配置文件出现异常！

    spring配置文件错误 Referenced file contains errors (http://www.springframework.org/schema/beans/spring-bea ...

  9. UIView和layer的区别

    每个 UIView 内部都有一个 CALayer 在背后提供内容的绘制和显示,并且 UIView 的尺寸样式都由内部的 Layer 所提供.两者都有树状层级结构,layer 内部有 SubLayers ...

  10. python练习题-day4

    1.写代码,有如下列表,按照要求实现每一个功能 li = ["alex", "WuSir", "ritian", "barry&q ...