1、导航条（导航菜单）
刚才回答了一个帖子，怕忘了整理如下：
<html>
<head>
<style type="text/css">
body {
background-color:#ccc;
}
#navigator {
background-color:#00f;height:40px;
}
/*原来有个背景图片，就是一条竖线*/
/*background:url(Images/nav_bar1.jpg) repeat-x;height:40px;*/
#nav {
margin-left:350px;
}
#nav li {
float:left;
line-height:40px;
background-color:#00c;
}
#nav li a {
padding:10px 25px;
color:#fff;
text-decoration:none;
text-transform:capitalize;
}
#nav li a:hover {
color:#f00;
background:#eee url(a1.jpg);/*在这里就可以选择背景图片*/
}
/*没有图片时可以显示颜色#eee，但当初我设成#fff怎么都不显示*/
.nav-deli {
margin:10px 10px;
width:1px;
height:25px;
}
</style>
</head>
<body>
<div id="navigator">
<ul id="nav">
<li><a href="#">Home</a></li>
<li class="nav-deli"></li>
<li><a href="#">About us</a></li>
<li class="nav-deli"></li>
<li><a href="#">Service</a></li>
<li class="nav-deli"></li>
<li><a href="#">Contract</a></li>
</ul>
</div>
</body>
</html>
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
