运用Bootstrap框架时常用的样式

<li role="separator" class="divider"></li> 表示添加一条横线

有反色的导航条 .navbar-inverse

使字体能够自适应大小： .lead

使图片能够自适应大小： .img-responsive

左浮动： .pull-left
右浮动： .pull-right

回到顶部：href="#" target = "_top"

使文本颜色为灰色：.text-muted

字体对齐 http://v3.bootcss.com/css/#type-alignment

 <p class="text-left">Left aligned text.</p>
 <p class="text-center">Center aligned text.</p>
 <p class="text-right">Right aligned text.</p>
 <p class="text-justify">Justified text.</p>
 <p class="text-nowrap">No wrap text.</p>

字体颜色 http://v3.bootcss.com/css/#helper-classes

<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>

注意：字体颜色a标签不能继承父类的中的text-xxx

按钮样式是可以自动生成的：http://blog.koalite.com//bbg//
按钮也有尺寸：可变大可变小 btn-lg btn-md btn-sm btn-xs

可实现某种屏幕尺寸隐藏（可通过媒体查询实现）

hidden-xx : 在某种屏幕下隐藏( display : ‘none’ )
visible-xx-xxx : 在某种屏幕尺寸下显示
visible-md-xx：指的是中等屏幕可见，不是中等屏幕以上不可见
visible-md-block visible-lg-block == hidden-sm hidden-xs

使用boostrap的组件，第一件事要修改id ，id是唯一的。因为该组件可能会被多次使用，所以一定要改id。

<span class="icon-bar"></span>
效果是一条小横线（小小的分界线）

注意可以用媒体对象设置左右结构和上下结构。（案例在组件中）

使用面板时的注意点

• 当面板是左右结构。要先确定哪部分是标题哪个是主体，并使得靠右的面板右浮动。
• 注意版心居中。若观察后发现是有版心的，且属于响应式的，则要嵌套容器.container 或者 .container-fluid（宽度为父元素的100%）
• 要使得左右结构好看，就要为其设置高度，宽度作为其响应式处理
• 注意：如果有标题有内容的可以使用 dt 和 dd 标签