Bootstrap创建按钮工具栏

按钮工具栏

如果想在一行内放置多个按钮组，只需把这些按钮组统统放到一个类为 .btn-toolbar 的容器中即可。常常用它来创建按钮工具栏。如：

<div class="btn-toolbar" role="toolbar" aria-label="Toolbar with button groups">
<div class="btn-group" role="group" aria-label="First group">
<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>
<button type="button" class="btn btn-default">4</button>
</div>
<div class="btn-group" role="group" aria-label="Second group">
<button type="button" class="btn btn-default">5</button>
<button type="button" class="btn btn-default">6</button>
<button type="button" class="btn btn-default">7</button>
</div>
<div class="btn-group" role="group" aria-label="Third group">
<button type="button" class="btn btn-default">8</button>
</div>
</div>

效果如图 3‑16所示：

图3-16 按钮工具栏

关于作者

歪脖先生，十五年以上软件开发经验，酷爱Web开发，精通 HTML、CSS、JavaScript、jQuery、JSON、Python、Less、Bootstrap等，著有《HTML宝典》、《揭秘CSS》、《Less简明教程》、《JSON教程》、《Bootstrap2用户指南》、《Bootstrap3实用教程》，并全部在 GitHub 上开源。

Bootstrap创建按钮工具栏相关推荐

Bootstrap创建按钮下拉菜单
按钮下拉菜单下拉菜单组件是一个独立的组件,可以将页面上的任何元素(如,按钮.导航等)和下拉菜单进行组合,让相应的元素具有下拉功能. 如果把按钮和下拉菜单进行组合,并让按钮充当下拉菜单的开关,就可以实 ...
Bootstrap创建按钮组
按钮组在实际应用中,单个按钮有时候并不能满足我们的业务需求,常常需要将多个按钮组合在一起使用,形成一个页面组件,比如富文本编辑器中的一组小图标按钮等. 创建按钮组要创建按钮组,只需把相关的链接或按 ...
bootstrap-按钮（按钮工具栏）
1.运行效果如图所示 2.实现代码如下 <!DOCTYPE html> <html> <head><meta charset="utf-8" ...
Bootstrap -- 插件: 按钮状态、折叠样式、轮播样式
Bootstrap -- 插件: 按钮状态.折叠样式.轮播样式 1. 按钮(Button)插件:可以添加进一些交互,比如控制按钮状态. 如需向按钮添加加载状态,只需要简单地向 button 元素添加 ...
【MFC】固定按钮工具栏
00. 目录文章目录 00. 目录 01. 案例概述 02. 开发环境 03. 关键技术 04. 程序设计 05. 秘笈心法 06. 源码下载 07. 附录 01. 案例概述通过MFC向导创建的应 ...
创建bootstrap项目_使用Bootstrap创建第一个网页
创建bootstrap项目使用Bootstrap创建第一个网页 (Create First Webpage with Bootstrap) In the previous article, we l ...
Bootstrap 拼接式按钮菜单
拼接式按钮菜单由两个按钮拼接而成,一个是动作按钮,一个是下拉菜单开关按钮,它们之间被一个分隔线隔开.下拉菜单开关按钮表现为一个三角符号.用户点击主操作按钮,完成按钮相关动作:点击开关按钮,会弹出菜单. ...
Bootstrap之按钮的样式
在bootstrap中, 按钮(button)有不同的六种方式. 默认的button的样式是: btn. 这个是必要的样式. 还有其他的六种不同方式展现.分别为: 默认, 主要, 成功, 信息, 警告 ...
adobe flash创建按钮并添加动作【Z】
创建按钮元件下面以制作一个"END"按钮为例讲解按钮元件的制作方法. (1)新建一个文件,执行"插入/新建元件"命令. (2)打开"新建元件&quo ...

Bootstrap创建按钮工具栏

按钮工具栏

Bootstrap创建按钮工具栏相关推荐

最新文章

热门文章