Bootstrap系列 -- 4. 文字內容強調

賀臣發表於2015-06-19

 

一. 文字強調基本樣式

  .text-muted:提示,使用淺灰色(#999)

  .text-primary:主要,使用藍色(#428bca)

  .text-success:成功,使用淺綠色(#3c763d)

  .text-info:通知資訊,使用淺藍色(#31708f)

  .text-warning:警告,使用黃色(#8a6d3b)

  .text-danger:危險,使用褐色(#a94442)

  這個幾個樣式類主要作用於文字,這裡要注意text-* 這裡的字尾,在Bootstrap中會非常常用,其顏色值基本根據字尾固定了

 

二. 基本使用方式

    <div class="text-muted">.text-muted 效果</div><br />
    <div class="text-primary">.text-primary效果</div><br />
    <div class="text-success">.text-success效果</div><br />
    <div class="text-info">.text-info效果</div><br />
    <div class="text-warning">.text-warning效果</div><br />
    <div class="text-danger">.text-danger效果</div><br />

效果預覽圖如下

 

三. 其他標籤使用

  以上class除了應用div之外,還可以用於其他很多標籤

 

相關文章