可能会派上用场的辅助类
文字：
.text-muted 颜色 #777
.text-muted {
color: #777;
}
背景：
不同的类展示了不同的背景颜色。 如果文本是个链接鼠标移动到文本上会变暗： .bg-primary 等
其他：
浮动： .pull-left .pull-right
居中显示： .center-block 设置元素为块元素，并且居中显示
清楚浮动： .clearfix 在bootstrap中通过给父元素container 添加伪类 .clearfix::before{ clear: both} .clearfix::after{clear: both} (!不对的请指出)
.row { //行 bootstrap 把一行分成12份或列
margin-right: -15px;
margin-left: -15px;
}
.col-xs-1 { //在xs尺寸屏占1列 一列 父元素的 8.33333333%;
position: relative;
min-height: 1px;
padding-right: 15px;
padding-left: 15px;
float: left; // 浮动布局 且元素有内边距 注意在父元素上清楚浮动 .clearfix
}
显示下拉功能： .caret
定义一个下拉功能的按钮： （摘自菜鸟教程）
<div class="btn-group">
<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">Menu <span class="caret"></span></button>
<ul class="dropdown-menu" role="menu">
<li><a href="#">一个链接</a></li>
<li><a href="#">另一个链接 link</a></li>
<li><a href="#">其他功能</a></li>
</ul>
</div>
.dropup, .dropdown{position: relative}
.dropdown-toggle:focus { outline: 0;}
.btn-group{ position: relative; display: inline-block; vertical-align: middle;} //相对定位
.btn-group >.btn //相对定位，浮动
{
position: relative;
float: left; }
.dropdown-menu { //绝对定位
position: absolute;
top: 100%;
left: 0;
z-index: 1000;
display: none; //默认隐藏
float: left;
min- 160px;
padding: 5px 0; //padding-top: 5px ; padding-bottom: 5px
margin: 2px 0 0; //margin-top: 2px 上方的距离
font-size: 14px;
text-align: left;
list-style: none;
background-color: #fff;
-webkit-background-clip: padding-box;
background-clip: padding-box;
border: 1px solid #ccc;
border: 1px solid rgba(0, 0, 0, .15);
border-radius: 4px;
webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
}
阅读上显示，其他隐藏： .sr-only
显示隐藏： .show .hidden