[Bootstrap] 超簡單 Bootstrap 入門 起手式

Step 1. 至 Bootstrap 官網 複製 Starter template (快速啟動樣版)
說明: 啟動樣版內容非常簡單，除了熟悉的 jquery 與 bootstrap 的 css 與 js 檔案外，還有一個不熟的 popper.min.js，這個是 Bootstrap4 才需要的檔案，如果是 Bootstrap3 可以不用這個檔。

Step 2. 建立容器
有兩種選擇:
1. 自動滿版 <div class="container-fluid"></div>
2. 固定寬度 <div class="container"></div>
說明: container-fluid 會自動調整寬度直到滿版，如果要自己控制容器寬度，請使用 container。

Step 3. 建立欄位 (以三欄式為例)
<div class="row">
  <div class="col"></div>
  <div class="col"></div>
  <div class="col"></div>
</div>
說明: 一定要先包一層有 row 屬性的容器，再用 col 屬性來建立欄位。

Step 4. 設定欄位寬度
三欄等寬並列
<div class="col-4"></div>
<div class="col-4"></div>
<div class="col-4"></div>

三欄滿寬
<div class="col-12"></div>
<div class="col-12"></div>
<div class="col-12"></div>

第一欄滿寬 二、三欄等寬並列
<div class="col-12"></div>
<div class="col-6"></div>
<div class="col-6"></div>

架構好了之後，就可以開始寫網頁了，是不是很簡單呢。

備註：
如果要因應不同裝置顯示不同的欄位配置，請參考以下語法：(滿版是12欄)
預設 .col-佔欄數
手機 (橫) .col-sm-佔欄數
平板 (直) .col-md-佔欄數
平板 (橫) .col-lg-佔欄數
桌機 .col-xl-佔欄數