怎樣使用bootstrap制作側邊欄
新建一個html文件，定名為test.html，用于利用bootstrap建造側邊欄。
在test.html頁面引入三個文件，第一個是bootstrap樣式文件bootstrap.min.css，第二個是jquery.min.js，第三個是bootstrap的js文件bootstrap.min.js，這三個文件是必需的，當作功引入這三個文件才能操縱bootstrap里面的屬性來實現側邊欄。
利用bootstrap中的container-fluid類建立一個div容器，將在div里面實現帶二級菜單的側邊欄。
利用bootstrap中的row類把頁面一分為二，左邊的側邊欄占用2各位置，右邊為本家兒窗囗，占用10各位置。為了便利區分，給左邊的側邊欄一個灰色的布景顏色。
在側邊欄內利用ul li來建立菜單列表，利用bootstrap中nav、nav-tabs、nav-stacked類界說ul的樣式，建立四個菜單。
為“系統辦理”建立二級菜單，利用nav-header、collapsed界說a標簽的樣式 ，同時設置a標簽data-toggle="collapse"。二級菜單利用ul li建立，需要注重ul的class必需包含collapse、secondmenu類選擇器。代碼如下：
在瀏覽器運行test.html文件，查看代碼實現的結果。由下面的結果可以看出，當作功利用bootstrap實現側邊欄結果。
- 發表于 2019-08-07 00:17
- 閱讀 ( 1371 )
- 分類：其他類型
admin
0 篇文章
作家榜 ?
-
xiaonan123
189 文章
-
湯依妹兒
97 文章
-
luogf229
46 文章
-
jy02406749
45 文章
-
小凡
34 文章
-
Daisy萌
32 文章
-
我的QQ3117863681
24 文章
-
華志健
23 文章