Class(2017-1)練習1

七、【 navbar 導覽列】區塊

BS:【元件Components】>【巡覽列Navbar】

BS:【CSS】>【表單Forms】

確認項目:

1.CSS:【CSS】>【格線系統Grid system】

2.加入【品牌圖片  .navbar-brand】、【固定至頂端.navbar-fixed-top】、【元件對齊.navbar-left】
、【固定至底端.navbar-fixed-bottom】、【反向顏色.navbar-inverse】

3.【CSS】>【表單Forms】

7-1 導覽列及表單 結構 加入

原始

結構

7-1-1  navbar 導覽列 BS 貼入

BS:【元件Components】>【巡覽列Navbar】

7-1-2  search form 表單 BS貼入修改

BS:【CSS】>【表單Forms】

7-2  導覽列及表單 CSS美化

結果顯示