双排导航


<meta http-equiv="content-type" content="text/html;charset=gb2312">
<style type="text/css">
<!--
a:link, a:visited { color: #0F0CBF; }
a:hover { color: #F00; text-decoration: underline; }
body { background-color: #FFFFFF; background-position: center; color: #003366; font-family: Arial, "宋体"; font-size: 12px; margin: 0px; padding: 0px; }
img { border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; margin: 0px; padding: 0px; }
li { border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; list-style-image: none; list-style-type: none; margin: 0px; padding: 0px; }
ul { border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; list-style-type: none; margin: 0px; padding: 0px; }
.nav { height: 74px; width: 670px; }
#nav1    .menu, #nav2   .menu { float: left; width: 670px; }
#nav1    .menu_tab, #nav2   .menu_tab { float: left; height: 74px; width: 35px; }
#nav1   .menu   .left { background-image: url(http://www.zzsky.cn/effect/images/200907071130/menu_art_side.gif); background-position: 0px 0px; background-repeat: no-repeat; float: left; height: 74px; width: 5px; }
#nav1   .menu   .middle { background-image: url(http://www.zzsky.cn/effect/images/200907071130/menu_art_bg.gif); background-repeat: repeat-x; float: left; height: 74px; width: 933px; }
#nav1  .menu   .right { background-image: url(http://www.zzsky.cn/effect/images/200907071130/menu_art_side.gif); background-position: -5px 0px; background-repeat: no-repeat; float: right; height: 74px; width: 7px; }
#nav1  .menu  li  a { background-image: url(http://www.zzsky.cn/effect/images/200907071130/menu_art_01.gif); height: 24px; width: 68px; line-height: 24px; background-repeat: no-repeat; float: left; text-align: center; text-decoration: none; color: #003366; background-position: 0px 0px;}
#nav1  .menu  li  a:hover { color: #006699; background-position: 0px -24px; }
#nav1  .menu  li, #nav2  .menu  li { float: left; margin-bottom: 2px; margin-left: 3px; margin-right: 0px; margin-top: 6px; }
#nav1  .menu  ul, #nav2  .menu  ul { margin-bottom: 0px; margin-left: 2px; margin-right: 0px; margin-top: 4px; }
#nav2  .menu  .left { background-image: url(http://www.zzsky.cn/effect/images/200907071130/menu_art_side.gif); background-position: 0px 0px; background-repeat: no-repeat; float: left; height: 74px; width: 5px; }
#nav2  .menu  .middle { background-image: url(http://www.zzsky.cn/effect/images/200907071130/menu_art_bg.gif); background-repeat: repeat-x; float: left; height: 74px; width: 933px; }
#nav2  .menu  .right { background-image: url(http://www.zzsky.cn/effect/images/200907071130/menu_art_side.gif); background-position: -5px 0px; background-repeat: no-repeat; float: right; height: 74px; width: 7px; }
#nav2  .menu  li  a { background-image: url(http://www.zzsky.cn/effect/images/200907071130/menu_art_01.gif); height: 24px; width: 68px; line-height: 24px; background-repeat: no-repeat; float: left; text-align: center; text-decoration: none; color: #666666; background-position: 0px 0px; }
#nav2  .menu  li  a:hover { color: #000000; background-position: 0px -24px; }
-->
</style>
<script type="text/javascript">
function area_nav(index){
for(var i=1;i<=2;i++)
{
        if( document.getElementById("nav"+i.toString()) != null )
        {
                document.getElementById("nav"+i.toString()).style.display = 'none';        
        }
}
        document.getElementById("nav"+index.toString()).style.display = 'block';
}
</script>
</head>
<body>

<div id="nav1" class="nav">
<div class="menu">
  <div class="middle" style="width: 670px; height: 74px">
   <ul>
    <li>
     <a href="#" target="_top"><b style="color:#FF0000">积分充值</b></a>
    </li>
    <li>    
     <a href="#" target="_top">柳州论坛</a>
    </li>
    <li>
     <a href="#" target="_top">柳州社区</a>
    </li>
    <li>
     <a href="#" target="_top">柳州论坛</a>
    </li>
    <li>
     <a href="#" target="_top">交易买卖</a>
    </li>
    <li>
     <a href="#" target="_blank"><b style="color:#FF0000">社区家园</b></a>
    </li>
    <li>
     <a href="#" target="_top">网址大全</a>
    </li>
    <li>
     <a href="#" target="_top">柳州论坛</a>
    </li>
    <li>
     <a href="#" target="_top">勋章中心</a>
    </li>
    <li>
     <a href="#" target="_top">新人报道</a>
    </li>
    <li>
     <a href="#" target="_top">柳州论坛</a>
    </li>
    <li>
     <a href="#" target="_top">好友圈子</a>
    </li>
    <li>
     <a href="#" target="_top"><b style="color:#330099">柳州论坛</b></a>
    </li>
    <li>
     <a href="#" target="_top"><b style="color:#FF0000">VIP会员</b></a>
    </li>
    <li>
     <a href="#" target="_top"><b style="color:#FF0000">柳州论坛</b></a>
    </li>
    <li>
     <a href="" target="_top">广告位置</a>
    </li>
    <li>
     <a href="" target="_top">广告位置</a>
    </li>
    <li>
     <a href="" target="_top">广告位置</a>
    </li>
   </ul>
  </div>
    </div>
</div>




文章来自: 本站原创
引用通告: 查看所有引用 | 我要引用此文章
Tags:
相关日志:
评论: 0 | 引用: 0 | 查看次数: 677
发表评论
昵 称:
密 码: 游客发言不需要密码.
内 容:
验证码: 验证码
选 项:
虽然发表评论不用注册,但是为了保护您的发言权,建议您注册帐号.
字数限制 20 字 | UBB代码 关闭 | [img]标签 关闭