@{
    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按钮组 按钮工具栏 嵌套的更多相关文章

  1. BootStrap学习(2)_下拉菜单&按钮组

    一.下拉菜单 1.基本下拉菜单 如需使用下列菜单,只需要在class .dropdown 内加上下拉菜单即可.下面的实例演示了基本的下拉菜单: <!DOCTYPE html> <ht ...

  2. Bootstrap按钮组学习

    简介 通过按钮组容器把一组按钮放在同一行里.通过与按钮插件联合使用,可以设置为单选框或多选框的样式和行为. 按钮组中的工具提示和弹出框需要特别的设置 当为 .btn-group 中的元素应用工具提示或 ...

  3. Bootstrap-CL：按钮组

    ylbtech-Bootstrap-CL:按钮组 1.返回顶部 1. Bootstrap 按钮组 按钮组允许多个按钮被堆叠在同一行上.当你想要把按钮对齐在一起时,这就显得非常有用.您可以通过 Boot ...

  4. bootstrap 按钮组的嵌套

    您可以在一个按钮组内嵌套另一个按钮组,即,在一个 .btn-group 内嵌套另一个 .btn-group .当您想让下拉菜单与一系列按钮组合使用时,就会用到这个. 实例: <!DOCTYPE ...

  5. Bootstrap<基础十三> 按钮组

    按钮组允许多个按钮被堆叠在同一行上.当你想要把按钮对齐在一起时,这就显得非常有用.你可以通过Bootstrap 按钮(Button) 插件 添加可选的 JavaScript 单选框和复选框样式行为. ...

  6. Bootstrap系列 -- 30. 按钮工具栏

    在富文本编辑器中,将按钮组分组排列在一起,比如说复制.剪切和粘贴一组:左对齐.中间对齐.右对齐和两端对齐一组.Bootstrap框架按钮工具栏也提供了这样的制作方法,你只需要将按钮组“btn-grou ...

  7. BootStrap 按钮组简单介绍

    学会按钮组需要掌握以下几个类. btn   btn-group btn-toolbar  btn-group-vertical   和 下拉菜单的基本类 dropdown-toggle dropdow ...

  8. Bootstrap入门（九）组件3：按钮组

    Bootstrap入门(九)组件3:按钮组   先引入本地的CSS文件和JS文件(注:1.bootstrap是需要jQuery支持的.2.需要在<body>当中添加) <link h ...

  9. bootstrap按钮组

    种类 -a,   input ,   button 块级 btn-block 按钮组 btn-group btn-group-justified btn-group-vertical </div ...

随机推荐

  1. 将Sublime Text2 加入右键菜单

    在googleread里面看有人推荐sublime text2.说开发很方便.就下载一个试试.写html还真的挺爽. 于是按照vim加入鼠标右键的方法.果然可以.这里和大家分享 1. 运行中输入 re ...

  2. RGCDQ（线段树+数论）

    题意:求n和m之间的全部数的素因子个数的最大gcd值. 分析:这题好恶心.看着就是一颗线段树.但本题有一定的规律,我也是后来才发现,我还没推出这个规律.就不说了,就用纯线段树解答吧. 由于个点数都小于 ...

  3. 微信开发之八 页面获取周围beacon设备

    原文链接:https://blog.csdn.net/qq_37936542/article/details/78912197 --注意:微信测试号不具备这个功能 步骤一:绑定域名   注意不要加ht ...

  4. poi读取excell表格

    原文链接:http://blog.csdn.net/qq_37936542/article/details/79024847 最近项目需要实现一个将excell中的数据导入数据库,在网上找到这篇文章, ...

  5. USACO--2.1The Castle

    思路:这个题目难在建图,開始的时候我想把每一个房间没有墙的面求出来,然后再和他邻近的房间加上一条边进行建图,后面发现要通过题目给定的条件求出房间那个面没有墙是十分困难的:后面參考了别人的思路,我们记录 ...

  6. android使用Gson来解析json

    Gson是一种对象的解析json,非常好用,介绍一个站点http://json.parser.online.fr/能够帮我们看一个字符串是不是Json 对于Json文件 { "id" ...

  7. transform、accumulate —— C++ 下的 MapReduce

    accumulate:Map,逐元素分别单独处理: 注:for_each:不改变区间元素的内容,所以更多的是输出打印等功能: accumulate:Reduce,整体化归为一个单独的数值: 两个函数均 ...

  8. Visual Studio Debugger

    Visual Studio Debugger中七个鲜为人知的小功能   Visual Studio debugger是一个很棒的调试工具,可以帮助程序猿们快速地发现和解决问题.这里给大家简单介绍一下V ...

  9. UITableView的一些常用设置和代理方法

    - (void)viewDidLoad { [super viewDidLoad]; tableview = [[UITableView alloc]initWithFrame:CGRectMake( ...

  10. ITFriend创业败局(三)：技术人员创业，需要尽可能避免，或者需要解决的5个重要问题

    一.插科打诨: 本想给小雷粉,做一个创业"成功案例"的,结果做成了一个"反面教材"~ No zuo,no die~ 二.写作目的:分享自己作为一名技术人员,或者 ...