<!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. 安卓LED跑马灯 超炫酷的表白神器破解版

    链接:https://pan.baidu.com/s/11Wxll4iLdcEPq0wUBK6Ong 提取码:all4

  2. e_book

    1. 奢侈的纸制书籍 2. 电子书 2.1 与印刷书籍的比较 2.2 电子书格式 2.2.1 Kindle 2.2.2 PDF 2.2.3 EPUB 2.2.4 更多电子书格式比较 2.3 公共领域的 ...

  3. Using Watch Mode

    官方文档地址:https://webpack.js.org/guides/development/#using-watch-mode You can instruct webpack to " ...

  4. C语言入门第四章

    =========C语言的输入与输出=========== %-9d : d:以十进制输出,9表示至少占用9个字符的宽度,宽度不足以空格补齐,-表示左对齐.综合起来,%-9d 表示以十进制输出,左对齐 ...

  5. 全文索引-ElasticSearch

    ElasticSearch 官方文档 Elasticsearch是一个开源的搜索引擎,建立在一个全文搜索引擎库Apache Lucene™基础之上. Lucene可以说是当下最先进,高性能,全功能的搜 ...

  6. PHP 获取header 的自定义参数值

    $.ajax({ type: "GET", url: "default.aspx", beforeSend: function(request) { reque ...

  7. 「牛客CSP-S2019赛前集训营1」仓鼠的石子游戏

    传送门 NowCoder 解题思路 考虑这样一件事:在任何的同一个石圈,后手肯定会输. 证明很简单,手玩一下就可以大致意会. 但是有一种特殊情况,就是大小为1的圈,这种圈就是起到一次交换先后手的作用, ...

  8. 088、Java中String类之对象直接赋值

    01.代码如下: package TIANPAN; /** * 此处为文档注释 * * @author 田攀 微信382477247 */ public class TestDemo { public ...

  9. jQuery新的事件绑定机制on()示例应用

    投稿:whsnow 字体:[增加 减小] 类型:转载   从jQuery1.7开始,jQuery引入了全新的事件绑定机制,on()和off()两个函数统一处理事件绑定,下面通过示例为大家介绍下     ...

  10. java与MySQL数据库的连接

    java与MySQL数据库的连接 1.数据库的安装和建立参见上一篇博客中的第1,2步骤.(http://blog.csdn.net/nuptboyzhb/article/details/8043091 ...