Bootstrap系列 -- 33. 等分按钮

  等分按钮也常被称为是自适应分组按钮,其实现方法也非常的简单,只需要在按钮组“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>
时间: 2024-09-30 19:59:30

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

Bootstrap系列 -- 22. 按钮

Bootstrap框架首先通过基础类名“.btn”定义了一个基础的按钮风格,然后通过“.btn-default”定义了一个默认的按钮风格.默认按钮的风格就是在基础按钮的风格的基础上修改了按钮的背景颜色.边框颜色和文本颜色. <button type="button" class="btn btn-default">基本样式</button> 几种不同样式风格的按钮 <button class="btn" type=&

Bootstrap系列 -- 22. 按钮详解

Bootstrap框架首先通过基础类名“.btn”定义了一个基础的按钮风格,然后通过“.btn-default”定义了一个默认的按钮风格.默认按钮的风格就是在基础按钮的风格的基础上修改了按钮的背景颜色.边框颜色和文本颜色. <button type="button" class="btn btn-default">基本样式</button> 几种不同样式风格的按钮 <button class="btn" type=&

bootstrap-按钮(等分按钮)

1.运行效果如图所示 2.实现代码如下 <!DOCTYPE html> <html> <head>     <meta charset="utf-8">     <meta http-equiv="X-UA-Compatible" content="IE=edge">     <title>按钮(等分按钮)</title>     <!-- 最新版本的 Bo

ASP.NET MVC使用Bootstrap系列(3)——使用Bootstrap 组件

Bootstrap为我们提供了十几种的可复用组件,包括字体图标.下拉菜单.导航.警告框.弹出框.输入框组等.在你的Web Application中使用这些组件,将为用户提供一致和简单易用的用户体验. Bootstrap组件本质上是结合了各种现有Bootstrap元素以及添加了一些独特Class来实现.Bootstrap元素我在上一篇文章中涉及到,具体可以参考<ASP.NET MVC使用Bootstrap系列(2)——使用Bootstrap CSS和HTML元素>. 在这篇博客中,我将继续探索B

Bootstrap之菜单、按钮及导航

下拉菜单(基本用法) 特别声明:因为Bootstrap的组件交互效果都是依赖于jQuery库写的插件,所以在使用bootstrap.min.js之前一定要先加载jquery.min.js才会生效果 <div class="dropdown"> <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" dat

Bootstrap&lt;基础十四&gt; 按钮下拉菜单

使用 Bootstrap class 向按钮添加下拉菜单.如需向按钮添加下拉菜单,只需要简单地在在一个 .btn-group 中放置按钮和下拉菜单即可.也可以使用 <span class="caret"></span> 来指示按钮作为下拉菜单. 下面的实例演示了一个基本的简单的按钮下拉菜单: <!DOCTYPE html> <html> <head> <title>Bootstrap 实例 - 基本的按钮下拉菜单&

Bootstrap历练实例:按钮组大小

<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>Bootstrap历练实例:按钮组大小</title> <meta charset="utf-8" /> <meta name="viewpor

jQuery源码分析系列(33) : AJAX中的前置过滤器和请求分发器

jQuery1.5以后,AJAX模块提供了三个新的方法用于管理.扩展AJAX请求,分别是: 1.前置过滤器 jQuery. ajaxPrefilter 2.请求分发器 jQuery. ajaxTransport, 3.类型转换器 ajaxConvert 源码结构: jQuery.extend({ /** * 前置过滤器 * @type {[type]} */ ajaxPrefilter: addToPrefiltersOrTransports(prefilters), /** * 请求分发器 *

TCP系列33—窗口管理&流控—7、Silly Window Syndrome(SWS)

一.SWS介绍 前面我们已经通过示例看到如果接收端的应用层一直没有读取数据,那么window size就会慢慢变小最终可能变为0,此时我们假设一种场景,如果应用层读取少量数据(比如十几bytes),接收端TCP有了少量的新的接收缓存后如果立即进行window update把新的window size通告发送端的话,发送端如果立即发送数据,那么接收端缓存可能又会立即耗尽,window size又变为0,接着应用层重复读取少量数据,这个过程重复的话,那么发送端就会频繁的发送大量的小包,这种场景我们就