下拉菜单项除了上面两种状态，还有 当前状态 （ .active ）和 禁用状态 （ .disabled ）。这两种状态使用方法只需要在对应的菜单项上添加对应的类名如： <li><a href="#">桃</a></li>
我们可以实现下面这样的效果：
按钮
我们在 《Bootstrap入门书籍之（二）表单》 中，已经了解过了Bootstrap中按钮的使用，在这里我们继续进行一些扩展！
按钮组及工具栏
单个按钮在Web页面中的运用有时候并不能满足我们的业务需求，常常会看到将多个按钮组合在一起使用，比如富文本编辑器里的一组小图标按钮等。这个时候我们就会需要用到按钮组
对于结构方面，非常的简单。使用一个名为 .btn-group 的容器，把多个按钮放到这个容器中。如：
<div> <button type="button">向左</button> <button type="button">中间</button> <button type="button">向右</button></div>
如何转化成工具栏呢？只需要再用一个 .btn-toolbar 的内容，将我们的 .btn-group 再进行一次包裹，同时，我们还可以使用 .btn-group-lg 大按钮组、 .btn-group-xs :超小按钮组这一系列的类添加到 .btn-group 容器来进行对一组按钮进行大小控制如下：
<div class= "btn-toolbar"> <!-- …… --> <div class= "btn-group "> <button type="button">向左</button> <button type="button">中间</button> <button type="button">向右</button> </div> <div class= "btn-group btn-group-sm"> <button type="button">向左</button> <button type="button">中间</button> <button type="button">向右</button> </div> <!-- …… --></div>
上面两段代码效果如下：
嵌套分组
这里的嵌套分组其实就是在分组按钮中嵌套了一个下拉菜单。使用的时候，只需要把当初制作下拉菜单的 .dropdown 的容器换成 .btn-group ，并且和普通的按钮放在同一级。如下所示：
<div> <button type="button">首页</button> <div> <button data-toggle="dropdown" type="button">产品展示<span></span></button> <ul> <li><a href="##">公司简介</a></li> <li><a href="##">企业文化</a></li> <li><a href="##">组织结构</a></li> <li><a href="##">客服服务</a></li> </ul> </div> <button type="button">关于</button></div>
当然我们还可以从 水平按钮组 变成 垂直分组 ，只需要在水平分组的最外层容器的类名 .btn-group 替换成 .btn-group-vertical ，就可以实现垂直分组的效果。
按钮的向下向上三角形
我们在下拉菜单和嵌套分组都都看到了一个按钮的向下三角形，我们是通过在 <button> 标签中添加一个 <span> 标签元素，并且命名为 caret ，这个三角形完全是通过CSS代码来实现的：
.caret { display: inline-block; width: 0; height: 0; margin-left: 2px; vertical-align: middle; border-top: 4px solid; border-right: 4px solid transparent; border-left: 4px solid transparent;}
有的时候我们的下拉菜单会 向上弹起 ，这个时候我们的 三角方向需要朝上 显示，实现方法：需要在 .btn-group 类上追加 dropup 类名（这也是做向上弹起下拉菜单要用的类名）。
.dropup .caret{ content: ""; border-top: 0;/*可以看到这里top与bottom的变化*/ border-bottom: 4px solid;}
那么现在就来对比一下，上面代码以及类的添加可以达到的不同效果：
导航
导航对于一位前端开发人来说眼应该都不陌生。可以说，每一个网页里面都会有导航的存在，便于用户查找网站所提供的各项功能服务。那么如何使用Bootstrap框架制作各式各样的导航呢？
基础样式