div二级导航有利与SEO的二级导航通用适用于橙色风格

杂菜 · 发表于 2012-6-13 10:52:08

本帖最后由杂菜于 2012-6-20 13:57 编辑

演示地址：http://www.feihuabbs.com/

演示图片：

代码：

<!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=utf-8" />
<title>无标题文档</title>
<style type="text/css">
#nav_2 {margin-left:-1px; border-bottom: 1px solid #cdcdcd; border-left: 1px solid #e2d1b8; border-right: 1px solid #e2d1b8; border-top: none; padding:3px 10px; overflow:hidden; zoom:1; width:938px;}
#nav_2 ul { float:left; padding-left:52px; border-right:1px solid #e3e3e2; font-size:14px; height:55px; margin-top:0px; color:#616161; line-height:30px;}
#nav_2 ul li { float:left; white-space:nowrap;display:block; padding-right:3px}
#nav_2 ul li.common { margin-right:12px;_margin-right:5px;}
#nav_2 ul li a{ color:#616161; padding:2px;}
#nav_2 ul li a:hover { color:#FF6C00; background:#fefbec; border:1px solid #febf90; padding:1px;text-decoration:none;}
#nav_2 ul.civilian{ background:url(<A href="http://www.feihuabbs.com/static/image/diy/dh1.gif">http://www.feihuabbs.com/static/image/diy/dh1.gif</A>) no-repeat 5px center;width:280px; }
#nav_2 ul.consumption { background:url(<A href="http://www.feihuabbs.com/static/image/diy/dh2.gif">http://www.feihuabbs.com/static/image/diy/dh2.gif</A>) no-repeat 5px center; width:280px;}
#nav_2 ul.mode { background:url(<A href="http://www.feihuabbs.com/static/image/diy/dh3.gif">http://www.feihuabbs.com/static/image/diy/dh3.gif</A>) no-repeat 5px center; width:220px; border-right:none;}
#nav_2 ul.life { width:0px; background:url(<A href="http://www.feihuabbs.com/static/image/diy/dh4.gif">http://www.feihuabbs.com/static/image/diy/dh4.gif</A>) no-repeat 5px center; border-right:none;}
#nav_2 ul.life li{display:block; }
#nav_2 ul.mode li img.new_icon{display:block; }
</style>
</head>
<body>
<div id="nav_2">
<ul class="civilian">
<li><a href="http://www.feihuabbs.com/forum-2-1.html">新人报道</a></li>
<li><a href="http://www.feihuabbs.com/forum-38-1.html">会员秀场</a></li>
<li><a href="http://www.feihuabbs.com/music.php">音乐电台</a></li>
<li><a href="http://www.feihuabbs.com/forum-65-1.html" style="color: red">影视电影</a></li>
<li><a href="http://www.feihuabbs.com/forum-36-1.html">每日签到</a></li>
<li><a href="http://www.feihuabbs.com/forum-62-1.html">交友征婚</a></li>
<li><a href="http://www.feihuabbs.com/forum-63-1.html">网友活动</a></li>
<li><a href="http://www.feihuabbs.com/forum-66-1.html" style="color: #FF00FF">动漫社区</a></li>
</ul>
<ul class="consumption">
<li><a href="http://www.feihuabbs.com/forum-39-1.html">生活随拍</a></li>
<li><a href="http://www.feihuabbs.com/forum-50-1.html">菲华话题</a></li>
<li><a href="http://www.feihuabbs.com/forum-52-1.html">留学生涯</a></li>
<li><a href="http://www.feihuabbs.com/forum-51-1.html">有啥说啥</a></li>
<li><a href="http://www.feihuabbs.com/forum-47-1.html">同乡聚会</a></li>
<li><a href="http://www.feihuabbs.com/forum-48-1.html">车友聚会</a></li>
<li><a href="http://www.feihuabbs.com/forum-45-1.html">食客天地</a></li>
<li><a href="http://www.feihuabbs.com/forum-55-1.html">求职招聘</a></li>
</ul>
<ul class="mode">
<li><a href="http://www.feihuabbs.com/forum-43-1.html" style="color: blue">二手市场</a></li>
<li><a href="http://www.feihuabbs.com/forum-67-1.html">商家联盟</a></li>
<li><a href="http://www.feihuabbs.com/forum-46-1.html" style="color: #FF00FF">旅游景点</a></li>
<li><a href="http://www.feihuabbs.com/forum-44-1.html" style="color: green">房屋租售</a></li>
<li><a href="http://www.feihuabbs.com/vip.php" style="color: blue">VIP会员</a></li>
<li><a href="http://www.feihuabbs.com/plugin.php?id=sy_wheel:sy_wheel" style="color: red">有奖转盘</a></li><li><img class=new_icon src="http://www.feihuabbs.com/static/image/diy/n.gif"></li>
</ul>
</div>
</body>
</html>

复制代码

安装使用：

后台：运营---站点广告--- 全局页头二级导航栏广告把代码放在里面更新缓存---看效果

安装方便简单，大家试试！

杂菜 · 发表于 2012-6-13 10:53:19

占位置

杂菜 · 发表于 2012-6-13 11:56:51

御风剑发表于 2012-6-13 10:59
图片是怎么进去的？

？？？说清楚？

lingf.in · 发表于 2012-6-13 12:47:58

有木有分呢

44626242 · 发表于 2012-6-13 13:43:54

挺好看的，支持下

mels · 发表于 2012-6-14 01:39:24

免費的!來支持下

mels · 发表于 2012-6-14 01:39:48

希望能夠還有別的顏色

mels · 发表于 2012-6-14 01:40:44

只適用於utf8!

		自动登录	找回密码
密码			立即注册

[发布] div二级导航有利与SEO的二级导航通用适用于橙色风格

本帖子中包含更多资源

回帖奖励 +1 枚金币

回帖奖励 +1 枚金币