HTML和css怎樣製作橫排導航條，菜單

很多小夥伴學習了一段時間的HTML和css，就想自己動手試試製作導航條菜單，不過卻沒有思路，今天小編我就來分享一下HTML和css製作導航條的實例，大家可以參考參考。

操作方法

（01）如圖，製作導航條菜單一般是用一個div嵌套ul和li標籤，然後li裏面有a標籤。

（02）佈局做好之後，開始寫導航條的樣式，如圖，先清除導航條的margin和padding。

（03）然後定位導航條的div，這裏我就用絕對定位來居中，如果你有其他導航條居中方法可以忽略這一條。

（04）然後設置導航條的li左浮動，並且去掉li前面的圓點，讓導航條更好看。

（05）然後設置導航條的a標籤轉塊級，以及導航條菜單的寬高，文字顏色，水平垂直居中和背景色以及去掉a標籤的下劃線。

（06）接着設置鼠標經過導航條菜單變色即可。

（07）最後，一個完美的導航條菜單就完成了，簡直是太簡單了。