(4月18日更新)绿色19楼二级导航代码！使用DISCUZX系列！

westboard · 发表于 2010-12-29 17:06:06

本帖最后由 westboard 于 2011-4-18 18:38 编辑

最近突然想起用二级分类，找了半天都没有一个现成的！要么就要改动模板之类！一升级就要重新设置！
现根据别人的修改成绿色的！不受升级影响！第一种：

第二种（最新19楼二级导航风格）：

使用方法：
管理中心——扩展——全局页头二级导航——添加——代码如下：
第一种风格代码：

<style type="text/css">
.nav_forum {position:relative;z-index:3;margin-bottom:-8px;}
.nav_forum .nav_forum_list {padding:0 0 3px 6px; border:1px solid #E3E3E3;border-top:none;background:url(/static/image/common/bg_nav_repeat.gif) repeat-x 0 bottom;}
.nav_forum dl {float:left;position:relative;z-index:1;width:118px;height:23px;border-right:0px solid #EDEDED;}
.nav_forum dt {margin:0 auto;width:118px;height:23px;zoom:1;}
.nav_forum dt a {display:block;padding:1px;height:21px;line-height:19px;font-size:14px;overflow:hidden;}
.nav_forum dt a span {padding:0 6px 0 13px;font-weight:800;color:#324F64;font-size:12px;font-weight:800;font-family:Verdana,Arial;background:url(/static/image/common/bg_navmain.gif) no-repeat 4px -76px;}
.nav_forum dt a:hover {text-decoration:none;padding:0;border:1px solid #BFDAEC;background:url(/static/image/common/bg_navmain.gif) repeat-x 0 -47px;}
.nav_forum .active dt a span, .nav_forum dt a:hover span {background-position:4px -96px;}
.nav_forum .active {z-index:2;}
.nav_forum .active dt {position:absolute;top:-2px;left:1px;height:23px;}
.nav_forum .active dt a, .nav_forum .active dt a:hover {padding:0;line-height:23px;border:1px solid #E3E3E3;border-bottom:none;background:#FFF;}
.nav_forum .active dd {display:block;}
.nav_forum .f_one {padding-top:3px;}
.nav_forum .f_one dt {top:1px;}
</style>
<div class="nav_forum">
<div class="nav_forum_list cl">
<dl class='f_one'><dt><a href="forum.php?mod=forumdisplay&fid=45" title="大城小事">01#:大城小事</a></dt></dl>
<dl class='f_one'><dt><a href="forum.php?mod=forumdisplay&fid=44" title="口水乐园">02#:口水乐园</a></dt></dl>
<dl class='f_one'><dt><a href="forum.php?mod=forumdisplay&fid=40" title="吃喝玩乐">03#:吃喝玩乐</a></dt></dl>
<dl class='f_one'><dt><a href="forum.php?mod=forumdisplay&fid=39" title="极限户外">04#:极限户外</a></dt></dl>
<dl class='f_one'><dt><a href="forum.php?mod=forumdisplay&fid=43" title="爱车一族">05#:爱车一族</a></dt></dl>
<dl class='f_one'><dt><a href="forum.php?mod=forumdisplay&fid=47" title="情感婚姻">06#:情感婚姻</a></dt></dl>
<dl class='f_one'><dt><a href="forum.php?mod=forumdisplay&fid=54" title="无线&3G">07#:无线&3G</a></dt></dl>
<dl class='f_one'><dt><a href="forum.php?mod=forumdisplay&fid=55" title="小说连载">08#:小说连载</a></dt></dl>
<dl class='f_one'><dt><a href="forum.php?mod=forumdisplay&fid=2" title="房屋租售">09#:房屋租售</a></dt></dl>
<dl class='f_one'><dt><a href="forum.php?mod=forumdisplay&fid=37" title="求职招聘">10#:求职招聘</a></dt></dl>
<dl class='f_one'><dt><a href="forum.php?mod=forumdisplay&fid=42" title="征婚交友">11#:征婚交友</a></dt></dl>
<dl class='f_one'><dt><a href="forum.php?mod=forumdisplay&fid=38" title="商情快递">12#:商情快递</a></dt></dl>
<dl class='f_one'><dt><a href="forum.php?mod=forumdisplay&fid=41" title="投诉建议">13#:投诉建议</a></dt></dl>
<dl class='f_one'><dt><a href="forum.php?mod=forumdisplay&fid=49" title="站务管理">14#:站务管理</a></dt></dl>
<dl class='f_one'><dt><a href="/" title="暂时保留">15#:暂时保留</a></dt></dl>
<dl class='f_one'><dt><a href="/" title="暂时保留">16#:暂时保留</a></dt></dl>
</div></div>

复制代码

第二种风格代码（最新19楼二级导航风格）：

<style type="text/css">
#nav .nav_floor {margin-bottom:-8px;padding:5px 0px 6px 0px;font-size:14px;border:1px solid #e8e8e8;border-top:none;background-position:0 -256px;overflow:hidden;background:url(/static/image/common/bg_nav_repeat.gif) repeat-x 0 bottom; }
.nav_box {padding:0 0px 0 3px; overflow:hidden;}
.nav_box li {float:left;padding:0 2px 0 2px;margin-right:0px;width:115px;height:21px;line-height:21px;background-position:right 0px;}
.nav_box li a {display:block;padding-left:0px;width:115px;height:21px;background-position:7px 0px;overflow:hidden;}
.nav_box li a span {font-family:Verdana,Arial;font-size:12px;font-weight:700;}
#nav .nav_box li a:hover {background-color:#697f8f;color:#fff;text-decoration:none;background-position:7px -86px;}
</style>
<DIV id=nav>
<DIV class=nav_floor>
<UL class=nav_box>
<li><a href="forum.php?mod=forumdisplay&fid=2" title="房屋租售">01#:房屋租售</a></li>
<li><a href="forum.php?mod=forumdisplay&fid=37" title="求职招聘">02#:求职招聘</a></li>
<li><a href="forum.php?mod=forumdisplay&fid=42" title="征婚交友">03#:征婚交友</a></li>
<li><a href="forum.php?mod=forumdisplay&fid=38" title="商情快递">04#:商情快递</a></li>
<li><a href="forum.php?mod=forumdisplay&fid=41" title="投诉建议">05#:投诉建议</a></li>
<li><a href="forum.php?mod=forumdisplay&fid=49" title="站务管理">06#:站务管理</a></li>
<li><a href="/" title="暂时保留">07#:暂时保留</a></li>
<li><a href="forum.php?mod=forumdisplay&fid=56" title="回收站">08#:回收站</a></li>
<li><a href="forum.php?mod=forumdisplay&fid=45" title="大城小事">09#:大城小事</a></li>
<li><a href="forum.php?mod=forumdisplay&fid=44" title="口水乐园">10#:口水乐园</a></li>
<li><a href="forum.php?mod=forumdisplay&fid=40" title="吃喝玩乐">11#:吃喝玩乐</a></li>
<li><a href="forum.php?mod=forumdisplay&fid=39" title="极限户外">12#:极限户外</a></li>
<li><a href="forum.php?mod=forumdisplay&fid=43" title="爱车一族">13#:爱车一族</a></li>
<li><a href="forum.php?mod=forumdisplay&fid=47" title="情感婚姻">14#:情感婚姻</a></li>
<li><a href="forum.php?mod=forumdisplay&fid=54" title="无线&3G">15#:无线&3G</a></li>
<li><a href="forum.php?mod=forumdisplay&fid=55" title="职场管理">16#:职场管理</a></li>
</UL></DIV></DIV>

复制代码

westboard · 发表于 2010-12-29 17:06:44

本帖最后由 westboard 于 2010-12-29 17:12 编辑

里面所用到的图片大家自己根据代码中的图片路径自己下载吧！

tonggenhong · 发表于 2010-12-29 17:11:23

提示: 作者被禁止或删除内容自动屏蔽

我是琪琪 · 发表于 2010-12-29 17:13:01

可以把前面的数字去掉么？

westboard · 发表于 2010-12-29 17:13:57

回复我是琪琪的帖子

自己编辑删除就可以了！

我是琪琪 · 发表于 2010-12-29 17:14:54

回复 westboard 的帖子

恩，谢谢

ARCHY` · 发表于 2010-12-29 17:30:38

路过帮顶

大木筏 · 发表于 2010-12-30 00:44:44

先谢啦！！！

wyj840826 · 发表于 2010-12-30 08:58:28

crazy2010 · 发表于 2011-1-9 13:52:23

回复 westboard 的帖子

你好，楼主，
贵站的便民工具能共享一下吗

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

[发布] (4月18日更新)绿色19楼二级导航代码！使用DISCUZX系列！

本帖子中包含更多资源

评分