Zblog文章归档的美化修改

很早看到论坛里面关于文章归档的美化方法（做成下拉菜单的显示形式），一直我都没有采用。不是程序代码不好，也不是美化的不好，只是因为觉得这个过程需要做的工作量太大，索性不做了。
今天在发现者博客那里发现了篇采用CSS样式控制的文章归档显示样式的文章，效果良好，之后就采用了。只不过我又进一步做了一点点的改进，使其感觉更加良好。估计发现者兄弟也感觉良好了——只不过他还没发现我是怎么改进的，于是来问我。
下面把我修改的思路简单说一下，需要采用的简单理解一下也就能更简单地操控了。
按照发现者提供的方式修改好目标模板（比如default.html和catalog.html），在“按月查看”文字前增加两个空格，然后找个类似于这个的小图片放到图片文件夹；
在CSS样式单某处增加代码#ulArchives2 li{
margin-left:5px;
background:url("此处填写图片路径") no-repeat 0px 0px;
}
索引重建。
然后你也就感觉良好了。
以上内容转自陈玉广的博客 [ http://www.chenyg.cn/blog ]
----------------------------------------------------------------------------------------
以上的修改中，再添加图片的时候需要修改一下所用模板的css文件，因此在这里我就想是否能够省事，不用修改css文件呢？思路就是把添加图片直接在修改模板的时候一并完成。呵呵，这样就不用修改css文件了。又节省了一道工序哦！！修改方法就是：在需要修改的文件（比如default.html和catalog.html）里，找到下面的代码：
<div class="function" id="divArchives">
<h3><#ZC_MSG028#></h3>
<ul><#CACHE_INCLUDE_ARCHIVES#></ul>
</div>

并替换为：
<div class="function" id="divArchives" onmouseover="document.getElementById('ulArchives').style.display = 'block';document.getElementById('ulArchives2').style.display = 'none';" onmouseout="document.getElementById('ulArchives').style.display = 'none';document.getElementById('ulArchives2').style.display = 'block';">
<h3><#ZC_MSG028#></h3>
<ul style="display: none;" id="ulArchives">
   <#CACHE_INCLUDE_ARCHIVES#>
  </ul>
    <ul id="ulArchives2">
   &nbsp;&nbsp;<img border="0" src="https://www.wu2007.cn/image/icon_file.gif(此处改为你的图片地址)" vspace="-1" style="margin-bottom:-1px">文章归档--按月查看
    </ul>
</div>

这里的红字就是替换原来定义的修改css的地方哦！！