如何用Bootstrap制作導航條
2022-02-23
工具/材料
Sublime Text
操作方法
- 01
首先我們需要搭建一個html頁面，如下圖所示，在頁面中導入需要的bootstrap文件
- 02
然后我們在body標簽中寫下nav元素，如下圖所示，注意給nav元素添加導航條樣式
- 03
接下來就給導航添加內(nèi)容，如下圖所示，運用的是ul元素，這里也運用了nav導航樣式
- 04
如果想要激活哪個導航，只需要像下圖的方式，在li元素中添加active樣式即可
- 05
Bootstrap中的導航有下拉效果的設(shè)計，如果想用這種效果，需要用dropdown樣式，如下圖所示
- 06
另外，值得一提的下拉導航條中可以加分割線，如下圖所示，運用pider樣式即可
- 07
最后我們運行頁面程序，你會看到如下圖所示的效果，下拉導航以及激活狀態(tài)都已經(jīng)顯示出來了
詞條內(nèi)容僅供參考，如果您需要解決具體問題
（尤其在法律、醫(yī)學等領(lǐng)域），建議您咨詢相關(guān)領(lǐng)域?qū)I(yè)人士。