导航增加new或hot图标的方法以及资源下载

yanli2020110 · 发表于 2011-4-5 00:54:08

实现方法：（共二步）
第一步：template/default/common/header.htm（注意红色部分，如果你不是官方默认模板，请修改相应风格目录下的文件）
查找：

<div id="nv">

复制代码
在下面一行加入：

<div id="topmenu"><div class="topmenu1"> <sup></sup></div>
<div class="topmenu2"> <sup></sup></div></div>

复制代码
第二步：打开template/default/common/common.css文件
在最底部加入

/*导航栏浮动小图标*/
#topmenu{position:relative;z-index:5;}
.topmenu1 sup{display:block; width:26px; height:27px; position:absolute;background-image:url(/images/soonew/hot13.gif); background-position:0 0; top:-15px; right:350px; _right:515px; clear:left;z-index:5;}
.topmenu2 sup{display:block; width:28px; height:18px; position:absolute;background-image:url(/images/soonew/New15.gif); background-position:0 0; top:-15px; right:430px; _right:515px; clear:left;z-index:5;}

复制代码
解释：
/images/soonew/hot13.gif图片路径自行修改。
top:-15px; right:430px; 图标的坐标，请自行修改。
z-index:5图片处于的哪一个层，请自行修改（如果你的new和hot小图标被图层挡住，请增加此值100或者1000都可以）
注意：
经过调试，仍然不能做到兼容所有的浏览器。其实许多大站也不能做到100%兼容所有浏览器。IE核心和webKit核心的层表述方式不一。限于本人能力有限，只找到了折中的办法：就是把你的图片位置调整到导航栏上。如本站导航栏

shchint · 发表于 2011-4-5 01:43:37

a502501 · 发表于 2011-4-5 03:23:56

Jeavi_·` · 发表于 2011-4-5 03:42:58

http://www.jeavi.name discuz模板前来支持

qq68055665 · 发表于 2011-4-6 20:08:22

看起来还不错,龙华之窗www.lhnew.com

Simple丨轨迹 · 发表于 2011-5-13 17:05:28

收藏！~~

chinasb · 发表于 2011-5-13 17:10:45

〤〥奕☆★ · 发表于 2011-8-22 08:34:20

先收藏起来深圳交友社区 www.huikang365.com

6545133 · 发表于 2011-10-15 22:58:15

这个很好一定要支持！

牛油果 · 发表于 2011-10-17 11:32:20

好东西先收藏阿里

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

[发布] 导航增加new或hot图标的方法以及资源下载

本帖子中包含更多资源