Song's profileMSN Space技巧归总BlogLists Tools Help

Blog


    July 23

    一周年献礼:美化标题行

    从没想到这个小小的空间会受到大家如此的喜爱,一年以来,没有以任何的方法做过宣传,300多万的浏览量,都是来自于喜爱这里的朋友做连接,介绍来一个又一个的朋友。。看到那么多朋友从这里开始学习,做出那么多漂亮的SPACE,那么多声真挚的感谢和祝福,这已经是它给我最大的礼物了。我个人比较低调,没有太多的话语,只有尽己所能给大家提供能多的帮助。建立论坛的初衷也是如此,毕竟我一人精力有限,现在在论坛上,斑竹们和热心的网友们已基本能帮助每一个遇到困难的朋友解决问题。前些天在GOOGLE搜索了一下“msn space 技巧归总”,搜到了近10万个网页,我看到大多数是各个博客,网摘,书签,论坛 转载这里的教程,大多数都标明了出处,让我感觉很欣慰。这个SPACE建成到现在刚好一年了,好象是第一次在这里写一些比较私人的话,但是有些话早就想和大家说,希望它来的不是太晚。感谢所有朋友的支持,下面一个美化的教程呈上。


    美 化 标 题 行

    标题行是一个网站或者页面的导航栏,一般放在页面最上面,可以说是门面了,所以美化标题行所起到的效果是很重要的。如果用自定义HTML模块把它放在SPACE上面,会给空间增色不少。
    用<table>来做美化是最方便也是最有效的办法,尽管要达到美化的效果要比较复杂,比如要应用CSS,但是用一些简单的方法,也能达到想要的效果。
    比如

    MSN SPACE交流论坛
    让SPACE社区化

    这样是比较简单的用层次的颜色美化的方法,从代码可以看出来:
    <table width="数值" height="数值" cellSpacing=0 cellPadding=0 border="0">
    <tr>
    <td bgcolor="#00FF66">文字</td>
    </tr>
    <tr>
    <td bgcolor="#33CCCC">文字</td>
    </tr>
    <tr>
    <td bgcolor="#CC6666">文字</td>
    </tr>
    <tr>
    <td bgcolor="#FFCC33">文字</td>
    </tr>
    </table>

    颜色的搭配往往显得很重要,具体的颜色代码请看这里

    还有一种视觉效果比较好而且在大多网站常用的标题行美化方法,例如:

     

    blog | 我的留言本 | 我的相册 | 我的QQ | 我的MSN

    blog | 我的留言本 | 我的相册 | 我的QQ | 我的MSN

    blog | 我的留言本 | 我的相册 | 我的QQ | 我的MSN

    blog | 我的留言本 | 我的相册 | 我的QQ | 我的MSN

    这样的方法是用图片做背景实现的,用来做背景的图片其实只是一条很细的线形渐变的竖线,用这个竖线无限循环,就做成了线形渐变的整体效果,就和无数个点组成一条直线的道理一样。不得不说这样的方法很聪明,因为它既简单,背景图片很小,这样打开速度很快,达到的效果也很好。唯一的问题就是需要类似的素材,这样的素材用作图软件做出来其实很简单,但是毕竟不是所有人都会做,但是象我上面所说的,很多网站都用这样的方法进行标题行美化,所以我们都可以把它们拿来借用。

    如何取到这样的素材,由于教程图片稍大,请点击下面的地址进入论坛的帖子查看(需要注册):

    http://www.spacemsn.net/bbs/viewthread.php?tid=5688&extra=page%3D1

    代码如下:
    <table cellSpacing=0 cellPadding=0 width="100%" border="0">
    <tr>
    <td background=http://www.spacemsn.net/msn/nav/nav17.gif height="37"> 标题文字 </td>
    </tr>
    </table>

    说明一下,在兰色位置加入背景图片地址,红色处是背景图片的高度,不是所有素材的高度都是一样的,所以要根据具体的情况设置高度,当然也可以根据自己的需要随意设置,只要达到比较好的效果即可。在“标题文字”处设置标题,可以在编辑模式下改变颜色,字体,和连接。

    另外我收集的20个类似素材可以在下面的地址进入论坛下载:

    http://www.spacemsn.net/bbs/viewthread.php?tid=5688&extra=page%3D1

     

     

    |词嘲  墨尽|

    原创作品