上一篇文章给大家简单介绍了一下Bootstrap框架以及它的开发环境搭建，这一篇文章给大家讲解一下一些Bootstrap 常用的工具。

排版

Bootstrap 有四种文本对齐的方式：text-left（左对齐），text-center（居中对齐），text-right（右对齐），text-nowrap（禁止自动换行）。

引用功能：<blockquote>

<!--引用-->
<blockquote>参考文献：爱因斯坦《相对论》</blockquote>

突出文字功能：<code>

<!--突出文字-->
<p>复合大师开发建设方<code>发货的数据开发环境</code> 的防护技术符合设计大方回家都会放假都很费劲符合大家是否还记得风华绝代胡椒粉</p>

插入代码块:<pre>

<p>这是一段简单的代码<pre>&lt;blockquote&gt;参考文献：爱因斯坦《相对论》&lt;"/blockquote&gt;</pre></p>

文本情景色

Bootstrap 给开发者一共提供了6种文本的情景色

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

背景颜色

背景颜色和文本颜色差不多只是少了一个柔和色，引入类名.bg-primary（5中不同的颜色选择），这里就不做演示了。

其他的工具类

Bootstrap还给开发者提供了很多的简单的css样式处理的其他样式

左浮动（.pull-left），右浮动（.pull-right），设置元素为display:block病居中显示（.center-block），清除浮动（.clearfix），

强制元素显示（.show），强制元素隐藏（.hidden），显示关闭按钮（.close），显示下拉功能（.caret），文本隐藏（.text-hide）。

这里给大家做一下关闭按钮和显示下拉功能的演示。

<!--显示关闭按钮-->
<button class="close">点击关闭&times;</button>
<!--显示下拉框-->
<div>更多<span class="caret"></span></div>

这里要注意的一点是显示关闭按钮的功能是默认的右浮动的。

好了，基本的工具类就和大家讲完了，其实Bootstrap还有一些不是很常用的工具这边没有给大家例举出来，大家可以通过菜鸟教程详细了解一下。下节预告（Bootstrap的布局组件）。