bootstrap样式

bootstrap按钮样式

​
<button class="btn btn-block btn-primary">Like</button>
<button class="btn btn-block btn-info">Info</button>
<button class="btn btn-block btn-danger">Delete</button>

​

运行结果：

btn为按钮添加圆角样式

btn-block将按钮长度扩充至块级元素长度

btn-primary,btn-info,btn-danger为按钮添加颜色

给按钮添加图标

<div class="row">
<div class="col-xs-4">
<button class="btn btn-block btn-primary fa fa-thumbs-up">Like</button>
</div>
<div class="col-xs-4">
<button class="btn btn-block btn-info fa fa-info-circle ">Info</button>
</div>
<div class="col-xs-5">
<button class="btn btn-block btn-danger fa fa-trash">Delete</button>
</div>
</div>

运行结果：

页面布局

<div class="row">
<div class="col-xs-4"><button class="btn btn-block btn-primary">Like</button></div>
<div class="col-xs-5"><button class="btn btn-block btn-info">Like</button></div>
</div>

col-xs-*：指定元素占多少列宽，*= 4即占4个像素列宽