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）最後，一個完美的導航條選單就完成了，簡直是太簡單了。