菜鸟学写站，先免费送个二级导航

绅士1 · 发表于 2014-2-9 02:11:16

效果图：

css代码：

<style type="text/css">
.lzzq_xl_nav {
background: none repeat scroll 0 0 #FFFFFF;
border: 1px solid #CCCCCC;
border-radius: 0;
box-shadow: 1px 1px 3px #BEBEBE;
font-size: 14px;
margin: 0 auto 10px;
overflow: hidden;
padding-bottom: 5px;
padding-top: 5px;
width: 960px;
}
.lzzq_xl_nav .lzzq_col_4 {
float: left;
width: 240px;
}
.lzzq_xl_nav .lzzq_col_3 {
float: left;
width: 240px;
}
.lzzq_icon_wp {
float: left;
text-align: center;
width: 240px;
}
.lzzq_col_4 item_04{float: left; width:240px;}
.lzzq_a{float:left;width:47px; margin-left:15px;}
.lzzq_aa{float:left;width:156px;}
.lzzq_clear{clear:both;}
.lzzq_subul {
float: left;
padding-bottom: 0;
padding-top: 0;
width: 155px;
margin-left:10px;
padding-left:10px;
}
.lzzq_col_3 .lzzq_subul li {
float: left;
height: 25px;
line-height: 25px;
text-align: center;
width: 77px;
}
.lzzq_col_4 .lzzq_subul li {
float: left;
height: 25px;
line-height: 25px;
text-align: center;
width: 77px;
}
.lzzq_subul li a {
color: #666666;
}
.lzzq_subul li a:hover {
color: #CC0000;
}
.lzzq_subul li a {
//display: inline-block;
//height: 25px;
margin: 0 auto;
//width: 77px;
}
.lzzq_subul li a:hover {
background: none repeat scroll 0 0 #336699;
color: #FFFFFF;
text-decoration: none;
float:left;
}
.lzzq_col_4 item_01 a{
float:left;
}
ima{
margin-left:10px;
}
.lzzq_subul li{
list-style-type:none;
}
</style>

复制代码

HTML代码：

<body onLoad="MM_preloadImages('http://www.lz-zq.com//source/plugin/zyimage/ico_yl2.png','http://www.lz-zq.com//source/plugin/zyimage/ico_ie2.png','http://www.lz-zq.com//source/plugin/zyimage/ico_lt2.png','http://www.lz-zq.com//source/plugin/zyimage/ico_marker2.png')">
<div class="lzzq_xl_nav cl">
<div class="lzzq_col_4 lzzq_item_01">
<div class="lzzq_a"><a onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image4','','http://www.lz-zq.com//source/plugin/zyimage/ico_yl2.png',1)"><img src="http://www.lz-zq.com//source/plugin/zyimage/ico_yl.png" name="Image4" width="56" height="56" border="0"></a><a onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image5','','http://www.lz-zq.com//source/plugin/zyimage/ico_ie2.png',1)"></a></div>
<div class="lzzq_aa">
<ul class="lzzq_subul">
<li><a target="_blank" >标志欣赏</a></li>
<li><a target="_blank" >字体欣赏</a></li>
<li><a target="_blank" >VI S欣赏</a></li>
<li><a target="_blank" >其他欣赏</a></li>
</ul>
</div>
<div class="lzzq_clear"></div>
</div>
<div class="lzzq_col_4 item_02"><div class="lzzq_a">
<a onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image5','','http://www.lz-zq.com//source/plugin/zyimage/ico_ie2.png',1)"><img src="http://www.lz-zq.com//source/plugin/zyimage/ico_ie.png" name="Image5" width="56" height="56" border="0"></a><a onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image5','','http://www.lz-zq.com//source/plugin/zyimage/ico_ie2.png',1)"></a></div>
<div class="lzzq_aa">
<ul class="lzzq_subul">
<li><a target="_blank" >网络技术</a></li>
<li><a target="_blank" >程序发布</a></li>
<li><a target="_blank" >程序教程</a></li>
<li><a target="_blank" >网站源码</a></li>
</ul></div>
</div>
<div class="lzzq_col_4 item_03">
<div class="lzzq_a"><a onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image6','','http://www.lz-zq.com//source/plugin/zyimage/ico_lt2.png',1)"><img src="http://www.lz-zq.com//source/plugin/zyimage/ico_lt.png" name="Image6" width="56" height="56" border="0"></a><a onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image6','','http://www.lz-zq.com//source/plugin/zyimage/ico_lt2.png',1)"></a></div>
<div class="lzzq_aa">
<ul class="lzzq_subul">
<li><a target="_blank" >聊天灌水</a></li>
<li><a target="_blank" >问题求助</a></li>
<li><a target="_blank" >娱乐休息</a></li>
<li><a target="_blank" >设计竞赛</a></li>
</ul></div>
</div>
<div class="lzzq_col_4 lzzq_item_04">
<div class="lzzq_a"><a onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image7','','http://www.lz-zq.com//source/plugin/zyimage/ico_marker2.png',1)"><img src="http://www.lz-zq.com//source/plugin/zyimage/ico_marker.png" name="Image7" width="56" height="56" border="0"></a><a onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image7','','http://www.lz-zq.com//source/plugin/zyimage/ico_marker2.png',1)"></a></div>
<div class="lzzq_aa">
<ul class="lzzq_subul">
<li><a target="_blank" >领主登陆</a></li>
<li><a target="_blank" >注册论坛</a></li>
<li><a target="_blank" >友情链接</a></li>
<li><a target="_blank" >加入Q群</a></li>
</ul></div>
</div>
</div>

复制代码

使用方法：
1、可直接新建一个.css文件，将css代码复制到里面保存，上传到服务器，然后新建html文件，在html顶部调用刚才的css文件，再复制html文件，回到论坛，在相应的位置添加框架-模块-展示类-静态模块-自定义html，将html文件里面的代码复制到模块数据里面。
或
后台-运营-站点广告-全局页头二级栏广告，将代码复制进去即可。

2、如果不懂css调用代码，可直接拷贝css代码，复制到一个html文件中，然后在下面复制html代码，保存，可以起到同样的代码。

PS：需自己修改链接文字、链接地址、图片地址！

绅士1 · 发表于 2014-2-9 14:47:22

自己顶

守护你的磊 · 发表于 2014-5-17 23:26:12

不错，不过不是想要的，支持吧，没人气啊

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

[发布] 菜鸟学写站，先免费送个二级导航

本帖子中包含更多资源