闪客帝国导航菜单样式代码-百分百源码网

闪客帝国导航菜单样式代码

发布时间：01/15 来源：浏览：关键词：

代码如下

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>门户类导航</title>
<style type="text/css">
.navGroup{
  width:590px;
  margin:0 auto;
}

.navGroup li{
  float:left;
  text-decoration:none;
  text-align:center;
  margin:0;
  list-style:none;
}

.navGroup li a{
font-size:12px;
display:block;
color:#FFDE00;
text-decoration:none;
text-align:center;
padding:5px 11px 1px 13px;
margin:0;
}

.navGroup li a:hover{
color:#CCFF66;
}

#nav1{
  background-color:#7D7D7D;
  border-top:1px solid #A5A5A5;
}

#nav1 a:hover{
  background-color:#727272;
}

#nav2{
  background-color:#333333;
}

#nav2 a:hover{
  background-color:#393939;
}

.noArrow a{
background-image:none;
}
</style>
</head>

<body>
<ul id="nav1" class="navGroup">
  <li class="noArrow"><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>
  <li><a href="#"><span class="colorYellow">五周年</span></a></li>
  <li><a href="#">交流论坛</a></li>
</ul>

<ul id="nav2" class="navGroup">
  <li class="noArrow"><a href="/user/">会员秀</a></li>
  <li><a href="#"><span class="colorLime">点击书</span></a></li>
  <li><a href="#">Flash MV</a></li>
  <li><a href="#">名人聊</a></li>
  <li><a href="#"><span class="colorYellow">金闪客</span></a></li>
  <li><a href="#">闪客文学</a></li>
  <li><a href="#">教程</a></li>
  <li><a href="#">有问必答</a></li>
  <li><a href="#">闪客院线</a></li>
</ul>

</body>
</html>

打赏