:::

21. 自動增行

  1. .row裡面,一般欄位數加起來應該要12,但若是超過12,BootStrap其實會自動新增一行:
        <div class="container">
            <div class="row">
                <div class="col-sm-4"><a href="#">畢業生流向調查(畢業校友聯絡網)</a></div>
                <div class="col-sm-4"><a href="#">就業/工讀/實習訊息</a></div>
                <div class="col-sm-4"><a href="#">兼任助理勞動權益保障專區</a></div>
                <div class="col-sm-4"><a href="#">校外人士活動報名系統</a></div>
                <div class="col-sm-4"><a href="#">自我評鑑專區</a></div>
                <div class="col-sm-4"><a href="#">徵才訊息</a></div>
                <div class="col-sm-4"><a href="#">個人資料保護宣導</a></div>
                <div class="col-sm-4"><a href="#">校務及財務公開網</a></div>
                <div class="col-sm-4"><a href="#">國內策略聯盟學校</a></div>
            </div>
        </div>
    
  2. 其中為了做成綠色按鈕,我們在連結中加入.btn及字定義的.btn-green

  3. 為了讓按鈕變大一點,我們加入.p-3,內距社為3個空白空間。

  4. 此外,加了.rounded-0讓按鈕從圓角變為直角。

  5. 最後,加上.border-white白色框線,讓按鈕間看起來有點距離,不至於擠成一團。

  6. 詳情:http://bootstrap.hexschool.com/docs/4.0/layout/grid/#%E6%AC%84%E7%9A%84%E5%A4%96%E5%9C%8D


:::

書籍目錄

展開 | 闔起

https%3A%2F%2Fcampus-xoops.tn.edu.tw%2Fmodules%2Ftad_book3%2Fpage.php%3Ftbdsn%3D968%26tbsn%3D32

計數器

今天: 615615615
昨天: 2027202720272027
總計: 7971656797165679716567971656797165679716567971656