<!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. LeetCode 883 Projection Area of 3D Shapes 解题报告

    题目要求 On a N * N grid, we place some 1 * 1 * 1 cubes that are axis-aligned with the x, y, and z axes. ...

  2. Delphi 打开网址

    1. 通过iexplore.exe打开:ShellExecute(0, 'open', 'iexplore.exe', PChar('http://www.100xuekao.com'), '', S ...

  3. 利用Python进行自然语言处理(笔记)第一章

    一.标识符 一个我们想要放在一组对待的字符序列--如:”hairy“.”his“或者”:“: 二.词类型 一个词在一个文本中独一无二的出现形式或拼写,也就是说这个词在词汇表中是唯一的.如果我们计数的项 ...

  4. JavaScript学习(六)

    这里要注意: 1.num为NaN(因为str的开头不是数字) 2.NaN和NaN是不等的 3.NaN也是number.

  5. QPS、PV 、RT(响应时间)之间的关系

    QPS.PV .RT(响应时间)之间的关系 在进行系统性能压测和系统性能优化的时候,会涉及到QPS,PV,RT相关的概念,本文总结一下QPS,PV,RT之间的关系,放在博客备忘,本文参考了之前在淘宝工 ...

  6. MySQL前缀索引和索引选择性

    有时候需要索引很长的字符列,这会让索引变得大且慢.通常可以索引开始的部分字符,这样可以大大节约索引空间,从而提高索引效率.但这样也会降低索引的选择性.索引的选择性是指不重复的索引值(也称为基数,car ...

  7. 自定义PopView

    改代码是参考一个Demo直接改的,代码中有一些漏洞,如果发现其他的问题,可以下方直接留言 .h文件 #import <UIKit/UIKit.h> typedef void(^Popove ...

  8. blockdev命令 blkid命令 lsblk命令

    blockdev命令  blkid命令  lsblk命令 http://www.jb51.net/LINUXjishu/310389.html block相关的命令 这篇文章主要介绍了Linux bl ...

  9. 爬虫请求库——selenium

    selenium模块 selenium最初是一个自动化测试工具,而爬虫中使用它主要是为了解决requests无法直接执行JavaScript代码的问题.selenium的缺点是效率会变得很慢. sel ...

  10. dxRangeTrackBar使用教程

    Properties: Max:最大值 Min:最小值 Frequency:设置刻度值多大值显示PageSize:选择时跳动的区域大小 SelectionColor:选择区域颜色 ShowSelect ...