Bootstrap按钮组 按钮工具栏 嵌套
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>View1</title>
<link href="~/Bootstrap3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<script src="~/jquery3.3.1/jquery-3.3.1.min.js"></script>
<script src="~/Bootstrap3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div class="btn-group" role="group" aria-label="Basic example">
<button type="button" class="btn btn-default">Left</button>
<button type="button" class="btn btn-default">Middle</button>
<button type="button" class="btn btn-default">Right</button>
</div>
<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>
<div class="btn-group" role="group" aria-label="Button group with nested dropdown">
<button type="button" class="btn btn-default">1</button>
<button type="button" class="btn btn-default">2</button>
<div class="btn-group" role="group">
<button id="btnGroupDrop1" type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Dropdown
<span class="caret"></span>
</button>
<ul class="dropdown-menu" aria-labelledby="btnGroupDrop1">
<li><a href="#">Dropdown link</a></li>
<li><a href="#">Dropdown link</a></li>
</ul>
</div>
</div>
</body>
</html>
Bootstrap按钮组 按钮工具栏 嵌套的更多相关文章
- BootStrap学习(2)_下拉菜单&按钮组
一.下拉菜单 1.基本下拉菜单 如需使用下列菜单,只需要在class .dropdown 内加上下拉菜单即可.下面的实例演示了基本的下拉菜单: <!DOCTYPE html> <ht ...
- Bootstrap按钮组学习
简介 通过按钮组容器把一组按钮放在同一行里.通过与按钮插件联合使用,可以设置为单选框或多选框的样式和行为. 按钮组中的工具提示和弹出框需要特别的设置 当为 .btn-group 中的元素应用工具提示或 ...
- Bootstrap-CL:按钮组
ylbtech-Bootstrap-CL:按钮组 1.返回顶部 1. Bootstrap 按钮组 按钮组允许多个按钮被堆叠在同一行上.当你想要把按钮对齐在一起时,这就显得非常有用.您可以通过 Boot ...
- bootstrap 按钮组的嵌套
您可以在一个按钮组内嵌套另一个按钮组,即,在一个 .btn-group 内嵌套另一个 .btn-group .当您想让下拉菜单与一系列按钮组合使用时,就会用到这个. 实例: <!DOCTYPE ...
- Bootstrap<基础十三> 按钮组
按钮组允许多个按钮被堆叠在同一行上.当你想要把按钮对齐在一起时,这就显得非常有用.你可以通过Bootstrap 按钮(Button) 插件 添加可选的 JavaScript 单选框和复选框样式行为. ...
- Bootstrap系列 -- 30. 按钮工具栏
在富文本编辑器中,将按钮组分组排列在一起,比如说复制.剪切和粘贴一组:左对齐.中间对齐.右对齐和两端对齐一组.Bootstrap框架按钮工具栏也提供了这样的制作方法,你只需要将按钮组“btn-grou ...
- BootStrap 按钮组简单介绍
学会按钮组需要掌握以下几个类. btn btn-group btn-toolbar btn-group-vertical 和 下拉菜单的基本类 dropdown-toggle dropdow ...
- Bootstrap入门(九)组件3:按钮组
Bootstrap入门(九)组件3:按钮组 先引入本地的CSS文件和JS文件(注:1.bootstrap是需要jQuery支持的.2.需要在<body>当中添加) <link h ...
- bootstrap按钮组
种类 -a, input , button 块级 btn-block 按钮组 btn-group btn-group-justified btn-group-vertical </div ...
随机推荐
- (转)PHP 函数的实现原理及性能分析
前言 任何语言中,函数都是最基本的组成单元.对于php的函数,它具有哪些特点?函数调用是怎么实现的?php函数的性能如何,有什么使用建议?本文 将从原理出发进行分析结合实际的性能测试尝试对这些问题进行 ...
- [SCSS] Use Standard Built-in SCSS Functions for Common Operations
We can use javascript for color and opacity variations, math, list and map logic or to see if someth ...
- 【物理/数学】概念的理解 —— pivot、position
0. 基本释义 pivot: n. 枢轴:中心点:旋转运动 vt. 以-为中心旋转:把-置于枢轴上 vi. 在枢轴上转动:随-转移 adj. 枢轴的:关键的 position: n. 位置,方位:职位 ...
- 以Graphicslayer为管理组来管理Element.
转自原文 以Graphicslayer为管理组来管理Element. 前言 在AE开发过程中,我们经常使用Element(元素).它的出现让地图与用户之间的交互增加了不少的效果.在地图上,可以通过各种 ...
- [_UICascadingTextStorage attributesAtIndex:effectiveRange:]: Range or index out of bounds
之前写过一篇<如何更好地限制一个UITextField的输入长度>,在文章最后得到的结论是可以直接使用 UIKIT_EXTERN NSString *const UITextFieldTe ...
- NET C#转Java
NET C#转Java .NET C#转Java没那么难,都是面向对象的语言,而且语法还是相似的,先对比一下开发环境,再到Servlet,再到MVC,都是一样一样的,只是JAVA的配制项比较多而已,只 ...
- gdal库对ENVI文件的一点支持不好
作者:朱金灿 来源:http://blog.csdn.net/clever101 使用GDALOpen函数打开ENVI的img文件,如果使用更新的方式即GA_Update会改写对应的hdr文件.改写h ...
- reflect(反射)了解一点点
A a = new A() 这个代码在程序编译阶段,会自己主动定位到A类上,而且新建一个A的实例. 可是假设我们希望程序在执行时.动态的创建一个A的实例.此时程序仅仅知道要从名字叫A的类中创建一个实例 ...
- 在CentOS系统上将deb包转换为rpm包
转载自 http://www.heminjie.com/system/linux/1487.html deb文件格式本是ubuntu/debian系统下的安装文件,那么我想要在redhat/cento ...
- SQL基础问题整理
在程序中,数据库操作是必不可少的部分,所以我们要备足数据库相关知识才能去应付程序中出现的种种问题.基于此,我特地在国外网站.博客上整理了一些问题,并附带了答案和解释.参考.为了保证“原汁原味”,我就保 ...