<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title>Bootstrap 实例 - 如何使用字形图标（Glyphicons）</title>

        <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">

        <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>

        <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>

    </head>

    <body>

        <p>

            <button type="button" class="btn btn-default">

                <span class="glyphicon glyphicon-sort-by-attributes"></span>

            </button>

            <button type="button" class="btn btn-default">

                <span class="glyphicon glyphicon-sort-by-attributes-alt"></span>

            </button>

            <button type="button" class="btn btn-default">

                <span class="glyphicon glyphicon-sort-by-order"></span>

            </button>

            <button type="button" class="btn btn-default">

                <span class="glyphicon glyphicon-sort-by-order-alt"></span>

            </button>

        </p>

        <button type="button" class="btn btn-default btn-lg">

            <span class="glyphicon glyphicon-user"></span> User

        </button>

        <button type="button" class="btn btn-default btn-sm">

            <span class="glyphicon glyphicon-user"></span> User

        </button>

        <button type="button" class="btn btn-default btn-xs">

            <span class="glyphicon glyphicon-user"></span> User

        </button>

    </body>

</html>

吴裕雄 Bootstrap 前端框架开发——Bootstrap 字体图标(Glyphicons)的更多相关文章

  1. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 排版：显示在 <abbr> 元素中的文本以小号字体展示，且可以将小写字母转换为大写字母

    <!DOCTYPE html> <html> <head> <title>菜鸟教程(runoob.com)</title> <meta ...

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

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

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

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

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

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

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

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

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

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

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

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

  8. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 字体图标(Glyphicons)：带有字体图标的导航栏

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

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

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

随机推荐

  1. Codeforces Round #617 (Div. 3)A. Array with Odd Sum（水题）

    You are given an array aa consisting of nn integers. In one move, you can choose two indices 1≤i,j≤n ...

  2. c++11的记录

    decltype()类型指示符 设定一个返回值是int的函数f(),通过使用 decltype(f()) sum = x; 此时decltype()接受一个从f()返回的int型的值,并将sum设置为 ...

  3. TensorFlow 训练只用cpu

    os.environ["CUDA_VISIBLE_DEVICES"] = ""

  4. 各种STL的基本用法

    目录 STL及一些常用函数的基本用法 1.vector(向量)的基本用法 2.queue(队列)的基本用法 3.stack(栈)的基本操作 4.set(集合)的基本用法 5.map(映射)的基本用法 ...

  5. 【PAT甲级】1010 Radix (25 分)（二分）

    题意: 输入两个数可能包含小写字母,1或者2,进制大小.第三个数为代表第一个数是第四个数进制的,求第二个数等于第一个数时进制的大小,不可能则输出Impossible,第三个数为2代表第二个数是第四个数 ...

  6. SRS——打开 stream caster

    按照默认的配置编译启动后,发现 stream caster 不起作用,启动时报如下警告: [-- ::][][] stream caster: off 原因是编译SRS时没有打开StreamCaste ...

  7. Centos7 更新配置为阿里源步骤

    一.yum更换配置源过程 1.备份原有的.repo源文件 首先需要将之前的源进行备份(一般重要的配置文件都需要有备份的意识) # 进入源配置目录 cd /etc/yum.repos.d # 创建备份文 ...

  8. react 开发 vscode需要安装的开发插件

    1.npm Intellisense  有自动补全的功能    var lodash = require('lodash') 2. path Intellisense 自动补全文件名 import C ...

  9. vue.js使用更简单的方法制作带删除功能的tooolist

    今天复习了下vue.js,先做了个基本版的todolist,做完后自己想加个删除本项的按钮.一开始做没啥头绪了,试了试无果,查了一把后发现网上的那些方法真的是麻烦,自己动手丰衣足食,自己最后换了思路试 ...

  10. Spark教程——（6）Spark-shell基于Phoenix访问HBase数据

    package statistics import common.util.timeUtil import org.apache.spark.{SparkConf, SparkContext} imp ...