<!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>红色vista风格横向导航菜单</title>
<style>
body{margin:0px 0px 0px 0px;/*top,right,bottom,left*/font-size:12px;line-height:20px;font-family:Arial;}
form{margin:0px;padding:0px;}
ul{margin:0px;padding:0px;list-style:none;}
a,a:link,a:visited{color:#fff; text-decoration:none;}
a:hover{color:#fff; text-decoration:underline;}
a:active{color:#fff; text-decoration:none;}
.f_left{float:left;}
.f_right{float:right;}
.w100{width:100%; padding:0px; margin:0px; overflow:hidden;}
.top{width:950px;padding:0px;margin:0px auto;overflow:hidden;}
.top_logo{/*Head Logo*/width:385px;padding:0px;margin:0px;overflow:hidden;}
.top_column{/*Navigation*/width:930px;padding:8px 10px;margin:0px;overflow:hidden;}
.top_column li{text-align:center;display:block;font-size:12px; line-height:19px; font-family:Arial;}
body{background:url(/jscss/demoimg/201309/main_bj.jpg) top center repeat-x #000000;color:#999;}
.box{width:950px;overflow:hidden;margin:0px auto;padding:0px 0px 20px 0px;}
.center_d{width:950px;overflow:hidden;padding:0px;margin:0px auto;margin-bottom:10px;}
.t_r{width:300px;overflow:hidden;padding:14px 25px 20px 0px;margin:0px;color:#fff;}
.t_r1{width:300px;overflow:hidden;padding:0px 0px 6px 0px;margin:0px;text-align:left;}
.t_r1 span a, .t_r1 span a:link, .t_r1 span a:visited{color:#F5DF8C; text-decoration:none; font-size:13px;}
.t_r1 span a:hover{color:#F5DF8C; text-decoration:underline;}
.t_r1 span a:active{color:#fff; text-decoration:none;}
.t_r2{width:300px;overflow:hidden;padding:0px;margin:0px;text-align:left;}
.top_column{background:url(/jscss/demoimg/201309/dh.jpg) left top no-repeat;color:#fff;}
#nav{list-style-type: none; padding:0px; margin:0px;}
#nav a{display: block;text-align:center; font-size:12px;}
#nav a:link{color:#FFF; text-decoration:none;}
#nav a:visited{color:#FFF;text-decoration:none;}
#nav a:hover{color:#FFF;text-decoration:none;}
#nav li{float: left;line-height:19px; background:url(/jscss/demoimg/201309/x.jpg) center right no-repeat;padding:0px 20px 0px 20px; margin:0px;}
#nav li ul{background:#C40002;list-style-type: none;text-align:left;left:-999em;position:absolute;padding:1px;margin:0px;width:150px;}
#nav li ul li{padding:0px;margin:0px;background:none;}
#nav li ul a{display:block;text-align:left;padding-left:2px; border-bottom:#7C0000 1px dashed;line-height:25px;width:140px;padding-left:10px;}
#nav li ul a:link{color:#FFF; text-decoration:none;width:140px;padding-left:10px;}
#nav li ul a:visited{color:#FFF;text-decoration:none;width:140px;padding-left:10px;}
#nav li ul a:hover{color:#FFB401;text-decoration:none;width:140px; background-color:#BF3332;padding-left:10px;}
#nav li:hover ul{left: auto;}
#nav li.sfhover ul{left: auto;}
</style>
</head>
<body>
<div class="box">
<div class="top">
<div class="top_column" style="margin-top:80px;">
<script type=text/javascript>
<!--
function menuFix() {
var sfEls = document.getElementById("nav").getElementsByTagName("li");
for (var i=0; i<sfEls.length; i++) {
sfEls[i]. {
this.className+=(this.className.length>0? " ": "") + "sfhover";
}
sfEls[i].onMouseDown=function() {
this.className+=(this.className.length>0? " ": "") + "sfhover";
}
sfEls[i].onMouseUp=function() {
this.className+=(this.className.length>0? " ": "") + "sfhover";
}
sfEls[i]. {
this.className=this.className.replace(new RegExp("( ?|^)sfhover\\b"), "");
}
}
}
window.onload=menuFix;
//--></script>
<ul id=nav>
<li><a href="/">首页</a></li>
<li><a href="/">关于我们</a>
<ul>
<li><a href="/">公司简介</a></li>
<li><a href="/">公司动态</a></li>
<li><a href="/">公司新闻</a>
<li><a href="/">企业文化</a></li>
</ul>
</li>
<li><a href="/">产品展示</a>
<ul>
<li><a href="/">热销产品</a></li>
<li><a href="/">新品上市</a></li>
<li><a href="/">推荐产品</a></li>
<li><a href="/">促销产品</a></li>
</ul>
</li>
<li><a href="/">行业资讯</a> </li>
<li><a href="/">客服中心</a>
<ul>
<li><a href="/">物流配送</a></li>
<li><a href="/">工程安装</a></li>
</ul>
</li>
<li><a href="/">工程案例</a></li>
<li><a href="/">导航条代码</a></li>
<li><a href="/" rel="nofollow">在线下单</a></li>
<li ><a href="/">联系我们</a></li>
<li style=" background:none;"><a href="/">零度对策</a></li>
</ul>
</div>
</div>
</div>
</body>
</html>
