css制作简洁的绿色导航菜单，代码非常简单，背景颜色和背景图片换下，即可满足大多数导航菜单需要。
导航菜单所需图片素材：
导航菜单HTML代码：
<div id="nav">
<ul>
<li><a href="http://www.125jz.com/">首页</a></li>
<li><a href="#">网页制作</a></li>
<li><a href="#">网页设计</a></li>
<li><a href="#">网页布局</a></li>
<li><a href="#">网页配色</a></li>
<li><a href="#">建站资源</a></li>
<li><a href="#">联系我们</a></li>
<li><a href="#">我要建站</a></li>
</ul>
</div>
导航菜单CSS代码：
#nav ul{
list-style-type:none;
}
#nav li{
float:left;
}
#nav a:link,#nav a:visited{
width:120px;
height:45px;
line-height:45px;
color:#FFF;
text-decoration:none;
display:block;
text-align:center;
background-image: url(images/nav01.gif);
}
#nav a:hover{
background-image:url(images/nav02.gif);
}
125jz网原创文章。发布者：江山如画，转载请注明出处：http://www.125jz.com/1410.html
微信扫一扫 
支付宝扫一扫