按钮样式

基础样式

 .btn{
            display:inline-block;
            border: 1px solid transparent;
            padding:6px 12px;
            border-radius: 4px;
            font-weight: 400;
            line-height: 1.42857143;
            text-align: center;
            white-space: nowrap;
           vertical-align: middle

　　　　　　outline: 0;

}

背景样式扩展：

 .btn.btn-primary{
            background-color:cornflowerblue;
            color:#fff;
            border-color:blue;
        }
        .btn.btn-primary:hover{
            background-color: blue;
        }

<a class="btn btn-primary btn-lg">按钮样式</a>

 

改变按钮大小：

 .btn.btn-lg{
            padding: 10px 16px;
            font-size: 18px;
            line-height: 1.3333333;
            border-radius: 6px;
        }

引用：

<a class="btn btn-primary btn-lg">按钮样式</a>

<input class="btn btn-primary btn-lg" value="按钮样式">

<button class="btn btn-primary btn-lg">按钮样式</button>