bootstrap的按钮和按钮群组

按钮

    <div class="container">
        <h1 class="page-header">
            按钮<small>按钮的基本样式</small>
        </h1>

        <div style="margin-bottom: 15px">
            <a href="#" class="btn btn-large  btn-success"><i class="icon-comment"></i> 查看评论</a>
        </div>

        <div style="margin-bottom: 15px">
            <button type="submit" class="btn">
                <i class="icon-shopping-cart"></i>结账
            </button>
        </div>

    <div style="margin-bottom: 15px">
        <input type="button" class="btn" value="设置">
    </div>
    </div>

为按钮添加样式，改变按钮在页面中显示的样式，
        .btn，在页面显示基本按钮，但鼠标放上按钮会改变颜色
        .btn-primary将按钮样式变为蓝色（天蓝）,
        .btn-info 浅蓝，
        .btn-success 绿色
        .btn-warning 橙色
        .btn-danger 类似红色
        .btn-inverse 浅黑
改变按钮的尺寸：
             .btn-large:按钮变大
             .btn-small：按钮变中
             .btn-mini:按钮变小 

<i class="icon-shopping-cart"></i>可以使用bootstrap里面的图片

按钮群组

    <div class="container">
        <h1 class="page-header">
            按钮<small>按钮群组</small>
        </h1>


        <div class="btn-toolbar">
            <div class="btn-group">
                <button class="btn">右对齐</button>
                <button class="btn">居中</button>
                <button class="btn">左对齐</button>
            </div>

            <div class="btn-group">
                <button class="btn">粗体</button>
                <button class="btn">斜体</button>
                <button class="btn">下划线</button>
            </div>
        </div>

        <button class="btn">哈哈</button>
        <button class="btn">嘻嘻</button>
        <button class="btn">呵呵</button>
    </div>

class=”btn-group”：可是使按钮很好的结合在一起，四个角会变成圆角。

class=”btn-toolbar”:可以使按钮组之间，排列在一行，中间留出一点空隙。