利用html創建響應式佈局頁面
工具/原料
bootstrap.min.css
bootstrap.min.js
jquery-1.11.1.min.js
方法/步驟
用Dreamweaver新建一個html頁面。引用資料中的三個文件。添加一個meta標籤 這樣可以讓導航條隨著屏幕大小進行伸縮
在body部分，寫一個
在nav裡面在加一個
下面再套兩個div
在class="navbar-header"的div裡面加一個button，作為屏幕縮小時點擊展開導航的按鈕。
在class為collapse navbar-collapse的div裡面嵌套一個ul，ul裡面套li標籤作為導航條
至此一個響應式佈局的導航條完成，在全屏下的效果如下圖
隨著屏幕縮小。導航條變化。點擊右上角的按鈕，會彈出導航條
注意事項
button的data-target="demo-navbar"必須和第二個div的ID相一致
nav的 navbar-fixed-top屬性是將該元素固定在頂部；navbar-inverse屬性是設定元素的背景色為黑色