Bootstrap 按钮组

按钮组把多个按钮放进 btn-group 容器，让它们首尾相接、圆角自动合并，视觉上像一个整体，常用于"上一步/下一步""放大/缩小"这类成组操作。

基础按钮组

把多个 btn 包进同一个 btn-group，各按钮自动连成一体；颜色样式仍用 btn-* 类随意搭配。

<div class="btn-group">
  <button type="button" class="btn btn-default">左</button>
  <button type="button" class="btn btn-default">中</button>
  <button type="button" class="btn btn-default">右</button>
</div>
<!-- 效果：三个按钮紧贴成一组，相邻边不留缝隙、圆角只保留在最外侧 -->

不同颜色与图标

按钮组里的按钮可以是不同情境色，也能嵌入 glyphicon 图标，适合做一排工具按钮。

<div class="btn-group">
  <button type="button" class="btn btn-success"><span class="glyphicon glyphicon-ok"></span></button>
  <button type="button" class="btn btn-warning"><span class="glyphicon glyphicon-pencil"></span></button>
  <button type="button" class="btn btn-danger"><span class="glyphicon glyphicon-trash"></span></button>
</div>
<!-- 效果：绿、黄、红三个图标按钮连成一排工具条 -->

尺寸变体

btn-group-lg、btn-group-sm、btn-group-xs 可整体放大或缩小按钮组，比逐个按钮加 btn-lg 更省事。

<div class="btn-group btn-group-lg">
  <button type="button" class="btn btn-default">大按钮</button>
  <button type="button" class="btn btn-default">大按钮</button>
</div>
<div class="btn-group btn-group-xs">
  <button type="button" class="btn btn-default">小按钮</button>
  <button type="button" class="btn btn-default">小按钮</button>
</div>
<!-- 效果：第一组按钮明显更大，第二组明显更小 -->

垂直按钮组

把容器类改成 btn-group-vertical，按钮会从横向排列变成纵向堆叠，适合侧边操作栏。

<div class="btn-group-vertical">
  <button type="button" class="btn btn-default">顶部</button>
  <button type="button" class="btn btn-default">中部</button>
  <button type="button" class="btn btn-default">底部</button>
</div>
<!-- 效果：三个按钮纵向排列成一条竖排工具条 -->

按钮工具栏

多个按钮组放进 btn-toolbar，组与组之间自动留出间距形成完整工具条；组内还可以嵌套下拉菜单。

<div class="btn-toolbar">
  <div class="btn-group">
    <button type="button" class="btn btn-default">文件</button>
    <button type="button" class="btn btn-default">编辑</button>
  </div>
  <div class="btn-group">
    <button type="button" class="btn btn-default">剪切</button>
    <button type="button" class="btn btn-default">复制</button>
  </div>
</div>
<!-- 效果：两小组按钮之间出现自然间距，类似软件工具栏 -->

小结

按钮组用容器 class 解决"批量按钮的排版与圆角合并"，配合尺寸、垂直、工具栏等变体，可覆盖绝大多数成组操作场景。