<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Bootstrap历练实例：按钮组大小</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<link rel="stylesheet" href="bootstrap-3.3.5-dist/css/bootstrap.min.css" />
</head>
<body>
<div class="container">
<div class="btn-toolbar" role="toolbar">
<div class="btn-group btn-group-lg">
<button type="button" class="btn btn-default">按钮1</button>
<button type="button" class="btn btn-default">按钮2</button>
<button type="button" class="btn btn-default">按钮3</button>
</div>

<div class="btn-group btn-group-sm">
<button type="button" class="btn btn-default">按钮4</button>
<button type="button" class="btn btn-default">按钮5</button>
<button type="button" class="btn btn-default">按钮6</button>
</div>
<div class="btn-group btn-group-xs">
<button type="button" class="btn btn-default">按钮7</button>
<button type="button" class="btn btn-default">按钮8</button>
<button type="button" class="btn btn-default">按钮9</button>

</div>
</div>

</div>

<script src="jQuery/jquery-2.1.4.js"></script>
<script src="bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
</body>
</html>

Bootstrap历练实例：按钮组大小的更多相关文章

  1. Bootstrap 历练实例 - 按钮（Button）插件复选框

    复选框(Checkbox) 您可以创建复选框按钮 组,并通过向 btn-group 添加 data 属性 data-toggle="buttons" 来添加复选框按钮组的切换. & ...

  2. Bootstrap历练实例：输入框组的大小

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  3. bootstrap历练实例：按钮作为输入框组前缀或后缀

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  4. Bootstrap历练实例：垂直的按钮组

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  5. Bootstrap历练实例：基本按钮组

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  6. Bootstrap历练实例：基本按钮群组

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  7. Bootstrap历练实例：按钮(Button)插件单个切换

    单个切换 如需激活单个按钮的切换(即改变按钮的正常状态为按压状态,反之亦然),只需向 button 元素添加 data-toggle="button" 作为其属性即可,如下面实例所 ...

  8. Bootstrap历练实例：向列表组添加内容

    向列表组添加自定义内容 我们可以向上面已添加链接的列表组添加任意的 HTML 内容.下面的实例演示了这点: <!DOCTYPE html><html><head>& ...

  9. Bootstrap历练实例：向列表组添加链接

    向列表组添加链接 通过使用锚标签代替列表项,我们可以向列表组添加链接.我们需要使用 <div> 代替 <ul> 元素.下面的实例演示了这点: <!DOCTYPE html ...

随机推荐

  1. OpenCV入门指南

    http://blog.csdn.net/morewindows/article/details/8225783/ http://blog.csdn.net/poem_qianmo/article/d ...

  2. 計蒜課/排澇(Edmond-Karp)

    題目鏈接: https://nanti.jisuanke.com/t/36 題意:中文題目誒~ 思路: 最大流模板題.... 關於最大流算法blog: http://www.cnblogs.com/z ...

  3. @PathVariable注解的使用

    带占位符的 URL 是 Spring3.0 新增的功能,该功能在SpringMVC 向 REST 目标挺进发展过程中具有里程碑的意义. 通过 @PathVariable 可以将 URL 中占位符参数绑 ...

  4. excel输入值非法，限定了可以输入的数值怎么办

    回到excel的编辑界面,点击工具栏的“数据”标签,如图所示. 继续在“数据”标签的下面找到“数据验证”或“数据有效性”的按钮,点击该选项,然后继续下一步. 在弹出的选择框中选择“数据验证”选项,如图 ...

  5. 项目用Git上传到coding

    关于这样的东西,网上很多教程,这里就结合自己看的还有自己的例子来说明一下吧: 1.你得下载一个git软件并成功安装 2.生成ssh: 关于这个,我觉得似乎不是一定的,因为通过https也可以连接到co ...

  6. jQuery addClass() 源码解读

    addClass: function( value ) { var classes, elem, cur, clazz, j, i = 0, len = this.length, proceed = ...

  7. POJ - 3020  Antenna Placement 二分图最大匹配

    http://poj.org/problem?id=3020 首先注意到,答案的最大值是'*'的个数,也就是相当于我每用一次那个技能,我只套一个'*',是等价的. 所以,每结合一对**,则可以减少一次 ...

  8. 安卓 使用LruCache 加载图片 遇到的问题

    本来 使用listview的时候 加载大图片的时候 会遇到内存溢出而导致崩溃. 但是使用LruCache的时候 原本以为可以 解决这个问题.  但是发现还是出现了内存溢出的情况.   困扰很久 另外, ...

  9. Unity Shader入门精要学习笔记 - 第11章 让画面动起来

    转自 冯乐乐的 <Unity Shader入门精要> Unity Shader 中的内置变量 动画效果往往都是把时间添加到一些变量的计算中,以便在时间变化时画面也可以随之变化.Unity ...

  10. 获取dbf中的表名

    因为特殊需要,需要获取dbf数据库中的表的名称.现有 如下解决办法 public List<string> GetTableFields(string path) { List<st ...