如何利用html制作網(wǎng)頁水平導(dǎo)航菜單?
1、a標簽既可以當(dāng)作鏈接符號來用,本身也是行內(nèi)標簽的一種,直接用a標簽輸入文字,可以直接在橫排顯示。
2、可以做出如圖所示效果,橫排顯示的導(dǎo)航。
3、如果想要對整體的導(dǎo)航進行移動位置,可以對整個的a標簽添加上一個大的盒子div,這樣對整體div的移動就可以了。
4、如圖,對div添加居中,添加個描邊就直接影響到整個a標簽內(nèi)容了。
5、我們還可以使用塊狀標簽div來作為導(dǎo)航的一份子,如果中間有鏈接的時候需要a標簽。
6、默認的塊狀標簽div是豎排排列的,就是會換行。
7、然后我們將div添加float:left;浮動效果就好了。
8、這樣剛才的豎排導(dǎo)航就變成了橫排排列的導(dǎo)航頁了。
9、很多時候我們做導(dǎo)航會用到無序列表ul或者有序列表ol來制作導(dǎo)航,做法和div也是一樣的,如圖建立ul li標簽;將li添加浮動效果。
10、再添加些邊框值,這樣一個導(dǎo)航頁也好了。