bootstrap常用

<div class="row">
<div class="col-xs-6 col-sm-3">.col-xs-6 .col-sol-xs-6 .col-sm-3ol-xs-6 .col-sm-3ol-xs-6 .col-sm-3ol-xs-6 .col-sm-3
m-3</div>
<div class="col-xs-6 col-sm-3">.col-xs-6 .col-sm-3</div>

<!-- Add the extra clearfix for only the required viewport -->
<div class="clearfix visible-xs-block"></div>

<div class="col-xs-6 col-sm-3">.col-xs-6 .col-sm-3</div>
<div class="col-xs-6 col-sm-3">.col-xs-6 .col-sm-3</div>
</div>

2.字体颜色减淡

<p class="help-block">请上传文件</p>

3.引用样式，左侧线

<blockquote>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
</blockquote>

4.帮助文本

<span id="helpBlock" class="help-block">A block of help text that breaks onto a new line and may extend beyond one line.</span>

5.字体颜色+背景颜色

<p class="alert-success">确认成功</p>
<p class="alert-danger">确认成功</p>
<p class="alert-info">确认成功</p>
<p class="alert-warning">确认成功</p>

<p class="bg-primary">确认成功</p>
<p class="bg-success">确认成功</p>
<p class="bg-info">确认成功</p>
<p class="bg-warning">确认成功</p>
<p class="bg-danger">确认成功</p>

<p class="text-muted">显示样式</p>
<p class="text-primary">显示样式</p>
<p class="text-success">显示样式</p>
<p class="text-info">显示样式</p>
<p class="text-warning">显示样式</p>
<p class="text-danger">显示样式</p>

6.快速浮动

div class="pull-left">...</div>
<div class="pull-right">...</div>

<div class="center-block" style="background-color: red;width: 500px;">adsfadsf</div>

<div class="center-block">...</div>

<ul class="pagination pagination-sm"><li><a href="#">«</a></li><li><a href="#">1</a></li><li><a href="#">2</a></li><li><a href="#">3</a></li><li><a href="#">4</a></li><li><a href="#">5</a></li><li><a href="#">»</a></li></ul>

<ul class="pager"><li class="previous"><a href="#">← Older</a></li><li class="next"><a href="#">Newer →</a></li></ul>