文本
通过添加文本的颜色与下面的类的意思。 链接会变暗悬停：
| 类 | 描述 | 例 |
|---|---|---|
| .text-muted | 带班风格的文字"text-muted" | 尝试一下 |
| .text-primary | 文字风格与类"text-primary" | 尝试一下 |
| .text-success | 文字带班风格"text-success" | 尝试一下 |
| .text-info | 文字带班风格的"text-info" | 尝试一下 |
| .text-warning | 文字带班风格的"text-warning" | 尝试一下 |
| .text-danger | 文字带班风格"text-danger" | 尝试一下 |
背景
通过添加背景颜色与下面的类的意思。 链接会变暗悬停就像文本类：
| 类 | 描述 | 例 |
|---|---|---|
| .bg-primary | 表格单元格的样式与类"bg-primary" | 尝试一下 |
| .bg-success | 表格单元格的样式与类"bg-success" | 尝试一下 |
| .bg-info | 表格单元格的样式与类"bg-info" | 尝试一下 |
| .bg-warning | 表格单元格的样式与类"bg-warning" | 尝试一下 |
| .bg-danger | 表格单元格的样式与类"bg-danger" | 尝试一下 |
其他
| 类 | 描述 | 例 |
|---|---|---|
| .pull-left | 漂浮元件向左 | 尝试一下 |
| .pull-right | 漂浮元素向右 | 尝试一下 |
| .center-block | 设置元素，以display:block用margin-right:auto和margin-left:auto | 尝试一下 |
| .clearfix | 清除花车 | 尝试一下 |
| .show | 强制要显示的元素 | 尝试一下 |
| .hidden | 强制被隐藏元素 | 尝试一下 |
| .sr-only | 隐藏的元素，除了屏幕阅读器的所有设备 | 尝试一下 |
| .sr-only-focusable | 与.sr只-相结合，再次显示元素时，它的重点是（由仅提供键盘用户EG） | 尝试一下 |
| .text-hide | 有助于背景图像替换元素的文本内容 | 尝试一下 |
| .close | 指示关闭图标 | 尝试一下 |
| .caret | 表示下拉功能（将在dropup菜单自动反转） | 尝试一下 |
响应公用事业
这些类是用来显示和/或隐藏通过媒体查询按设备的内容。
使用一个或可用类切换跨内容的组合viewport断点：
| 类 | 超小型设备手机（<768px） | 小型设备片剂（≥768px） | 中型设备桌面（≥992px） | 大型设备桌面（≥1200px） |
|---|---|---|---|---|
| .visible-xs-* | Visible | Hidden | Hidden | Hidden |
| .visible-sm-* | Hidden | Visible | Hidden | Hidden |
| .visible-md-* | Hidden | Hidden | Visible | Hidden |
| .visible-lg-* | Hidden | Hidden | Hidden | Visible |
| .hidden-xs | Hidden | Visible | Visible | Visible |
| .hidden-sm | Visible | Hidden | Visible | Visible |
| .hidden-md | Visible | Visible | Hidden | Visible |
| .hidden-lg | Visible | Visible | Visible | Hidden |
作为v3.2.0的.visible-*-*类有三种变化，每一个CSS display属性值：
| 班集团 | CSS显示 |
|---|---|
| visible-*-block | display: block; |
| .visible-*-inline | display: inline; |
| .visible-*-inline-block | display: inline-block; |
例如，对于小（ sm ）屏幕，可用的.visible-*-*类是： .visible-sm-block ， .visible-sm-inline和.visible-sm-inline-block 。
这些类.visible-xs ， .visible-sm ， .visible-md和.visible-lg被弃用V3.2.0的 。
例
<h2>Example</h2>
<p>Resize this page to see how the text below
changes:</p>
<h1 class="visible-xs">This text is shown only on an EXTRA
SMALL screen.</h1>
<h1 class="visible-sm">This text is shown only on a
SMALL screen.</h1>
<h1 class="visible-md">This text is shown only on a
MEDIUM screen.</h1>
<h1 class="visible-lg">This text is shown only on a
LARGE screen.</h1>结果：
Example
Resize this page to see how the text below changes:
This text is shown only on an EXTRA SMALL screen.
This text is shown only on a SMALL screen.
This text is shown only on a MEDIUM screen.
This text is shown only on a LARGE screen.
试一试»