Title1

Title2

Title3

3-4 Bootstrap CSS樣式的使用

一、排版

  1. 標題:<h1> ~ <h6> 、.h1 ~ h6
  2. 預設 font-size(字型尺寸): 14px 、line-height(段落行高): 1.428 、.lead 可以加大加粗
  3. 行內文字
    標籤 用途 說明
    <mark> 標記文字 為文字加上淡黃色的底色效果
    <del> 刪除文字 表明此文字區塊已被刪除
    <s> 刪除線效果 指出此文字區塊已經不再和段落有相關聯
    <ins> 插入文字 用來指出被額外加入至文件的文字
    <u> 底線文字 加強重要性
    <small> 較小文字 將調整為父容器的85%大小
    <strong> 加強文字 將字體加粗,用來強調某一片段文字
    <em> 斜體 用斜體來強調某一片段文字
  4. 對齊類別
    .text-left:靠左對齊文字
    .text-center:置中對齊文字
    .text-right:靠右對齊文字
    .text-justify:平均對齊文字 =>僅對英文有效,如果中文要有效,則必須加上 inter-ideograph;
    .text-nowrap:不換行文字
     
  5. 按鈕
    <!-- 標準按鈕 -->
    <button type="button" class="btn btn-default">Default</button>
    
    <!-- 提供額外視覺上的重量和識別一組按鈕中主要的操作項目 -->
    <button type="button" class="btn btn-primary">Primary</button>
    
    <!-- 指出成功或積極的操作 -->
    <button type="button" class="btn btn-success">Success</button>
    
    <!-- 訊息提示方面的操作 -->
    <button type="button" class="btn btn-info">Info</button>
    
    <!-- 指出應謹慎採取此一行動 -->
    <button type="button" class="btn btn-warning">Warning</button>
    
    <!-- 指出危險或潛在負面作用的行動 -->
    <button type="button" class="btn btn-danger">Danger</button>
    
    <!-- 淡化一個按鈕,使它看起來像是一個連結並同時保持按鈕行為 -->
    <button type="button" class="btn btn-link">Link</button>