本節(jié)知識點(diǎn)
- 輔助類
- 響應(yīng)式工具
(一) 輔助類
Bootstrap提供了一些細(xì)小的輔組樣式蜂嗽，用于文字顏色和背景色的設(shè)置,顯示關(guān)閉圖標(biāo)等等井辆。
(1) 情景文本顏色
<p class="text-info">學(xué)習(xí)Bootstrap</p>
<p class="text-danger">學(xué)習(xí)Bootstrap</p>
<p class="text-warning">學(xué)習(xí)Bootstrap</p>
<p class="text-success">學(xué)習(xí)Bootstrap</p>
<p class="text-promary">學(xué)習(xí)Bootstrap</p>
<p class="text-muted">學(xué)習(xí)Bootstrap</p>
(2) 背景色也一樣
<p class="bg-info">學(xué)習(xí)Bootstrap</p>
<p class="bg-danger">學(xué)習(xí)Bootstrap</p>
<p class="bg-warning">學(xué)習(xí)Bootstrap</p>
<p class="bg-success">學(xué)習(xí)Bootstrap</p>
<p class="bg-promary">學(xué)習(xí)Bootstrap</p>
(3)關(guān)閉按鈕 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可以放在需要清理浮動區(qū)塊的前面即可
<div class="clearfix"></div>
(7) 顯示和隱藏
<div class="show"></div>
<div class="hidden"></div>
(8) 響應(yīng)式工具 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>
