Bootstrap-按钮组

Bootstrap--按钮组
http://v2.bootcss.com/components.html#buttonGroups

 <div class="bs-docs-example">
        <div class="btn-toolbar" style="margin: 0;">
<!--单一按钮组:将带有.btn类的一系列按钮包裹在.btn-group中-->
             <div class="btn-group">
                <button class="btn">1</button>
                <button class="btn">2</button>
                <button class="btn">3</button>
                <button class="btn">4</button>
             </div>
<!--多维按钮组:多个<div class="btn-group">放入<div class="btn-toolbar">中即可获得多维按钮组；垂直按钮组:.btn-group-vertical让一组按钮呈现出垂直方向堆叠的样式-->
             <div class="btn-group btn-group-vertical">
                <button class="btn"><i class="icon-align-left"></i></button>
                <button class="btn"><i class="icon-align-center"></i></button>
                <button class="btn"><i class="icon-align-right"></i></button>
             </div>
<!--按钮放入.btn-group中，并为其添加适当的菜单标签，即可让此按钮触发下拉菜单-->             
             <div class="btn-group">
                <button class="btn btn-primary dropdown-toggle" data-toggle="dropdown">8<span class="caret"></span></button>
                	<ul class="dropdown-menu">
                  	<li><a href="#">9</a></li>
                  	<li><a href="#">10</a></li>
                  	<li><a href="#">11</a></li>
                  	<li class="divider"></li>
                  	<li><a href="#">12</a></li>
                </ul>
             </div>
<!--分列式按钮：左侧是一个标准形式的按钮，右侧是一个可触发下拉菜单的链接。-->
             <div class="btn-group">
                <button class="btn btn-danger">8</button>
                <button class="btn btn-danger dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
                <ul class="dropdown-menu">
                  <li><a href="#">9</a></li>
                  <li><a href="#">10</a></li>
                  <li><a href="#">11</a></li>
                  <li class="divider"></li>
                  <li><a href="#">12</a></li>
                </ul>
              </div><!-- /btn-group -->
<!--给.dropdown-menu的直接父节点添加一个类就可以让下拉菜单由下到上显示。.caret将会自动翻转，菜单的位置也会变为由下到上而不是由上到下了-->
			<div class="btn-group dropup">
                <button class="btn">18Dropup</button>
                <button class="btn dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
                <ul class="dropdown-menu">
                  	<li><a href="#">19</a></li>
                  	<li><a href="#">20</a></li>
                  	<li><a href="#">21</a></li>
                  	<li class="divider"></li>
                  	<li><a href="#">22</a></li>
                </ul>
            </div><!-- /btn-group -->
        </div>
    </div>