分享

博客个性自定义HTML模块代码大全

 清风&香露 2010-12-30

 您的博客是否拥有您的个性呢?是否想让自己的博客更漂亮、更专业呢?
    看着别人博客中各种漂亮、个性的代码特效,您是否也很想知道怎么实现呢?

    为此本人特提供一些很有代表性的特效代码,希望您能喜欢喔^-^! 如果你有什么需要,也可以留言提出,本人一定会在能力范围内满足的。

    实现方法:请将下面这些代码逐个添加到自定义HTML模块中即可。记得刷新喔!

一、如何实现QQ在线留言图标                                              

 1) 先打开自己的QQ并登陆,然后在“个人设置”右下角,点击“生成在线代码”,然后会近日腾讯网站“QQ网页代码生成”,根据提示生成自己喜欢的代码。

 2)将以上代码放到自定义HTML模块状态栏内即可。

比如我的QQ在线代码:  


 <a target=blank href=http://wpa.qq.com/msgrd?V=1&Uin=188801858&Site=http://chanterlee.&Menu=yes><img border="0" SRC=http://wpa.qq.com/pa?p=1:188801858:6 alt="点击这里给我QQ留言^^">
 
 

二、漂亮的个性鼠标特效代码                                               

 鼠标特效代码为:
① 单鼠标特效代码:


 <style type=TEXT/CSS> BODY {CURSOR:url('http://webme./inc/mouse025.cur');} A {CURSOR:hand} </style>
 


② 双鼠标特效代码:


<style>BODY{cursor:url('http://webme./inc/mouse025.ani');}A{CURSOR: url('http://webme./inc/mouse095.cur');}</style>
 


前者鼠标是主鼠标,浏览页面时起作用;当点击到链接处时后者鼠标起作用。具体效果请参考本日志效果。

 其中的红色部分就是鼠标特效的样式的网址。它是可以任意更换的。例如:想设置“小鸟”或“树叶”样式的鼠标特效,则把红色部分换成下面相应的网址即可。

(1.树叶;2.小鸟)

1.http://www./uploadfile/20041214112739616.cur

2.http://www./background.ani

 更多鼠标特效样式及代码请参考网址:给你的博客添加鼠标

 这个网页里有很多样式的鼠标,大家可以随意挑选,然后按照上面的操作方法就可以设置。

三、个人免费邮箱自动登录系统代码                                         


<BR>
<FORM name=loginmail onsubmit="return chkinput2(this);" action=http://www.hao123.com/sendmail.php method=post target=_blank>邮箱账号: <INPUT class=lanyu tabIndex=1 size=17 name=user> <BR>输入密码: <INPUT class=lanyu tabIndex=3 type=password size=17 value="" name=pass> <BR>选择邮箱: <SELECT class=lanyu tabIndex=2 size=1 name=site> <OPTION value="" selected>请选择信箱</OPTION> <OPTION value=21cn.com>@21cn.com</OPTION> <OPTION value=163.net>@163.net</OPTION> <OPTION value=tom.com>@tom.com</OPTION> <OPTION value=163.com>@163.com</OPTION> <OPTION value=vip.163.com>@vip.163.com</OPTION> <OPTION value=sohu.com>@sohu.com</OPTION> <OPTION value=263.net>@263.net</OPTION> <OPTION value=sina.com>@sina.com</OPTION> <OPTION value=vip.sina.com>@vip.sina.com</OPTION> <OPTION value=mail.china.com>@mail.china.com</OPTION> <OPTION value=china.com>@china.com</OPTION> <OPTION value=netease.com>@netease.com</OPTION> <OPTION value=yeah.net>@yeah.net</OPTION> <OPTION value=etang.com>@etang.com</OPTION> <OPTION value=bliao.net>@bliao.net</OPTION> <OPTION value=cn.yahoo.com>@yahoo.com.cn</OPTION> <OPTION value=xinhuanet.com>@xinhuanet.com</OPTION> <OPTION value=126.com>@126.com</OPTION> <OPTION value=eyou.com>@eyou.com</OPTION> <OPTION value=email.com.cn>@email.com.cn</OPTION> <OPTION value=ynmail.com>@ynmail.com</OPTION> <OPTION value=citiz.net>@citiz.net</OPTION> <OPTION value=elong.com>@elong.com</OPTION></SELECT> <INPUT class=button style="FONT-SIZE: 12px" onclick="setTimeout('clearpass()',1000)" tabIndex=4 type=submit value=----立即登录邮箱----- name=Submit2> </FORM><BR>
 


四、天气预报代码                                                         


<IFRAME style="WIDTH: 183px; HEIGHT: 54px" border=0 marginWidth=0 marginHeight=0 src="http://weather./weather.htm" frameBorder=no width=150 scrolling=no height=54></IFRAME>
 


五、添加多彩文字的代码                                                   
    比如紫色文字" Cherish every minute!”的代码如下:
 

<FONT color=#cc00ff>你的文字内容</FONT>
 


    其中,红色字体为文字颜色代码,更多颜色代码请参考下面日志:

                                 博客颜色代码大全  

 如果文字需要居中,代码为:
 

 <FONT color=#cc00ff><P  align=center>你的文字内容</FONT></P>
 


    如果需要添加文字点击网页链接,代码为:
 

 <FONT color=颜色代码><A  href="需要链接的网站地址" target=_blank>你的文字内容</FONT>
 


 

六、Twins样式的钟表代码                                                  

 


 <EMBED src=http://www./Twins/Twins07.swf width=182 height=182 ></EMBED>
 


注意:1. 数07换成01到08内任何数就得到不同钟表。

   2. 更多的特效flash与时钟:http://kf025./2939377.html

 


七、工整的分隔线代码                                                     

 

--------------------------------------------------------------------------------


 <HR color=green noShade SIZE=1>
 


    效果请参考我的自定义HTML模块中的分隔线喔!其中,红色字体为分隔线的颜色,紫色字体为分隔线粗细,可为1、2、3……。

八、文字中如何嵌入图片或广告的代码                                        

    在文字中如能嵌入图片或文字,那么整个版面将会更好看。嵌入图片效果,见本日志中右边的Twins样式的钟表。嵌入代码为:


<TABLE style="WIDTH: 244px; HEIGHT: 107px" width=244 align=right border=0>
    <TBODY>
        <TR>
            <TD style="FONT-SIZE: 12pt" height=60>
            <DIV style="FONT-SIZE: 12pt" align=center><STRONG></STRONG></DIV>
            </TD>
        </TR>
    </TBODY>
</TABLE>
 


 

 

 

 

 

 

 

 

 

 

九、滚动文字的代码                                                  

 

 <MARQUEE onmouseover=this.stop() onmouseout=this.start() scrollAmount=1 scrollDelay=60 direction=up width=180 height=100><FONT color=red><CENTER>本站公告</CENTER></FONT><BR>
 此处为你自己的公告内容。
 此处为你自己的公告内容。
</MARQUEE>
 


 比如我的门户首页滚动公告代码为:


 <MARQUEE style="WIDTH: 182px; LINE-HEIGHT: 23px; HEIGHT: 130px" scrollAmount=1 scrollDelay=1 direction=up bgColor=#f0f8ff height=130>
<P align=center><FONT color=#cc00ff size=2>*来访即是朋友*</FONT></P>
<P align=left><FONT color=#3366FF size=2>....本人近期工作较忙,以致很少拜访各位 ,还请见谅喔!<BR>....不过日志倒是要更新的,否则被大家认为我“丢”了,就不妙了, 呵呵!<BR>....待我一有空,就会拜访您,谢谢。</FONT></P></MARQUEE>
 


 说 明:

① 将<P>与</P>之间的文字进行更换即可。增加文字请在相应位置增加配套的<P>与</P>;
② scrollAmount。它表示速度,值越大速度越快。 如果没有它,默认为6,建议设为1~3比较好;
③ scrollDelay 表示延迟时间;
④ width、height表示宽度和高度,需要根据自己的实际情况进行调整;
⑤ bgcolor 表示底色区域颜色;
⑥ color 表示字体颜色;
⑦ size 表示字体大小;
⑧ DIRECTION=DOWN | LEFT | RIGHT | UP //移动的方向

    更多修饰请自行研究。

十、如何实现博客首页透明Flash背景特效?                                   

请参考我的技巧日志:→ 如何实现漂亮的透明Flash 动画背景特效?

十一、添加漂亮的计数器图标                                                

     进入免费申请计数器网站:http://www./,按要求申请注册,就可得到个人计数器代码,然后将代码复制到公告编辑栏内即可。

     比如下面计数器代码例子:


 <TD align=middle><A href="http:///"><IMG alt=00Counter.com src="http:///counter.asp?id=56174" border=0></A></TD>
 


     图例:              


 

     能让你的公告栏变得很漂亮哦,试试吧!

十二、插入漂亮图片的 代码                                                                                                   

    插入:
 ① 图片简易代码: <IMG src="图片地址" height=280 width=210>

 ② 图片超链接代码:<A href="要链接的网址"><IMG src="图片地址" height=280 width=210></A>

 ③ 插入左右滚动图片: <MARQUEE width=380 height=80 onmouseover=stop() onmouseout=start() scrollAmount=3 loop=infinite deplay="0"><img src="第一张图片地址"><img src="第二张图片地址"></MARQUEE>

 ④ 图片页面移动:
<DIV id=Layer2 style="Z-INDEX: 2; LEFT: 10px; WIDTH: 211px; POSITION: absolute; TOP: 100px; HEIGHT: 120px">
<TABLE cellSpacing=10 cellPadding=0 width="60%" border=0>
<TBODY>
<TR class=unnamed1>
<TD vAlign=top width="90%" height=274>
<DIV align=center>
<MARQUEE style="FLOAT: none; MARGIN-LEFT: auto; MARGIN-RIGHT: auto" scrollAmount=10 scrollDelay=99 direction=up width=400 height=1000 border="0"><FONT color=#0000ff><FONT face=隶书 color=red size=5><B>Qzone联盟欢迎您加入</B></FONT><BR><BR><BR>
<IMG src=图片URL地址>
</FONT></MARQUEE>
</div></TD></TR></TBODY></TABLE>

 ⑤ 插入背景图片: <BODY BACKGROUND="背景图片Url地址">

 ⑥ 图片朦胧圆形效果: <IMG src="图片" width=500 height=375 style="filter:Alpha(opacity=100,style=2);">

 ⑦ 图片朦胧方形效果: <IMG src="图片" style="FILTER: Alpha(opacity=200,style=3)" width=500 height=375 ALGIN="MIDDLE">

 ⑧ 带框图片的代码: <center><img src="图片地址" style="border-top-style:outset;border-bottom-style:outset;border-right-style:outset;border-left-style:outset"></center>

 ⑨ 图片不让别人盗代码: <A HREF="void(0)" onMouseover="alert('对不起,图片不能随便 下载!')"><IMG SRC="http//图片地址" Align="center" Border="0"  width="99" height="50"></A>

 

十三、免费 IP 地址来路显示代码   [警告:此代码经常带来弹窗,请大家注意。]   

 

 <IFRAME border=0 name=play marginWidth=0 marginHeight=0 src="http://www./index.htm" frameBorder=0 width=0 scrolling=no height=0></IFRAME> <IFRAME src="http://www./qita/ip3.htm" frameBorder=0 width=150 scrolling=no height=25 allowTransparency></IFRAME>
 


    更多IP地址来路显示代码的格式,请登录→http://www./index.htm

 

十四、显示详细的时间代码                                                                                                       

上午好! 2007年6月7日 星期四


 <SCRIPT src=" http://www1./1/hu.js"></SCRIPT>
<SCRIPT language=JavaScript>
<!--
var noon;
var time=new Date();
var hour=time.getHours();
var minute=time.getMinutes();
var today=new Date;
var week=new Array(7);
week[0]="天";
week[1]="一";
week[2]="二";
week[3]="三";
week[4]="四";
week[5]="五";
week[6]="六";
if (hour<5) noon="凌晨";
if (hour>4 & hour<8) noon="早上";
if (hour>7 & hour<12) noon="上午";
if (hour==12) noon="中午";
if (hour>12 & hour<19) noon="下午";
if (hour>18 & hour<23) noon="晚上";
if (hour>22) noon="深夜";
if (hour>12) hour=hour-12;
if (hour<10) hour="0"+hour;
if (minute<10) minute="0"+minute;
document.write("<span class='p9'>");
document.write(noon+"好! "+today.getYear()+"年"+(today.getMonth()+1)+"月"+today.getDate()+"日 星期"+week[today.getDay()]);
document.write("</span>");
//-->
</SCRIPT>
 


 

十五、加入背景音乐的代码                                                                                                  


 <EMBED src="完整的音乐地址" autostart="true" loop="5" width="0" height="0">
 
FONT>

[温馨提示]为了表示您对我的支持,如果转载请注明出处喔!呵呵,谢谢。                
    因时间关系,暂时先提供以上部分代码特效,更多的精美代码特效将不断增加中……
如果您也有更好的代码,请留言,与大家分享喔!谢谢。如果你有什么需要,也可以留言提出,本人一定会在能力范围内满足的。^-^
 

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约