立即注册 找回密码

QQ登录

只需一步,快速开始

查看: 4812|回复: 0

[美化修改教程] 分享几个经典的discuz二级导航代码

[复制链接]

114

主题

10

回帖

1564

积分

超级版主

Rank: 8Rank: 8

积分
1564

最佳新人活跃会员热心会员推广达人宣传达人突出贡献优秀版主荣誉管理论坛元老

发表于 2017-10-26 12:11:31 | 显示全部楼层 |阅读模式
道勤网-数据www.daoqin.net

亲注册登录道勤网-可以查看更多帖子内容哦!(包涵精彩图片、文字详情等)请您及时注册登录-www.daoqin.net

您需要 登录 才可以下载或查看,没有账号?立即注册

x
本帖最后由 大师兄 于 2017-10-26 13:03 编辑

今天给大家分享几个discuz二级导航代码,直接看效果吧:
1、discuz官网样式

分享几个经典的discuz二级导航代码

分享几个经典的discuz二级导航代码

代码如下:

  1. <div id="dzf" class="cl" style="text-align:left;">
  2. <style type="text/css">
  3. .pg_index #pt .y { height: 28px; overflow: hidden; }
  4. .mlt li .cl { height: 18px; overflow: hidden; }
  5. .mlt li .c { height: auto!important; }
  6. #pp {zoom:1;}
  7. #dzf{margin-bottom: -1px;padding:10px 0;border: solid #CDCDCD;border-width: 0 0 1px;background: #F5F7F9;line-height:160%}
  8. #dzf p{width:33%;text-indent:70px;background:url(http://att.discuz.net/data/attachment/album/201005/14/0953351hcnq10n6w4zqnwh.png) no-repeat 10px 2px}
  9. .dzfbl{border-left:1px solid #FFF}
  10. .dzfbr{border-right:1px solid #DDD}
  11. #dzf em{display:block;color:#D3DFDF}
  12. #dzf .xg2{color:#666}
  13. #dzf em a{color:#369}
  14. #scbar td { padding: 0 !important; }
  15. </style>
  16. <p class="z dzfbr" style="background: url(http://www.qiankoo.com/piclink/win_x48x55.png) no-repeat 15px 6px;">
  17. <a href="http://www.qiankoo.com/forum-66-1.html" class="xw1" target="_blank">电脑教程</a>
  18. <em class="xg2">最通俗的语言、最简单的方法!</em>
  19. <em><a href="http://www.qiankoo.com/thread-210-1-1.html" target="_blank">win7系统安装</a> | <a href="http://www.qiankoo.com/thread-15-1-1.html" target="_blank">如何用U盘装win7系统</a></em>
  20. </p>
  21. <p class="z dzfbr dzfbl" style="background: url(http://www.qiankoo.com/piclink/win8_x48x55.png) no-repeat 15px 6px">
  22. <a href="http://www.qiankoo.com/forum-55-1.html" target="_blank" class="xw1">软件|系统下载</a>
  23. <em class="xg2">最新win7系统下载、纯净版系统下载</em>
  24. <em><a href="http://www.qiankoo.com/forum-55-1.html" target="_blank">软件/工具</a> | <a href="http://www.qiankoo.com/forum-53-1.html" target="_blank"><b>壁纸|主题下载</b></a> | <a href="http://www.qiankoo.com/thread-70-1-1.html" target="_blank">系统优化</a></em>
  25. </p>
  26. <p class="z dzfbl" style="text-indent:15px;background: none"">
  27. <em><a href="http://www.qiankoo.com/thread-785-1-1.html" target="_blank">【发帖须知】新手必看!</a> | <a href="http://www.qiankoo.com/forum-52-1.html" style="color:red;" target="_blank">电脑问题求助</a>
  28. <em><a href="http://www.qiankoo.com/thread-180-1-1.html"style="color:red; "target="_blank"> ☆教你快速挣酷币,从此不用再灌水☆</a> - <a href="http://www.qiankoo.com/thread-202-1-1.html" target="_blank">>>诚招版主<<</a></em>
  29. <em><a href="http://www.qiankoo.com/thread-216-1-1.html" target="_blank">&#9992;官方QQ群</a></em>
  30. </p>
  31. </div>
复制代码
2、19楼模版

分享几个经典的discuz二级导航代码

分享几个经典的discuz二级导航代码


代码如下:
  1. <style type="text/css">
  2. #nav{ width:958px; height:66px; margin:0 auto; padding:0;}
  3. .nav_floor{ width:956px; height:66px; margin:0 auto; padding:0;}
  4. #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;}
  5. .nav_box { padding:0 0px 0 3px; overflow:hidden;}
  6. .nav_box li { float:left; padding:0 2px 0 2px; margin-right:0px; width:115px; height:21px;line-height:21px; background-position:right 0px; list-style:none;}
  7. .nav_box li a { display:block; padding-left:0px; width:115px; height:21px; background-position:7px 0px; overflow:hidden; color:#333333; text-decoration:none;}
  8. .nav_box li a span { font-family:Verdana,Arial; font-size:12px; font-weight:700;}
  9. #nav .nav_box li a:hover{ background-color:#cc0000; color:#fff; background-position:7px -86px; text-decoration:none;}
  10. </style>
  11. <DIV id=nav>
  12. <DIV class=nav_floor>
  13. <UL class=nav_box>
  14. <li><a href=" " title="新生报到"><span>01#:</span>新生报到</a></li>
  15. <li><a href=" " title="科大答疑"><span>02#:</span>科大答疑</a></li>
  16. <li><a href=" " title="科大咨询"><span>03#:</span>科大咨询</a></li>
  17. <li><a href=" " title="聊天灌水"><span>04#:</span>聊天灌水</a></li>
  18. <li><a href=" " title="情感故事"><span>05#:</span>情感故事</a></li>
  19. <li><a href=" " title="科大交友"><span>06#:</span>科大交友</a></li>
  20. <li><a href=" " title="励志成才"><span>07#:</span>励志成才</a></li>
  21. <li><a href=" " title="试卷资料"><span>08#:</span>试卷资料</a></li>
  22. <li><a href=" " title="科大考研"><span>09#:</span>科大考研</a></li>
  23. <li><a href=" " title="爱好文学"><span>10#:</span>爱好文学</a></li>
  24. <li><a href=" " title="英语一角"><span>11#:</span>英语一角</a></li>
  25. <li><a href=" " title="培训考证"><span>12#:</span>培训考证</a></li>
  26. <li><a href=" " title="科大祝福"><span>13#:</span>科大祝福</a></li>
  27. <li><a href=" " title="宿舍天地"><span>14#:</span>宿舍天地</a></li>
  28. <li><a href=" " title="时尚生活"><span>15#:</span>时尚生活</a></li>
  29. <li><a href=" " title="游戏动漫"><span>16#:</span>游戏动漫</a></li>
  30. <li><a href=" " title="影音视听"><span>17#:</span>影音视听</a></li>
  31. <li><a href=" " title="体育天下"><span>18#:</span>体育天下</a></li>
  32. <li><a href=" " title="电脑数码"><span>19#:</span>电脑数码</a></li>
  33. <li><a href=" " title="我爱摄影"><span>20#:</span>我爱摄影</a></li>
  34. <li><a href=" " title="就业指导"><span>21#:</span>就业指导</a></li>
  35. <li><a href=" " title="求职招聘"><span>22#:</span>求职招聘</a></li>
  36. <li><a href=" " title="家教中心"><span>23#:</span>家教中心</a></li>
  37. <li><a href=" " title="二手交易"><span>24#:</span>二手交易</a></li>
  38. </UL>
  39. </DIV>
  40. </DIV>
复制代码

3、绿色模版

分享几个经典的discuz二级导航代码

分享几个经典的discuz二级导航代码

  1. <style>
  2. .archy_twoad { width:958px; border:1px solid #dfdfdf; border-top-width:0; height:50px; padding-top:6px; overflow:hidden; }
  3. .archy_twoadc { padding-left:5px; }
  4. .archy_twoadc li { display:inline; }
  5. .archy_twoadc a { display:inline-block; padding:0 5px; text-decoration: none; font-size: 12px;}
  6. .ie_all .archy_twoadc a { padding:0 4px; }
  7. .archy_twoadc a:hover { font-size:12px; text-decoration:underline; }
  8. </style>
  9. <div class="archy_twoad">
  10. <table cellspacing="0" cellpadding="0" border="0" align="center">
  11. <tr>
  12. <td align="left" rowspan="2"><a href="#"><img width="35" height="44" border="0" src="static/ */menu_news.gif"></a></td>
  13. <td class="archy_twoadc">
  14. <li><a href="#">综合</a></li>
  15. <li><a href="#">专题</a></li>
  16. <li><a href="#">推荐</a></li>
  17. <li><a href="#">经典线路</a></li>
  18. </td>
  19. <td width="52" align="right" rowspan="2"><a href="#"><img width="35" height="44" border="0" src="static/ */menu_zhuangbei.gif"></a></td>
  20. <td class="archy_twoadc">
  21. <li><a href="#">户外品牌</a></li>
  22. <li><a href="#">装备评测</a></li>
  23. <li><a href=" /">站长论坛</a></li>
  24. </td>
  25. <td width="52" align="right" rowspan="2"><a href="#"><img width="35" height="44" border="0" src="static/ */menu_bbs.gif"></a></td>
  26. <td class="archy_twoadc">
  27. <li><a href="#">滑雪</a></li>
  28. <li><a href="#">自驾游</a></li>
  29. <li><a href=" /">网站建设</a></li>
  30. <li><a href="#">健身</a></li>
  31. <li><a href="#">跑步</a></li></td>
  32. <td width="52" align="right" rowspan="2"><a href="#"><img width="35" height="44" border="0" src="static/ */menu_huodong.gif"></a></td>
  33. <td class="archy_twoadc">
  34. <li><a href="#">郊游</a></li>
  35. <li><a href="#">行业</a></li>
  36. <li><a href="#">结伴同行</a></li>
  37. <li><a href="#"><font color="red">趣味</font></a></li></td>
  38. </tr>
  39. <tr>
  40. <td valign="middle" class="archy_twoadc">
  41. <li><a href="#">城市</a></li>
  42. <li><a href="#">旅游</a></li>
  43. <li><a href="#">资料</a></li>
  44. <li><a href=" /forum-45-1.html">discuz教程</a></li>
  45. </td>
  46. <td class="archy_twoadc">
  47. <li><a href="#">装备知识</a></li>
  48. <li><a href="#">户外资料</a></li>
  49. <li><a href=" /forum-44-1.html">Discuz模板</a></li>
  50. </td>
  51. <td class="archy_twoadc">
  52. <li><a href="#">登山</a></li>
  53. <li><a href="#">自行车</a></li>
  54. <li><a href="#"><font color="red">猫途微博</font></a></li>
  55. <li><a href="#">贴图</a></li>
  56. <li><a href="#">灌水</a></li>
  57. </td>
  58. <td class="archy_twoadc">
  59. <li><a href="#">聚会</a></li>
  60. <li><a href="#">热门</a></li>
  61. <li><a href="#">旅游常识</a></li>
  62. <li><a href="#">拓展</a></li>
  63. </td>
  64. </tr>
  65. </table>
  66. </div>
复制代码

注:以上二级代码都是可以自己任意修改的,大家可以发挥自己的html技术,打造出自己独有的二级导航











道勤主机提供365天*24小时全年全天无休、实时在线、零等待的售后技术支持。竭力为您免费处理您在使用道勤主机过程中所遇到的一切问题! 如果您是道勤主机用户,那么您可以通过QQ【792472177】、售后QQ【59133755】、旺旺【诠释意念】、微信:q792472177免费电话、后台提交工单这些方式联系道勤主机客服! 如果您不是我们的客户也没问题,点击页面最右边的企业QQ在线咨询图标联系我们并购买后,我们为您免费进行无缝搬家服务,让您享受网站零访问延迟的迁移到道勤主机的服务!
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关闭

道勤网- 推荐内容!上一条 /2 下一条

!jz_fbzt! !jz_sgzt! !jz_xgzt! 快速回复 !jz_fhlb! !jz_lxwm! !jz_gfqqq!

关于我们|手机版|小黑屋|地图|【道勤网】-www.daoqin.net 软件视频自学教程|免费教程|自学电脑|3D教程|平面教程|影视动画教程|办公教程|机械设计教程|网站设计教程【道勤网】 ( 皖ICP备15000319号-1 )

GMT+8, 2024-11-13 09:39

Powered by DaoQin! X3.4 © 2016-2063 Dao Qin & 道勤科技

快速回复 返回顶部 返回列表