在自学网页设计路上：[2]如何制作简单导航栏

1、制作导航栏的一般思想是通过无序标签ul来实现的，由li来加入各个栏目，加入超链接，同时可以在其中加入ID标签，方便下步操作。

2、通过外链样式表导入基本的CSS代码，可以实现导航栏初步效果

3、通过padding内补白拉开距离。在这里也可以使用margin做出距离，但是margin有时候在计算中会出现叠加现象。所以个人习惯使用padding

4、然后使用伪类实现两个效果：a、去掉超链接下划线；b、鼠标经过变换颜色。应注意颜色的取值应该接近但有明暗区别。

1、#container{margin:0 auto; width:800px;}

#nav ul{list-style:none;}

#nav ul li{float:left;}

#nav li a{padding:7px 10px;}

#nav li a:link,#nav li a:visited{background-color:#393; text-decoration:none;

color:#FFF;}

#nav li a:hover{background-color:#360;color:#999;}