等分按钮也常被称为是自适应分组按钮，其实现方法也非常的简单，只需要在按钮组“btn-group”上追加一个“btn-group-justified”类名.

<div class="btn-wrap">

    <div class="btn-group btn-group-justified">

    <a class="btn btn-default" href="#">首页</a>

    <a class="btn btn-default" href="#">产品展示</a>

    <a class="btn btn-default" href="#">案例分析</a>

    <a class="btn btn-default" href="#">联系我们</a>

  </div>

</div>

<div class="container-fluid">

        <div class="row">

            <div class="col-lg-10 col-lg-offset-1">

                <div class="btn-group btn-group-justified">

                    <a class="btn btn-default" href="#">首页</a>

                    <a class="btn btn-default" href="#">产品展示</a>

                    <a class="btn btn-default" href="#">案例分析</a>

                    <a class="btn btn-default" href="#">联系我们</a>

                </div>

            </div>

        </div>

</div>

Bootstrap系列 -- 33. 等分按钮的更多相关文章

  1. Bootstrap系列 -- 22. 按钮详解

    Bootstrap框架首先通过基础类名“.btn”定义了一个基础的按钮风格,然后通过“.btn-default”定义了一个默认的按钮风格.默认按钮的风格就是在基础按钮的风格的基础上修改了按钮的背景颜色 ...

  2. Bootstrap系列 -- 22. 按钮

    Bootstrap框架首先通过基础类名“.btn”定义了一个基础的按钮风格,然后通过“.btn-default”定义了一个默认的按钮风格.默认按钮的风格就是在基础按钮的风格的基础上修改了按钮的背景颜色 ...

  3. 反爬虫：利用ASP.NET MVC的Filter和缓存（入坑出坑） C#中缓存的使用 C#操作redis WPF 控件库——可拖动选项卡的TabControl 【Bootstrap系列】详解Bootstrap-table AutoFac event 和delegate的分别 常见的异步方式async 和 await C# Task用法 c#源码的执行过程

    反爬虫:利用ASP.NET MVC的Filter和缓存(入坑出坑)   背景介绍: 为了平衡社区成员的贡献和索取,一起帮引入了帮帮币.当用户积分(帮帮点)达到一定数额之后,就会“掉落”一定数量的“帮帮 ...

  4. Bootstrap<基础十四> 按钮下拉菜单

    使用 Bootstrap class 向按钮添加下拉菜单.如需向按钮添加下拉菜单,只需要简单地在在一个 .btn-group 中放置按钮和下拉菜单即可.也可以使用 <span class=&qu ...

  5. ASP.NET MVC使用Bootstrap系列（3）——使用Bootstrap 组件

    阅读目录 Bootstrap 导航条 列表组 徽章 媒体对象 页头 路径导航 分页 输入框组 按钮式下拉菜单 警告框 进度条 小结 Bootstrap为我们提供了十几种的可复用组件,包括字体图标.下拉 ...

  6. bootstrap学习笔记(菜单.按钮)

    下拉菜单 <div class="dropdown"> <button class="btn btn-default dropdown-toggle&q ...

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

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

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

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

  9. Bootstrap历练实例：按钮组大小

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

随机推荐

  1. ubuntu创建、删除文件及文件夹方法

    mkdir 目录名         => 创建一个目录 rmdir 空目录名      => 删除一个空目录 rm 文件名 文件名   => 删除一个文件或多个文件 rm –rf 非 ...

  2. jQuery form插件的使用--处理server返回的JSON， XML，HTML数据

    详细代码: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> & ...

  3. JS高级程序设计2nd部分知识要点2

    ECMAScript中所有函数的参数都是按值传递的. 5种基本数据类型: Undfined,Null,Boolean,Number,String. 当代码在一个环境中执行时,会创建变量对象的一个作用域 ...

  4. 恶意IP远程登录Linux服务器脚本

    #!/bin/sh #auto drop ssh failed IP address #定义变量 SEC_FILE=/var/log/secure #如下为截取secure文件恶意ip 远程登录22端 ...

  5. ASP.NET中常用的几个李天平开源公共类LTP.Common,Maticsoft.DBUtility,LtpPageControl (转)

    ASP.NET中常用的几个开源公共类: LTP.Common.dll: 通用函数类库     源码下载Maticsoft.DBUtility.dll 数据访问类库组件     源码下载LtpPageC ...

  6. Linux命令的类型

    1.内建命令: 由shell程序自带的命令,最常见的有cd.pwd等. 使用type命令即可查看命令属于哪种,比如: #type cd cd is a shell builtin ————>看到 ...

  7. HDU 3374 String Problem (KMP+最大最小表示)

    KMP,在有循环节的前提下: 循环节 t = len-next[len], 个数num = len/(len-next[len]);个人理解,如果有循环节,循环节长度必定小于等于len/2, 换句话说 ...

  8. SSH applicationContext.xml文件配置

    <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.sp ...

  9. linux下安装+配置+卸载jdk

    一. 解压安装jdk在shell终端下进入jdk1.7.0_55.bin文件所在目录, 执行命令 ./jdk1.7.0_55.bin 这时会出现一段协议,连继敲回车,当询问是否同意的时候,输入yes, ...

  10. excel相关

    1.excel怎样筛选重复数据 打开Excel文件,选中待处理的数据区域,然后分别点击菜单开始--条件格式--突出显示单元格规则--重复值. 确认以Excel默认的格式突出显示重复值.之后,重复的数据 ...