用選擇器區(qū)分：li>a表示僅選擇li標簽下的直接a元素，不會選擇p里面的a；lipa表示li標簽下的p元素下的a元素,不會選擇li下的直屬a元素

1、首先，大家可以直接使用html5中的導航欄標簽<nav></nav>，可以根據實際需要，去除下劃線和顏色等等

2、接下來可以無序列表，去除它的默認樣式設置浮動就可以了

3、設置超鏈接

在這里還想說的是，<ul>的子集元素只能是<li>，不可以是別的，HTML的語義很弱，標簽的使用很重要，在實際的網頁開發(fā)中，不同標簽的語義，權重都不一樣，所以，優(yōu)化也不一樣。

4、可以使用bootstrap，大家可以看一下具體的代碼和詳細的注釋，這樣html的通欄就設置好了。

首先建立一個DIV，為其命名為“nav”，在DIV中建立一個<ul>無序列表，導航共有幾個欄目，就為列表添加幾個<li>的列表項，為每個列表項中的內容加上超鏈接，鏈接到所需的項目頁面。

然后設置CSS樣式，為列表規(guī)定寬度和高度，去掉列表前面的符號，代碼為：

ul {width:寬度值；height：高度值； list-style:none；}

如果是橫向導航，還需為里面的列表項<li>標簽設置左浮動的樣式，代碼為：li {float:left;}

每個欄目之間分隔的距離可通過margin（外邊距）屬性來設置。

html代碼：

<div id="nav">

<ul>

<li>CSS學習</li>

<li>學前準備</li>

<li>入門教程</li>

<li>提高教程</li>

<li>布局教程</li>

<li>精彩應用</li>

</ul>

</div>

css代碼：

#nav ul{

width:960px;

height:35px;

}