普通的按钮

<button class="btn btn-lg btn-default btn-block">
Default
</button>

由图标填充的按钮

<button type="button" class="btn btn-default"><i class="fa fa-align-left"></i>
</button>

<i>元素为图标，图标样式可参考：https://adminlte.io/themes/AdminLTE/pages/UI/icons.html

按钮组.btn-group

水平按钮组

按钮组中各个按钮默认水平一行显示，圆角，不同颜色，内容为文字。

<div class="btn-group"><button type="button" class="btn btn-default">Left</button><button type="button" class="btn btn-danger">Middle</button><button type="button" class="btn btn-primary">Right</button>
</div>

垂直按钮组

按钮组中各个按钮垂直显示，直角，内容为图标。

<div class="btn-group-vertical"><button type="button" class="btn btn-default btn-flat"><i class="fa fa-align-left"></i></button><button type="button" class="btn btn-default btn-flat"><i class="fa fa-align-center"></i></button><button type="button" class="btn btn-default btn-flat"><i class="fa fa-align-right"></i></button>
</div>

按钮带下拉选项的按钮组

<!--定义一个按钮组-->
<div class="btn-group"><!--提示用按钮，无点击效果--><button type="button" class="btn btn-info">Action</button><!--点击出下拉菜单的按钮，位于提示按钮之后--><button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false"><!--span显示为“向下的三角图标--><span class="caret"></span><!--.sr-only是 除了屏幕阅读器外，其他设备上隐藏该元素，这个是用于屏幕阅读器的，帮助残障人士更好的访问网站。--><span class="sr-only">Toggle Dropdown</span></button><!--定义下拉菜单--><ul class="dropdown-menu" role="menu"><li><a href="#">Action</a></li><li><a href="#">Another action</a></li><li><a href="#">Something else here</a></li><li class="divider"></li><li><a href="#">Separated link</a></li></ul>
</div>

位于input输入框之后的按钮

<!--必须是按钮组-->
<div class="input-group margin"><!--input框必须添加.form-control样式，否则与其后的按钮之间会有空隙--><input type="text" class="form-control"><!--由span.input-group-btn包裹按钮，也可使用div,但是必须有.input-group-btn--><span class="input-group-btn"><button type="button" class="btn btn-info btn-flat">Go!</button></span>
</div>

调整div.input-group中input元素和span元素的前后排序，可更改input输入框与按钮的排序。

位于input输入框之前的按钮，并有点击下拉效果。

<div class="input-group"><!--input输入框按钮--><div class="input-group-btn"><!--注意与上例中“下拉按钮组”的区别，这里用一个button显示了文字及下拉图标，而“下拉按钮组”中使用了两个button--><button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-expanded="false">Action <!--下拉图标--><span class="fa fa-caret-down"></span></button><!--下拉菜单项的定义与“下拉按钮组”相同--><ul class="dropdown-menu"><li><a href="#">Action</a></li><li><a href="#">Another action</a></li><li><a href="#">Something else here</a></li><!--分隔线--><li class="divider"></li><li><a href="#">Separated link</a></li></ul></div><input type="text" class="form-control">
</div>

APP图标效果的按钮，并带有角标span.badge

<!--App样式按钮.btn-app-->
<a class="btn btn-app"><!--按钮中显示的图标--><i class="fa fa-edit"></i><!--图标下显示的文字-->Edit
</a>
<a class="btn btn-app"><!--角标，黄色，内容：3--><span class="badge bg-yellow">3</span><i class="fa fa-bullhorn"></i> Notifications
</a>

图标样式可参考：https://adminlte.io/themes/AdminLTE/pages/UI/icons.html

按钮带提示信息

<button type="button" data-toggle="tooltip" data-original-title="点击修改" class="btn btn-info btn-xs" onclick="">修改</button>