首先建立一个DIV，为其命名为“nav”，在DIV中建立一个<ul>无序列表，导航共有几个栏目，就为列表添加几个<li>的列表项，为每个列表项中的内容加上超链接，链接到所需的项目页面。
然后设置CSS样式，为列表规定宽度和高度，去掉列表前面的符号，代码为：
ul {width:宽度值；height：高度值； list-style:none；}
如果是横向导航，还需为里面的列表项<li>标签设置左浮动的样式，代码为：li {float:left}
每个栏目之间分隔的距离可通过margin（外边距）属性来设置。
导航条的更多样式及详细步骤可去这里参考http://jingyan.baidu.com/article/da1091fb05fe93027849d600.html
主要分3种方法：1.行内式，就是直接在网页中加入css样式表，在标记的后面加上style属性来设定css样式。
如：
<p style="font-size:12pxcolor:#000">行内式测试</p>
注：读取速度最快，但维护最麻烦
2.嵌入式,在页面的<head>和</head>之间。
如：
<style type="text/css">
p{margin: 0padding: 0color:red}
</style>
注：读取速度居中，但维护也居中
3.连接式
<link href="style.css" rel="stylesheet" type="text/css"/>
注：读取速度不及上面2种，但维护较方便；网页设计师最常用~
用复合选择器来写可能要好一点 其他栏目div:hover 第一个栏目div:nth-child(0){display:none}，第一个栏目一开始要有其他样式的话，你需要给他一个单独的class，再写样式
