<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title>Bootstrap 实例 - 按钮</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>

        <div class="container">

            <h2>自适应按钮组</h2>

            <p>以通过 .btn-group-justified 类来设置自适应大小的按钮组。</p>

            <div class="btn-group btn-group-justified">

                <a href="#" class="btn btn-primary">Apple</a>

                <a href="#" class="btn btn-primary">Samsung</a>

                <a href="#" class="btn btn-primary">Sony</a>

            </div>

        </div>

    </body>

</html>

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title>Bootstrap 实例 - 按钮</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>

        <div class="container">

            <h2>自适应按钮组</h2>

            <div class="btn-group btn-group-justified">

                <div class="btn-group">

                    <button type="button" class="btn btn-primary">Apple</button>

                </div>

                <div class="btn-group">

                    <button type="button" class="btn btn-primary">Samsung</button>

                </div>

                <div class="btn-group">

                    <button type="button" class="btn btn-primary">Sony</button>

                </div>

            </div>

        </div>

    </body>

</html>

吴裕雄 Bootstrap 前端框架开发——Bootstrap 按钮：自适应大小的按钮组的更多相关文章

  1. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 按钮：按钮组

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

  2. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 按钮：激活状态

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

  3. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 按钮：按钮大小

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

  4. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 按钮：禁用按钮

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

  5. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 按钮：按钮被点击

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

  6. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 按钮：块级按钮(拉伸至父元素100%的宽度)

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

  7. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 按钮：制作一个超小按钮

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

  8. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 按钮：制作一个小按钮

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

  9. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 按钮：制作一个大按钮

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

随机推荐

  1. base64，base32bit加密解密

    import base64 str='admin' str=str.encode('utf-8') #加密 bs64=base64.b64encode(str) #解密 debs64=base64.b ...

  2. php基础 php 全局变量

    $_GET ----->get传送方式 $_POST ----->post传送方式 $_REQUEST ----->可以接收到get和post两种方式的值 $GLOBALS ---- ...

  3. 04在eclipse当中使用gitee

    一.使用Bash连接GitHub时作了哪些事情 1.生成公钥 2.在GitHub上配置SSHKEY  3.创建关联 4.关联远程仓库 5.向远程仓库推送数据 6.拉取数据 二.把项目分享到gitee ...

  4. tornado框架的简单实用

    一.安装模块 pip3 install tornado 二.简单的起服务的方法 import json, datetime from tornado.web import RequestHandler ...

  5. TimeSeriesEditor时间序列编辑软件之实战ReoGrid表格控件和Zedgraph绘图控件

    最近用ReoGrid表格控件和Zedgraph绘图控件写了一个TimeSeriesEditor时间序列编辑软件,如下图. 目的就是体验一下这两个空间的用法,感觉还是挺好用的, 关于软件的使用说明可以访 ...

  6. 数字统计(0)<P2010_1>

    数字统计   (two.pas/c/cpp) [问题描述] 请统计某个给定范围[L, R]的所有整数中,数字 2 出现的次数.  比如给定范围[2, 22],数字 2 在数2中出现了 1次,在数 12 ...

  7. elk安装2.0版本，自己总结，比较细致 es单机的安装

    用root用户会报错,版本6之前还是可以用root用户启动的,针对es的保护,数据的一些问题,6之后就不允许了. 启动成功 下面验证一下  可以直接用浏览器访问,接受http访问 配置,因为没有暴露端 ...

  8. MSSQL2005数据库快照（SNAPSHOT）初探

    定义:数据库快照是数据库(称为“源数据库”)的只读静态视图.在创建时,每个数据库快照在事务上都与源数据库一致.多个快照可以位于一个源数据库中,并且可以作为数据库始终驻留在同一服务器实例上.在创建数据库 ...

  9. Java基础 -1.4

    标识符与关键字 对于标识符的组成在Java之中的定义如下:由字母.数字._.$ 组成 其中不能使用Java的保留字(关键字) 其中 $ 一般都有特殊的含义 不建议出现在自己所编写的代码上 关键字 是系 ...

  10. c数据结构线性表的总结

    1:连表的特点   1.链表是一种存储结构,用于存放线性表   2.连表的结点是根据需要调用动态分配内存函数进行分配的,因此链表可随需要伸长缩短      在腰存储的数据个数未知的情况下节省内存.   ...