(五)Bootstrap 辅助组和响应式工具

本节知识点

• 辅助类
• 响应式工具

(一) 辅助类

Bootstrap提供了一些细小的辅组样式，用于文字颜色和背景色的设置,显示关闭图标等等。

(1) 情景文本颜色

    <p class="text-info">学习Bootstrap</p>
    <p class="text-danger">学习Bootstrap</p>
    <p class="text-warning">学习Bootstrap</p>
    <p class="text-success">学习Bootstrap</p>
    <p class="text-promary">学习Bootstrap</p>
    <p class="text-muted">学习Bootstrap</p>

(2) 背景色也一样

    <p class="bg-info">学习Bootstrap</p>
    <p class="bg-danger">学习Bootstrap</p>
    <p class="bg-warning">学习Bootstrap</p>
    <p class="bg-success">学习Bootstrap</p>
    <p class="bg-promary">学习Bootstrap</p>

(3)关闭按钮 close

<button class="close">X</button>

(4) 三角符号 caret

<span class="caret"></span>

(5) 快速浮动

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

(6) 清理浮动
这个div可以放在需要清理浮动区块的前面即可

<div class="clearfix"></div>

(7) 显示和隐藏

 <div class="show"></div>
  <div class="hidden"></div>

(8) 响应式工具 visible ,hidden

    <div class="col-xs-5 visible-xs a">Bootstrap</div>
    <div class="visible-sm-block a">Bootstrap2</div>
    <div class="hidden-md a">Bootstrap3</div>