bootstrap 按钮组件
按钮组件主要的类名:
.btn-toolbar 把几个 .btn-group 组合在一起,更复杂的组件
.btn-group
.btn-group-vertical 垂直堆叠显示 默认的是水平堆叠
按钮组件大小: .btn-group-lg大号 .btn-group-sm中号 .btn-group-xs 小号
综合用法: 可以根据需要自行组合
<div class="btn-toolbar">
<div class="btn-group">
` <button class="btn btn-default ">按钮1</button>
<button class="btn btn-default">按钮2</button>
</div>
<div class="btn-group">
<button class="btn btn-default ">按钮1</button>
<button class="btn btn-default ">按钮1</button>
<div class="btn-group"> <!--这一部分和 定义下拉菜单的代码一样 .dropdown-->
<button class="btn btn-default dropdown-toggle" data-toggle="dropdown">下拉按钮 <span class="caret"></span></button>
<ul class="dropdown-menu" role="menu">
<li class="dropdown-header">标题</li>
<li><a>html</a></li>
<li class="divider"><li>
<li><a>css</a></li>
</ul>
</div>
</div>
</div>
bootstrap 按钮组件的更多相关文章
- 详解Bootstrap按钮组件
按钮组也是一个独立的组件,所以可以找到相应的源码文件: Less:buttons.less Sass:_buttons.scss Css:Bootstrap.css 3131行~3291行 按钮 ...
- 详解Bootstrap按钮组件(二)
按钮下拉菜单 按钮下拉菜单仅从外观上看和下拉菜单效果基本上是一样的.它们唯一的不同是外部容器div.dropdown换成了div.btn-group <div class="btn-g ...
- 第二百三十七节,Bootstrap图标菜单按钮组件
Bootstrap图标菜单按钮组件 学习要点: 1.小图标组件 2.下拉菜单组件 3.按钮组组件 4.按钮式下拉菜单 本节课我们主要学习一下 Bootstrap 的三个组件功能:小图标组件.下拉菜单组 ...
- 详解Bootstrap缩略图组件及警示框组件
缩略图组件 缩略图在网站中最常用的就是产品列表页面,一行显示几张图片,有的在图片底下带有标题.描述内容.按钮等信息.bootstrap框架将这部分独立成一个模块组件,通过类名.thumbnail配合b ...
- 详解Bootstrap导航组件
在bootstrap框架中将导航独立出来成为一个导航组件,根据不同的版本,可以找到相应的源码: LESS: navs.less SASS: _navs.scss 标签形导航,也称选项卡导航 标签形 ...
- BootStrap布局组件
BootStrap字体图标(Glyphicons) BootStrap下拉菜单:下拉菜单是可以切换的,是以列表格式显示链接的上下文菜单. 类 描述 .dropdown 指定下拉菜单 .dropdown ...
- BootStrap常用组件及响应式开发
BootStrap常用组件 PS:所有的代码必须写在<class="container/container-fluid">容器当中 常用组件包含内容: 字体图标 下拉菜 ...
- 第二百四十七节,Bootstrap按钮和折叠插件
Bootstrap按钮和折叠插件 学习要点: 1.按钮 2.折叠 本节课我们主要学习一下 Bootstrap 中的按钮和折叠插件. 一.按钮 可以通过按钮插件创建不同状态的按钮,也就是点击后为选中状态 ...
- 【转载】BootStrap表格组件bootstrap table详解
(转载,来源“脚本之家”,作者不详) 一.Bootstrap Table的引入 关于Bootstrap Table的引入,一般来说还是两种方法: 1.直接下载源码,添加到项目里面来.由于Bootstr ...
随机推荐
- yarn详细入门教程(转载)
简介Yarn 是 Facebook, Google, Exponent 和 Tilde 开发的一款新的 JavaScript 包管理工具.就像我们可以从官方文档了解那样,它的目的是解决这些团队使用 n ...
- JVM之GC(二)
昨天总结了GC之前要做的事情,今天介绍一下主流的GC算法. 先介绍一下几个名词: Stop The World(STW):JVM进行GC的时候总不能一边清理垃圾一边制造垃圾把,那么垃圾鉴定的准确性根本 ...
- Linux学习_菜鸟教程_4
Linux远程登录 已经了解了登录流程,学会了用SecureCRT进行操作 Linux文件基本属性 Linux为保护系统安全,对不同的用户,开放不同的文件访问权限. 在linux中,我们可以使用ll或 ...
- A*寻路算法的个人理解
A*寻路算法是一个求两点之间的最短路径的方法 算法详情如下: 准备工作: 两个容器: open容器和close容器 价值估算公式: F = G + H G:从起点移动到指定方格的移动代价: ...
- JS 通过url地址栏获取html页面名称
有的时候需要获取页面名称,为此我在这里封装了一个方. 一.分别根据传递不同的参数,获取到html页面的名称. 通过传递参数,获取到html页面的名称:参数params 以下是参数解释说明 (1)par ...
- Java HashSet集合的子类LinkedHashSet集合
说明 HashSet保证元素的唯一性,可是元素存放进去是没有顺序的. 在HashSet下面有一个子类java.util.LinkedHashSet,它是 链表 + 哈希表(数组+链表 或者 数组+红黑 ...
- 字典树(增删改查 HDU 5687)
度熊手上有一本神奇的字典,你可以在它里面做如下三个操作: 1.insert : 往神奇字典中插入一个单词 2.delete: 在神奇字典中删除所有前缀等于给定字符串的单词 3.search: 查询是否 ...
- 信息: TLD skipped. URI: http://www.fusioncharts.com/jsp/core is already defined
二月 02, 2018 11:43:28 上午 org.apache.catalina.startup.TaglibUriRule body 信息: TLD skipped. URI: http:// ...
- python 继承机制
继承机制经常用于创建和现有类功能类似的新类,又或是新类只需要在现有类基础上添加一些成员(属性和方法),但又不想将现有类代码复制给新类.也就是说,通过继承这种机制,可以实现类的重复使用. class S ...
- ELK实战-elasticsearch安装
操作系统: centos版本 7.4 防火墙 关闭 selinux 关闭 elasticsearch版本 6.3.2 java版本 1.8 server1 192.168.10.126 server2 ...