<!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. lc 0228

    目录 ✅ 412. Fizz Buzz 描述 解答 c数字转字符: other's c my c tdo py ✅ 235. 二叉搜索树的最近公共祖先 描述 解答 评价者 思路: c py ✅ 412 ...

  2. Numpy中rot90函数实现矩阵旋转

    从NumPy的官方完整查到rot90函数语法格式如下: rot90(m, k=1, axes=(0, 1) m是要旋转的数组(矩阵),k是旋转的次数,默认旋转1次,那是顺时针还是逆时针呢?正数表示逆时 ...

  3. 洛谷 CF798C Mike and gcd problem

    嗯... 题目链接:https://www.luogu.org/problemnew/show/CF798C 这道题首先要会写gcd..也类似一种找规律吧... 问题的操作是在两个数的基础上进行的: ...

  4. TomcatJVM参数优化降低内存使用率(重点)！

    JVM是jdk最底层的支柱 做JVM参数优化主要是为了改善服务器性能以及内存使用率 JAVA堆分为三大部分:(新生代.老年代.永久代) ================================ ...

  5. OpenTSDB 写入数据

    1. 关于 Metrics, value, tag name, tag value opentsdb的每个时间序列必须有一个metric和一个或多个tag对,每个时间序列每小时的数据保存一行.open ...

  6. 安装oracle11g跳不过下载软件更新[INS-30131] 执行安装程序验证所需的初始设置失败

    链接:https://www.jb51.net/article/88944.htm 问题已解决: 解决方法 第一步: 控制面板>所有控制面板项>管理工具>服务>SERVER 启 ...

  7. 02使用GitHub远程仓库

    一.远程库配置 由于本地的GIT仓库和GitHub仓库之间的传输是通过SSH加密的,所以需要以下配置: 1.创建SSH key 为什么GitHub需要SSHKey:根据key来授权,有哪些key可以往 ...

  8. 3 JavaScript正则表达式

    正则表达式:Regular(有规则的) Expression 正则表达式是由一个字符序列形成的搜索模式,可用于文本搜索和文本替换 常见于字符串的search和replace方法 var str = & ...

  9. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 排版：设定文本右对齐

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

  10. tensorflow版helloworld---拟合线性函数的k和b（02-4）

    给不明白深度学习能干什么的同学,感受下深度学习的power import tensorflow as tf import numpy as np #使用numpy生成100个随机点 x_data=np ...