HTML，如何製作導航欄？

在用html做一個網頁時，首先需要處理的是導航欄了。怎樣製作一個導航欄？以前的做法基本都是用table來做，現在我們用無序列表ul來做，下面一起來看下。

操作方法

（01）首先我們寫html代碼，就是用 ul，li無序列表來放置我們的選單項，代碼如圖。

（02）執行目前的代碼，可以看到是一個比較醜陋的導航條。

（03）添加樣式，讓導航欄的每一欄橫向排列，而不是豎向排列。要橫向排列，只需要爲li添加樣式：display: inline-block;就行了，然後用padding樣式爲每一項添加一些間距，代碼如圖。

（04）繼續美化導航項，爲連結a添加樣式，主要是添加背景色background-color，和加一些間距padding，代碼如圖

（05）先執行頁面，看下現在的效果。

（06）接着爲當前選單的頁面添加樣式，

（07）再爲鼠標經過選單項時添加hover樣式。代碼如圖，在鼠標經過選單項時，爲選單項添加了投影效果，並改變了字型顏色。

（08）我們的導航選單基本完成了，看下效果，還是不錯的。（如果配色更合理點，就更完美了，這個配色需要有美工功底了：）