转一学就会__html语言成品代码

tianlanlanabc 2010-07-29

展开全文

一学就会__html语言成品代码

发表日期：2005年7月16日   出处：网络    作者：123   已经有505位读者读过此文

百叶窗效果

代码如下：

<TABLE cellSpacing=0 cellPadding=0 width="70%" align=center border=0>
<TBODY>
<TR>
<TD align=middle>
<MARQUEE scrollAmount=1 scrollDelay=100 direction=right width=120><IMG src="http://image13.360doc.com/DownloadImg/2010/07/2906/4305106_1.gif"></MARQUEE></TD>
<TD align=middle>
<MARQUEE scrollAmount=1 scrollDelay=100 width=120><IMG src="http://image13.360doc.com/DownloadImg/2010/07/2906/4305106_1.gif"></MARQUEE></TD>
<TD align=middle>
<MARQUEE scrollAmount=1 scrollDelay=100 direction=right width=120><IMG src="http://image13.360doc.com/DownloadImg/2010/07/2906/4305106_1.gif"></MARQUEE></TD>
<TD align=middle>
<MARQUEE scrollAmount=1 scrollDelay=100 width=120><IMG src="http://image13.360doc.com/DownloadImg/2010/07/2906/4305106_1.gif"></MARQUEE></TD></TR></TBODY></TABLE>

调整scrollDelay=XX可以调整滑动速度

效果如下：

不懂html语言的朋友也可以做一幅漂亮的图哦,只要复制这些代码.换上你自已喜欢的图片网址或者动画网址, 一幅属于你的大作就产生了。

边框：
1.两层
<P ALIGN=CENTER>
<TABLE cellSpacing=10 cellPadding=8 width=480 bgColor=#000000 border=1>
<TBODY><TR><TD><TABLE cellSpacing=2 cellPadding=2 width=480 bgColor=#000000 border=0>
<TBODY><TR><TD>加入内容</td></tr></tbody></table></td></tr></tbody></table>
2.八层
<TABLE cellSpacing=0 cellPadding=4 width="95%" align=center background=http://www./linkware/parker/p2strip.jpg border=0>
<TBODY>
<TR>
<TD>
<TABLE height=315 cellSpacing=0 cellPadding=15 width="100%" background=http://www./linkware/parker/p2background.jpg border=0>
<TBODY>
<TR>
<TD>
<TABLE height=355 cellSpacing=0 cellPadding=2 width="100%" background=http://www./linkware/parker/p2strip.jpg border=0>
<TBODY>
<TR>
<TD>
<TABLE height=387 cellSpacing=0 cellPadding=2 width="100%" background=http://www./linkware/parker/p2background.jpg border=0>
<TBODY>
<TR>
<TD>
<TABLE height=365 cellSpacing=0 cellPadding=2 width="100%" background=http://www./linkware/parker/p2strip.jpg border=0>
<TBODY>
<TR>
<TD>
<TABLE cellSpacing=0 cellPadding=15 width="100%" background=http://www./linkware/parker/p2background.jpg border=0>
<TBODY>
<TR>
<TD>
<DIV align=center>
<TABLE height=362 cellSpacing=0 cellPadding=2 width="100%" background=http://www./linkware/parker/p2strip.jpg border=0>
<TBODY>
<TR>
<TD>
<DIV align=center>
<TABLE height=361 cellSpacing=0 cellPadding=4 width="100%" background=http://www./linkware/parker/p2background.jpg border=0>
<TBODY>
<TR>
<TD>
<TABLE height=204 cellSpacing=0 cellPadding=4 width="100%" border=0>
<TBODY>
<TR>
<TD>
加入内容
</TD></TR></TBODY></TABLE></DIV></TD></TR></TBODY></TABLE></DIV></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>

3.三层
<CENTER><TABLE cellSpacing=10 cellPadding=2 width=450 bgColor=#000000 border=1><TR><TD><TABLE cellSpacing=8 cellPadding=10 width=450 bgColor=#000000 border=1><TR><TD><CENTER><TABLE cellSpacing=8 cellPadding=10 width=450 background=http://image13.360doc.com/DownloadImg/2010/07/2906/4305106_2.gif border=0><TR><TD>加入内容</TD></TR></TABLE></CENTER></TD></TR></TABLE></TD></TR></TABLE>
4.一层
<TABLE cellSpacing=1 cellPadding=0 width="100%" align=center background=http://pugongyingw./image/bj/10.jpg border=5>
<TBODY>
<TR>
<TD>加入内容</TD></TR></TBODY></TABLE>
5.两层
<CENTER>
<TABLE borderColor=#0000ff cellSpacing=0 borderColorDark=#ffffff cellPadding=0 width=480 border=1>
<TBODY>
<TR>
<TD>
<TABLE cellSpacing=5 cellPadding=5 width=430 align=center background=http://znrs./UploadFile/2004-6/200467181958882.jpg border=0>
<TBODY>
<TR>
<TD>
加入内容
</TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>
</CENTER>

加入图片代码：

一、单纯的一张图片
<P align=center><IMG src= http://forum./uploadFile/2004/05/29/AqSegBJrrq214800bingchuan4.jpg></P>
二、加框有一层FLASH的图片
<TABLE height=300 cellSpacing=0 cellPadding=0 width=400 background=http://www./htdocs/dvbbs/UploadFile/2004-6/200462095958665.jpg border=1 bortercolor="#000000">
<TBODY>
<TR>
<TD>
<P align=center><EMBED src=http://www./bg/6.swf width=400 height=300 type=application/x-shockwave-flash wmode="transparent" menu="false" quality="high" tybe="application/x-shockwave-flash"> </P></TD></TR></TBODY></TABLE>
三、加框用两层FLASH的图片
<P align=center>
<TABLE height=300 cellSpacing=0 cellPadding=0 width=400 background=http://www./htdocs/dvbbs/UploadFile/2004-6/200462010554370.jpg border=1 bortercolor="#000000">
<TBODY>
<TR>
<TD>
<P align=center><EMBED align=right src=http://www./bg/400.swf width=400 height=280 type=application/x-shockwave-flash wmode="transparent" menu="false" quality="high" tybe="application/x-shockwave-flash"> <BR><BR><EMBED align=right src=http://www./bg/fh/3/1.swf width=380 height=285 type=application/x-shockwave-flash wmode="transparent" menu="false" quality="high" tybe="application/x-shockwave-flash"> <BR></P></TD></TR></TBODY></TABLE>
四、两个FLASH上下排列的图片：
<TABLE cellSpacing=0 cellPadding=0 width=400 height=300 background=http://www./htdocs/dvbbs/UploadFile/2004-6/200462095452492.jpg border=1 bortercolor="#000000">
<TBODY>
<TR>
<TD>
<P align=center><EMBED src=http://www./bg/fh/3/1.swf width=400 height=150 type=application/x-shockwave-flash tybe="application/x-shockwave-flash" quality="high" menu="false" wmode="transparent"> <BR><BR><EMBED src=http://www./bg/9.swf width=400 height=150 type=application/x-shockwave-flash tybe="application/x-shockwave-flash" quality="high" menu="false" wmode="transparent"></P></TD></TR></TBODY></TABLE>
五、下上移动的图片们：
<center><MARQUEE scrollAmount=3 scrollDelay=150 direction=up width=450 height=500 borderColor="#000000" border="1">
<P align=center><IMG src="http://forum./uploadFile/2004/05/29/43akqeHuYd214718bingchuan4.jpg"></P>
<P align=center><IMG src="http://forum./uploadFile/2004/05/29/DLSKfBs53V215623bingchuan4.jpg"></P>
<P align=center><IMG src="http://forum./uploadFile/2004/05/29/ZEd88baGsn215638bingchuan4.jpg"></P>
</MARQUEE></center>
六、左右移动的图片们：（要有个背景哟）
<CENTER>
<MARQUEE scrollAmount=1 direction=right behavior=alternate width="100%">
<CENTER>
<TABLE cellSpacing=0 width=400 background=http://pugongyingw./image/xiantiao/d/14.gif border=0 cellpading="0">
<TBODY>
<TR>
<TD>
<P align=center><IMG src="http://bbs./UploadFile/2004-5/bihe.jpg___2004511215822101.jpg"></P>
<P align=center><IMG src="http://bbs./UploadFile/2004-5/by.jpg___2004511215822766.jpg"></P>
<P align=center><IMG src="http://bbs./UploadFile/2004-5/htys.jpg___2004511215822890.jpg"></P>
<P align=center><IMG src="http://bbs./UploadFile/2004-5/hyxq.jpg___2004511215822564.jpg"></P>
<P align=center><IMG src="http://bbs./UploadFile/2004-5/lty.jpg___2004511215822316.jpg"></P>
<P align=center><IMG src="http://bbs./UploadFile/2004-5/zyh.jpg___2004511215916227.jpg"></P>
<P align=center><IMG src="http://bbs./UploadFile/2004-5/yannian.jpg___200451121591787.jpg"></P>
<P align=center><IMG src="http://bbs./UploadFile/2004-5/xbh.jpg___2004511215917981.jpg"></P>
<P align=center><IMG src="http://bbs./UploadFile/2004-5/mdqg.jpg___20045112203661.jpg"></P>
<P align=center><IMG src="http://bbs./UploadFile/2004-5/mlsx.jpg___20045112203201.jpg"></P></TD></TR></TBODY></TABLE></CENTER></MARQUEE></CENTER>
七：图片雾化效果：

<CENTER><TABLE cellSpacing=0 cellPadding=0 width=400 background=http://www./bbs/UploadFile/20044244514090780.jpg border=0>
<TBODY>
<TR>
<TD style="FILTER: Alpha(opacity=100,style=2)" width=400 background=http://61.133.87.122/bbs/attachments/month_0405/5_IHwvJkvgflPp.jpg height=300><EMBED pluginspage=http://www.macromedia.com/go/getflashplayer src=http://www./tmswf/37.swf width=400 height=300 type=application/x-shockwave-flash quality="high" wmode="transparent"></EMBED></TD></TR></TBODY></TABLE></CENTER>
八：图片倒影效果：
<P align=center><FONT style="FONT-SIZE: 27pt; WIDTH: 220px; COLOR: #00ff00; HEIGHT: 10px"><IMG src="http://www./upload/upfile/2004430154320.gif"><FONT id=ew style="FONT-SIZE: 27pt; FILTER: wave(strength=3,freq=3,phase=0,lightstrength=30) blur() flipv(); WIDTH: 220px; COLOR: #3333ff; HEIGHT: 10px"><IMG src="http://www./upload/upfile/2004430154320.gif"></P></FONT></FONT><BR><BR>
九：图片向左右相反的方向移动的效果：
<MARQUEE width=200 height=50><IMG src="http://www./UploadFile/2004361972445799.gif"><IMG src="http://www./user/zn/UploadFile/2004-6/2004615135733903.gif"><IMG src="http://www./UploadFile/2004361972445799.gif"></MARQUEE>
<MARQUEE direction=right width=200 height=50><IMG src="http://851./bbs/UploadFile/2004-4/20044895834296.gif"><IMG src="http://www./user/zn/UploadFile/2004-6/200461612563116.gif"><IMG src="http://851./bbs/UploadFile/2004-4/20044895834296.gif"></MARQUEE><BR><BR>

加入背景音乐代码：

<EMBED src=http://www./raynal-onwer/asoka%20theme..wma.wma hidden=true type=audio/x-ms-wma LOOP="TRUE" AUTOSTART="TRUE"></EMBED>
所用元素：<EMBED></EMBED>
参数：
src：音乐文件的URL；
hidden：=true为不可见，=false反之；
type：指定音频类型；
LOOP：是否循环播放，注意其值置于小角双引号中；
AUTOSTART：是否自动播放，其值同上。

推荐几种贴音乐方法

1、下面是贴“wam”格式的语法，自动播放，自动循环语法命令。

<P align=center>
<TBODY>
<TR>
<TD>
<DIV align=center><EMBED src=音乐、歌曲地址 width=270 height=40 type="audio/x-pn-realaudio- plugin" controls="ControlPanel,StatusBar" autostart="true" loop="true">



2、下面是贴“mp3”格式的语法，自动播放，不循环语法命令。宽=（100----600），高=(30----40），可以根据自己的爱好修改，但是超过我提出的范围就不太好看了！

<embed src=type=音乐、歌曲地址 audio/x-pn-realaudio-plugin controls=controlpanel,statusbar autostart=true width=400 height=40>

3、下面是贴“mp3”格式的语法，自动播放，自动循环语法命令。

<DIV align=center><embed src=音乐、歌曲地址 type=audio/x-pn-realaudio-plugin controls=controlpanel,statusbar autostart=true loop=true width=400 height=40>

  4、下面是贴“mp3”格式的语法，手动播放，不循环语法命令

<embed src=音乐、歌曲地址 type=audio/x-pn-realaudio-plugin controls=controlpanel,statusbarautostart=false width=400 height=40>

<embed src=音乐、歌曲地址 type=audio/x-pn-realaudio-plugin controls=controlpanel,statusbar autostart=true loop=true width=400 height=40>

5、面是贴“mp3”格式的语法，手动播放，自动循环语法命令。

<embed src=音乐、歌曲地址 type=audio/x-pn-realaudio-plugin controls=controlpanel,statusbar autostart=true loop=true width=400 height=40>

6、面是贴“mp3”格式的语法，隐藏播放器，（就象我的帖：《关于如何贴图》的背景音乐一样）自动播放，自动循环。不会显示播放器

<embed src=音乐、歌曲地址 type=audio/x-pn-realaudio-plugin controls=controlpanel,statusbar autostart=true loop=true hidden=true width=400 height=40>

7、要是需要居中，就在语法命令前面加“<center>”（</center>注意使用居中结束）即可：

如：<center><embed src=http://file./swf/file12003up/waitbeau20033165456.swf width=500 height=400></center>

一、添加背景的语法命令

（一）单层背景的语法命令

1、<CENTER>
<TABLE style="WIDTH: 571px; HEIGHT: 128px" cellSpacing=10 cellPadding=0 width=571 align=center background= 背景地址 border=0>
<TBODY>
<TR>
<TD width=721>
<DIV align=center> </DIV></TD></TR></TBODY></TABLE>
<CENTER></CENTER></CENTER>

2、<TABLE cellPadding=100 width=480 align=center background=http://bbs./pubfile/images/i0002264.gif border=0 cellSpacing40>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#00bb00 cellSpacing=10 borderColorDark=#00bb00 cellPadding=0 width=480 align=center border=5>
<TBODY>
<TR>
<TD>
<P align=center><STRONG><FONT color=#006400 size=6></FONT></STRONG> </P>
<P align=center><FONT color=#7fff00>加入文字</FONT> </P></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></P>

上面的代码只要换红色的地址就可以变成另外一个边框了.

（二）多层背景的语法命令

<CENTER>
<TABLE style="WIDTH: 571px; HEIGHT: 128px" cellSpacing=10 cellPadding=0 width=571 align=center background= 背景地址 border=0>
<TBODY>
<TR>
<TD width=721>
<DIV align=center>
<DIV align=center>
<CENTER> </CENTER>
<CENTER>
<TABLE style="WIDTH: 571px; HEIGHT: 128px" cellSpacing=10 cellPadding=0 width=571 align=center background=背景地址 border=0>
<TBODY>
<TR>
<TD width=721>
<DIV align=center>
<CENTER> </CENTER>
<CENTER>
<TABLE style="WIDTH: 571px; HEIGHT: 128px" cellSpacing=10 cellPadding=0 width=571 align=center background=背景地址 border=0>
<TBODY>
<TR>
<TD width=721>
<DIV align=center>
<DIV align=center>
<CENTER> </CENTER>
<CENTER>
<TABLE style="WIDTH: 571px; HEIGHT: 128px" cellSpacing=10 cellPadding=0 width=571 align=center background=背景地址 border=0>
<TBODY>
<TR>
<TD width=721>
<DIV align=center> </DIV></TD></TR></TBODY></TABLE>

二、背景添加透明FLASH的语法命令

<P align=center><EMBED style="LEFT: 50px; WIDTH: 850px; POSITION: absolute; TOP: 100px; HEIGHT: 500px" align=right src= FLASH地址 width=200 height=1500 type=application/octet-stream wmode="transparent" quality="high" ;;></P>

三、图片横向摆动的语法命令

<P align=center>
<MARQUEE scrollAmount=3 behavior=alternate width="100%">
<P align=center><IMG style="WIDTH: 422px" height=390 src="图片地址" width=300 onload="javascript:if(this.width>screen.width-333)this.width=screen.width-333"></P></MARQUEE></P>

四、网站引导语法命令

<P align=center><A href="http://mywzh./"><FONT color=#a00000 size=5>★欢迎进入茗园网站★</FONT><FONT color=#003366> </FONT></P>

五、禁止右键命令

<script language="javascript">
function click() {
if (event.button==2) {
alert('欢迎光临寒舍，有什么需要帮忙的话，请与站长联系！谢谢您的合作！！！')
}
}
document.onmousedown=click
</script>

六、图片模糊处理命令

<P align=left><IMG style="FILTER: Alpha(opacity=100,style=2); WIDTH: 276px; HEIGHT: 284px" height=188 src="图片地址" width=454></P>

七、可以向上移动的图片或文字命令

<P align=left>
<MARQUEE onmouseover=this.stop() style="WIDTH: 375px; HEIGHT: 143px" onmouseout=this.start() scrollAmount=1 direction=up height=143><FONT color=#ff3366><FONT face=华文行楷 size=6 40pt><B>
<CENTER><FONT face=楷体_GB2312 color=#b0c4de size=4><IMG style="FILTER: Alpha(opacity=100,style=2); WIDTH: 192px; HEIGHT: 118px" height=188 src="图片地址" width=454></FONT></CENTER><FONT face=楷体_GB2312 color=#b0c4de size=4>
<CENTER><BR> </CENTER></FONT></FONT></B></FONT></MARQUEE></P>

八、上图片向右，下图片向左移动的命令

<P align=center>
<MARQUEE style="WIDTH: 240px; HEIGHT: 43px" width=240 height=43><STRONG>
<P align=center><SPAN lang=EN-US style="FONT-SIZE: 18pt; COLOR: black; FONT-FAMILY: Arial; mso-bidi-font-size: 10.0pt; mso-bidi-font-family: 'Times New Roman'; mso-ascii-font-family: 宋体"><STRONG><FONT color=#0000ff><SPAN lang=EN-US style="FONT-SIZE: 18pt; COLOR: black; FONT-FAMILY: Arial; mso-bidi-font-size: 10.0pt; mso-bidi-font-family: 'Times New Roman'; mso-ascii-font-family: 宋体"><STRONG><FONT color=#0000ff><SPAN lang=EN-US style="FONT-SIZE: 18pt; COLOR: black; FONT-FAMILY: Arial; mso-bidi-font-size: 10.0pt; mso-bidi-font-family: 'Times New Roman'; mso-ascii-font-family: 宋体"><STRONG><FONT color=#0000ff><IMG style="FILTER: Alpha(opacity=100,style=2); WIDTH: 218px; HEIGHT: 224px" height=188 src="图片地址" width=454></FONT></STRONG></SPAN></FONT></STRONG></SPAN></FONT></STRONG></SPAN></P></STRONG></FONT></MARQUEE></P><FONT face=华文彩云 color=#2f4f4f size=6>
<P align=center>
<MARQUEE direction=right width=240 height=50><STRONG><SPAN lang=EN-US style="FONT-SIZE: 18pt; COLOR: black; FONT-FAMILY: Arial; mso-bidi-font-size: 10.0pt; mso-bidi-font-family: 'Times New Roman'; mso-ascii-font-family: 宋体"><STRONG><FONT color=#0000ff>
<CENTER><SPAN lang=EN-US style="FONT-SIZE: 18pt; COLOR: black; FONT-FAMILY: Arial; mso-bidi-font-size: 10.0pt; mso-bidi-font-family: 'Times New Roman'; mso-ascii-font-family: 宋体"><STRONG><FONT color=#0000ff><SPAN lang=EN-US style="FONT-SIZE: 18pt; COLOR: black; FONT-FAMILY: Arial; mso-bidi-font-size: 10.0pt; mso-bidi-font-family: 'Times New Roman'; mso-ascii-font-family: 宋体"><STRONG><FONT color=#0000ff><IMG style="FILTER: Alpha(opacity=100,style=2); WIDTH: 222px; HEIGHT: 217px" height=188 src="图片地址" width=454></FONT></STRONG></SPAN></FONT></STRONG></SPAN></CENTER></FONT></STRONG></SPAN></STRONG></MARQUEE></P>

九、图片从右向左移动的命令

<P align=left>
<MARQUEE style="WIDTH: 443px; HEIGHT: 20px" scrollDelay=120 width=443 height=20>
<DIV align=left><STRONG>    <SPAN lang=EN-US style="FONT-SIZE: 18pt; COLOR: black; FONT-FAMILY: Arial; mso-bidi-font-size: 10.0pt; mso-bidi-font-family: 'Times New Roman'; mso-ascii-font-family: 宋体"><STRONG><FONT color=#0000ff><SPAN lang=EN-US style="FONT-SIZE: 18pt; COLOR: black; FONT-FAMILY: Arial; mso-bidi-font-size: 10.0pt; mso-bidi-font-family: 'Times New Roman'; mso-ascii-font-family: 宋体"><STRONG><FONT color=#0000ff><IMG style="FILTER: Alpha(opacity=100,style=2); WIDTH: 244px; HEIGHT: 176px" height=188 src="图片地址" width=454></FONT></STRONG></SPAN></FONT></STRONG></SPAN></STRONG></DIV></FONT></MARQUEE></P>

十、图片分别向左右移动的命令

<DIV align=center>
<P align=center><SPAN lang=EN-US style="FONT-SIZE: 18pt; COLOR: black; FONT-FAMILY: Arial; mso-bidi-font-size: 10.0pt; mso-bidi-font-family: 'Times New Roman'; mso-ascii-font-family: 宋体"><FONT face=楷体_GB2312 color=#add8e6 size=4><SPAN lang=EN-US style="FONT-SIZE: 18pt; COLOR: black; FONT-FAMILY: Arial; mso-bidi-font-size: 10.0pt; mso-bidi-font-family: 'Times New Roman'; mso-ascii-font-family: 宋体"><FONT color=#0000ff></FONT></SPAN></FONT></SPAN> <FONT face=华文彩云 color=#2f4f4f size=6>
<MARQUEE style="WIDTH: 240px; HEIGHT: 43px" width=240 height=43><STRONG>
<P align=center><SPAN lang=EN-US style="FONT-SIZE: 18pt; COLOR: black; FONT-FAMILY: Arial; mso-bidi-font-size: 10.0pt; mso-bidi-font-family: 'Times New Roman'; mso-ascii-font-family: 宋体"><STRONG><FONT color=#0000ff><SPAN lang=EN-US style="FONT-SIZE: 18pt; COLOR: black; FONT-FAMILY: Arial; mso-bidi-font-size: 10.0pt; mso-bidi-font-family: 'Times New Roman'; mso-ascii-font-family: 宋体"><STRONG><FONT color=#0000ff><SPAN lang=EN-US style="FONT-SIZE: 18pt; COLOR: black; FONT-FAMILY: Arial; mso-bidi-font-size: 10.0pt; mso-bidi-font-family: 'Times New Roman'; mso-ascii-font-family: 宋体"><STRONG><FONT color=#0000ff><IMG style="FILTER: Alpha(opacity=100,style=2); WIDTH: 218px; HEIGHT: 224px" height=188 src="图片地址" width=454></FONT></STRONG></SPAN></FONT></STRONG></SPAN></FONT></STRONG></SPAN></P></STRONG></FONT></MARQUEE><FONT face=华文彩云 color=#2f4f4f size=6>
<MARQUEE direction=right width=240 height=50><STRONG><SPAN lang=EN-US style="FONT-SIZE: 18pt; COLOR: black; FONT-FAMILY: Arial; mso-bidi-font-size: 10.0pt; mso-bidi-font-family: 'Times New Roman'; mso-ascii-font-family: 宋体"><STRONG><FONT color=#0000ff>
<CENTER><SPAN lang=EN-US style="FONT-SIZE: 18pt; COLOR: black; FONT-FAMILY: Arial; mso-bidi-font-size: 10.0pt; mso-bidi-font-family: 'Times New Roman'; mso-ascii-font-family: 宋体"><STRONG><FONT color=#0000ff><SPAN lang=EN-US style="FONT-SIZE: 18pt; COLOR: black; FONT-FAMILY: Arial; mso-bidi-font-size: 10.0pt; mso-bidi-font-family: 'Times New Roman'; mso-ascii-font-family: 宋体"><STRONG><FONT color=#0000ff><IMG style="FILTER: Alpha(opacity=100,style=2); WIDTH: 218px; HEIGHT: 217px" height=188 src="图片地址" width=454></FONT></STRONG></SPAN></FONT></STRONG></SPAN></CENTER></FONT></STRONG></SPAN></STRONG></MARQUEE></FONT></FONT>

十一、文字在图片中部向上移动（隶书）

<TABLE height=330 width=450 background=http://www./cards/flowers_h1/0007.JPG border=0>
<TBODY>
<TR>
<TD align=middle>
<MARQUEE scrollAmount=2 direction=up height=200>
<CENTER><FONT style="FONT-SIZE: 36pt" face=隶书 color=red><B>心灵相约相约心灵</B> </FONT></CENTER></MARQUEE></TD></TR></TOBDY></TBODY></TABLE>

其中<MARQUEE scrollAmount=2 direction=up height=200>为移动命令,scrollAmount=2   数字越大，速度越快。direction=up  移动的方向  ，可以变换英文“down”"left”“right”等。height=200   为移动的高度。http://www./cards/flowers_h1/0007.JPG border=0 为图片地址，你可以换成自己喜欢的图片。“心灵相约相约心灵”是在图片上写入的文字，可以根据需要写上其它字。

十二：禁复制命令：

<SCRIPT language=JavaScript>
window.ClearEvent=function(){event.cancelBubble=false;var sSrcTagName=event.srcElement.tagName.toLowerCase();
return (sSrcTagName=="textarea" || sSrcTagName=="input" || sSrcTagName=="select");}
window.ClearKey=function(){event.cancelBubble=false;var iKeyCode=event.keyCode;return !(iKeyCode==78 && event.ctrlKey);}
with (window.document){oncontextmenu=onselectstart=ondragstart=window.ClearEvent;onkeydown=window.ClearKey;}
</SCRIPT>

十三图片水中倒影

脚本说明:
把如下代码加入<body>区域中
<IMG height=189 id=reflect src="119.gif"
width=237><BR>
<SCRIPT language=JavaScript1.2>
function f1(){
setInterval("mdiv.filters.wave.phase+=10",100);
}

if (document.all){
document.write('<img id=mdiv src="'+document.all.reflect.src+'" style="filter:wave(strength=3,freq=3,phase=0,lightstrength=30) blur() flipv()">')
window.onload=f1
}
</SCRIPT>

十四、

图片集旋转显示

脚本说明:
第一步：把如下代码加入<body>区域中
<script type="text/javascript">
// 7 variables to control behavior
var Car_Image_Width=140;
var Car_Image_Height=225;
var Car_Border=true;  // true or false
var Car_Border_Color="white";
var Car_Speed=4;
var Car_Direction=true;  // true or false
var Car_NoOfSides=8;  // must be 4, 6, 8 or 12

/* array to specify images and optional links.
For 4 sided carousel specify at least 2 images
For 6 sided carousel specify at least 3
For 8 sided carousel specify at least 4
For 12 sided carousel specify at least 6
If Link is not needed keep it ""
*/
Car_Image_Sources=new Array(
  "200310171/photo1.jpg","http://www.cctv.com",
  "200310171/photo2.jpg","http://www.cctv.com",
  "200310171/photo3.jpg","", file://this slide isn't linked
  "200310171/photo4.jpg","http://www.cctv.com" // NOTE No comma after last line
  );

/***************** DO NOT EDIT BELOW **********************************/
CW_I=new Array(Car_NoOfSides/2+1);C_ClcW=new Array(Car_NoOfSides/2);
C_Coef=new Array(
  3*Math.PI/2,0,3*Math.PI/2,11*Math.PI/6,Math.PI/6,3*Math.PI/2,7*Math.PI/4, 0,
  Math.PI/4,3*Math.PI/2,5*Math.PI/3,11*Math.PI/6,0,Math.PI/6,Math.PI/3);
var C_CoefOf=Car_NoOfSides==4?0:Car_NoOfSides==6?2:Car_NoOfSides==8?5:9;
C_Pre_Img=new Array(Car_Image_Sources.length);
var C_Angle=Car_Direction?Math.PI/(Car_NoOfSides/2):0,C_CrImg=Car_NoOfSides,C_MaxW,C_TotalW,
C_Stppd=false,i,C_LeftOffset,C_HalfNo=Car_NoOfSides/2;

function Carousel(){
  if(document.getElementById){
   for(i=0;i<Car_Image_Sources.length;i+=2){
    C_Pre_Img[i]=new Image();C_Pre_Img[i].src=Car_Image_Sources[i]}
   C_MaxW=Car_Image_Width/Math.sin(Math.PI/Car_NoOfSides)+C_HalfNo+1;
   Car_Div=document.getElementById("Carousel");
   for(i=0;i<C_HalfNo;i++){
    CW_I[i]=document.createElement("img");Car_Div.appendChild(CW_I[i]);
    CW_I[i].style.position="absolute";
    CW_I[i].style.top=0+"px";
    CW_I[i].style.height=Car_Image_Height+"px";
    if(Car_Border){
     CW_I[i].style.borderStyle="solid";
     CW_I[i].style.borderWidth=1+"px";
     CW_I[i].style.borderColor=Car_Border_Color}
    CW_I[i].src=Car_Image_Sources[2*i];
    CW_I[i].lnk=Car_Image_Sources[2*i+1];
    CW_I[i].onclick=C_LdLnk;
    CW_I[i].onmouseover=C_Stp;
    CW_I[i].onmouseout=C_Rstrt}
   CarImages()}}

function CarImages(){
  if(!C_Stppd){
   C_TotalW=0;
   for(i=0;i<C_HalfNo;i++){
    C_ClcW[i]=Math.round(Math.cos(Math.abs(C_Coef[C_CoefOf+i]+C_Angle))*Car_Image_Width);
    C_TotalW+=C_ClcW[i]}
   C_LeftOffset=(C_MaxW-C_TotalW)/2;
   for(i=0;i<C_HalfNo;i++){
    CW_I[i].style.left=C_LeftOffset+"px";
    CW_I[i].style.width=C_ClcW[i]+"px";
    C_LeftOffset+=C_ClcW[i]}
   C_Angle+=Car_Speed/720*Math.PI*(Car_Direction?-1:1);
   if((Car_Direction&&C_Angle<=0)||(!Car_Direction&&C_Angle>=Math.PI/C_HalfNo)){
    if(C_CrImg==Car_Image_Sources.length)C_CrImg=0;
    if(Car_Direction){
     CW_I[C_HalfNo]=CW_I[0];
     for(i=0;i<C_HalfNo;i++)CW_I[i]=CW_I[i+1];
     CW_I[C_HalfNo-1].src=Car_Image_Sources[C_CrImg];
     CW_I[C_HalfNo-1].lnk=Car_Image_Sources[C_CrImg+1]}
    else{ for(i=C_HalfNo;i>0;i--)CW_I[i]=CW_I[i-1];
     CW_I[0]=CW_I[C_HalfNo];
     CW_I[0].src=Car_Image_Sources[C_CrImg];
     CW_I[0].lnk=Car_Image_Sources[C_CrImg+1]}
    C_Angle=Car_Direction?Math.PI/C_HalfNo:0;C_CrImg+=2}}
  setTimeout("CarImages()",50)}

function C_LdLnk(){if(this.lnk)window.location.href=this.lnk}
function C_Stp(){this.style.cursor=this.lnk?"pointer":"default";C_Stppd=true;}
function C_Rstrt(){C_Stppd=false}
</script>
<div id="Carousel" style="position:relative">
   <img src="200310171/placeholder.gif" width="371" height="225">
</div>

第二步：把<body>中的内容改为：
<body onload="Carousel()">

十五、特效代码
<BR>
<CENTER><EMBED pluginspage=http://www.macromedia.com/go/getflashplayer src=http://www./card/main/0411/041122f.swf width=400 height=300 type=application/x-shockwave-flash quality="high" ;; menu="false" wmode="transparent"></EMBED> </CENTER>
十六、自动打字效果

<script language="JavaScript">
var msg = "欢迎光临夏之雪，请多提意见。谢谢! " ;
var interval = 120
var spacelen = 120;
var space10=" ";
var seq=0;
function Helpor_net() {
len = msg.length;
window.status = msg.substring(0, seq+1);
seq++;
if ( seq >= len ) {
seq = 0;
window.status = '';
window.setTimeout("Helpor_net();", interval );
}
else
window.setTimeout("Helpor_net();", interval );
}
Helpor_net();
</script>

十七、满天飘花的特效

<SCRIPT language=JavaScript1.2>
//Pre-load your image below!
grphcs=new Array(6)
Image0=new Image();
Image0.src=grphcs[0]="http://www./bbs/upload/hlx_200491302631.gif";
Image1=new Image();
Image1.src=grphcs[1]="http://www./bbs/upload/hlx_200491302631.gif"
Image2=new Image();
Image2.src=grphcs[2]="http://www./photo/65/person/organ/mens/29.gif"
Image3=new Image();
Image3.src=grphcs[3]="http://www./photo/65/person/organ/mens/29.gif"
Image4=new Image();
Image4.src=grphcs[4]="http://www./bbs/upload/hlx_200491302631.gif"
Image5=new Image();
Image5.src=grphcs[5]="http://www./bbs/upload/hlx_200491302631.gif"
Amount=8; //Smoothness depends on image file size, the smaller the size the more you can use!
Ypos=new Array();
Xpos=new Array();
Speed=new Array();
Step=new Array();
Cstep=new Array();
ns=(document.layers)?1:0;
ns6=(document.getElementById&&!document.all)?1:0;
if (ns){
for (i = 0; i < Amount; i++){
var P=Math.floor(Math.random()*grphcs.length);
rndPic=grphcs[P];
document.write("<LAYER NAME='sn"+i+"' LEFT=0 TOP=0><img src="+rndPic+"></LAYER>");
}
}
else{
document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i = 0; i < Amount; i++){
var P=Math.floor(Math.random()*grphcs.length);
rndPic=grphcs[P];
document.write('<img id="si'+i+'" src="'+rndPic+'" style="position:absolute;top:0px;left:0px">');
}
document.write('</div></div>');
}
WinHeight=(ns||ns6)?window.innerHeight:window.document.body.clientHeight;
WinWidth=(ns||ns6)?window.innerWidth-70:window.document.body.clientWidth;
for (i=0; i < Amount; i++){
Ypos[i] = Math.round(Math.random()*WinHeight);
Xpos[i] = Math.round(Math.random()*WinWidth);
Speed[i]= Math.random()*5+3;
Cstep[i]=0;
Step[i]=Math.random()*0.1+0.05;
}
function fall(){
var WinHeight=(ns||ns6)?window.innerHeight:window.document.body.clientHeight;
var WinWidth=(ns||ns6)?window.innerWidth-70:window.document.body.clientWidth;
var hscrll=(ns||ns6)?window.pageYOffset:document.body.scrollTop;
var wscrll=(ns||ns6)?window.pageXOffset:document.body.scrollLeft;
for (i=0; i < Amount; i++){
sy = Speed[i]*Math.sin(90*Math.PI/180);
sx = Speed[i]*Math.cos(Cstep[i]);
Ypos[i]+=sy;
Xpos[i]+=sx;
if (Ypos[i] > WinHeight){
Ypos[i]=-60;
Xpos[i]=Math.round(Math.random()*WinWidth);
Speed[i]=Math.random()*5+3;
}
if (ns){
document.layers['sn'+i].left=Xpos[i];
document.layers['sn'+i].top=Ypos[i]+hscrll;
}
else if (ns6){
document.getElementById("si"+i).style.left=Math.min(WinWidth,Xpos[i]);
document.getElementById("si"+i).style.top=Ypos[i]+hscrll;
}
else{
eval("document.all.si"+i).style.left=Xpos[i];
eval("document.all.si"+i).style.top=Ypos[i]+hscrll;
}
Cstep[i]+=Step[i];
}
setTimeout('fall()',20);
}
window.onload=fall
//-->
</SCRIPT>

十八、图片滚动的代码

一、向左滚动

1、调用“图片”栏目图片的向左滚动代码（效果演示）
以下是首页模板最新图片部分代码
-----------------------------------
<tr>
<td class=main_title_575><B>最新图片</B></td>
</tr>
<tr>
<td class=main_tdbg_575 vAlign=center align=middle height=131>
 </td>
</tr>
------------------------------------
用以下是滚动代码代替上面红色的标签部分，注意红色部分的变化。
------------------------------------

<div id=demo style="OVERFLOW: hidden; WIDTH: 560px; HEIGHT: 120px">
<table cellPadding=0 align=left border=0 cellspace="0">
   <tr>
     <td id=demo11 vAlign=top>
      </td>
     <td id=demo12 vAlign=top></td>
   </tr>
</table>
</div>
<SCRIPT>
var speed=15
demo12.innerHTML=demo11.innerHTML
function Marquee11(){
if(demo12.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft-=demo11.offsetWidth
else{
demo.scrollLeft++
}
}
var MyMar1=setInterval(Marquee11,speed)
demo.onmouseover=function() {clearInterval(MyMar1)}
demo.onmouseout=function() {MyMar1=setInterval(Marquee11,speed)}
</SCRIPT>

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

2、文章频道图片向左滚动代码（效果演示）
以下是文章频道模板最新图片部分代码
-----------------------------------
<tr>
<td Class="main_title_575"><b>最新图片{$ChannelShortName}</b></td>
</tr>
<tr>
   <td Class="main_tdbg_575"> {$GetPicArticle(ChannelID,0,True,0,4,false,false,0,3,2,130,90,20,0,True,4)} </td>
</tr>
<tr>
   <td Class="main_shadow"></td>
</tr>
------------------------------------
用以下是滚动代码代替上面红色的标签，注意红色部分的变化。红色数字代表了滚动图片的总数（这里为8张）。
----------------------------------

<div id=demo style="OVERFLOW: hidden; WIDTH: 560px; HEIGHT: 120px">
<table cellPadding=0 align=left border=0 cellspace="0">
   <tr>
    <td id=demo11 vAlign=top>
      </td>
    <td id=demo12 vAlign=top></td>
   </tr>
</table>
</div>
<SCRIPT>
var speed=15
demo12.innerHTML=demo11.innerHTML
function Marquee11(){
if(demo12.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft-=demo11.offsetWidth
else{
demo.scrollLeft++
}
}
var MyMar1=setInterval(Marquee11,speed)
demo.onmouseover=function() {clearInterval(MyMar1)}
demo.onmouseout=function() {MyMar1=setInterval(Marquee11,speed)}
</SCRIPT>

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

3、下载频道图片向左滚动代码（效果演示）
以下是下载频道模板推荐下载图片部分代码
-----------------------------------
<tr>
<td Class="main_title_575"><table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr>
      <td><b><a class='Class' href="{$InstallDir}{$ChannelDir}/ShowElite.asp">推荐下载(图)</a></b></td>
      <td align="right">{$RssElite}</td>
    </tr>
    </table></td>
    </tr>
<tr>
<td align="center" Class="main_tdbg_575"> {$GetPicSoft(ChannelID,0,True,0,4,false,True,0,3,2,130,90,20,0,True,4)} </td>
</tr>
------------------------------------
用以下是滚动代码代替上面红色的标签，注意红色部分的变化。红色数字代表了滚动图片的总数（这里为12张）。
------------------------------------

<div id=demo style="OVERFLOW: hidden; WIDTH: 560px; HEIGHT: 120px">
<table cellPadding=0 align=left border=0 cellspace="0">
    <tr>
      <td id=demo11 vAlign=top>
       </td>
      <td id=demo12 vAlign=top></td>
    </tr>
</table>
</div>
<SCRIPT>
var speed=15
demo12.innerHTML=demo11.innerHTML
function Marquee11(){
if(demo12.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft-=demo11.offsetWidth
else{
demo.scrollLeft++
}
}
var MyMar1=setInterval(Marquee11,speed)
demo.onmouseover=function() {clearInterval(MyMar1)}
demo.onmouseout=function() {MyMar1=setInterval(Marquee11,speed)}
</SCRIPT>

------------------------------
从以上可以看出，滚动图片代码基本上是相同的，不同的是调用图片的标签变了。
------------------------------

二、向上滚动

向上滚动代码使用方法同上左滚动代码，这里只给出代码，不再说明。
以下是文章频道图片调用的滚动代码。
-----------------------------------------------------------

<DIV id=rolllink style="OVERFLOW: hidden; WIDTH: 160px; HEIGHT: 360px">
<DIV id=rolllink1>
    <TABLE cellSpacing=5 width="100%">
      <tr>
       <td id=demo11 vAlign=top>
          </td>
       <td id=demo12 vAlign=top></td>
      </tr>
    </TABLE>
</DIV>
<DIV id=rolllink2></DIV>
</DIV>
<SCRIPT>
var rollspeed=40
rolllink2.innerHTML=rolllink1.innerHTML
function Marquee(){
if(rolllink2.offsetTop-rolllink.scrollTop<=0)
rolllink.scrollTop-=rolllink1.offsetHeight
else{
rolllink.scrollTop++
}
}
var MyMar=setInterval(Marquee,rollspeed)
rolllink.onmouseover=function() {clearInterval(MyMar)}
rolllink.onmouseout=function() {MyMar=setInterval(Marquee,rollspeed)}
</SCRIPT>

-----------------------------------------------------------
以下是图片频道的3行4列向上滚动代码摘录：（效果演示）

………………………
<tr>
          <td colspan="3" Class="main_title_575"><a class="Class" href="{$InstallDir}{$ChannelDir}/ShowNew.asp"><b>最新{$ChannelShortName}</b></a></td>
        </tr>
        <tr valign="top">
          <td colspan="3"><table width="100%" border="0" cellspacing="0" cellpadding="0" Class="main_tdbg_575">
<tr>
    <td height="200" valign="top">

<DIV id=rolllink style="OVERFLOW: hidden; WIDTH: 575px; HEIGHT: 365px">
<DIV id=rolllink1>
    <TABLE cellSpacing=5 width="100%">
      <tr>
       <td id=demo11 vAlign=top>
         </td>
       <td id=demo12 vAlign=top></td>
      </tr>
    </TABLE>
</DIV>
<DIV id=rolllink2></DIV>
</DIV>
<SCRIPT>
var rollspeed=40
rolllink2.innerHTML=rolllink1.innerHTML
function Marquee(){
if(rolllink2.offsetTop-rolllink.scrollTop<=0)
rolllink.scrollTop-=rolllink1.offsetHeight
else{
rolllink.scrollTop++
}
}
var MyMar=setInterval(Marquee,rollspeed)
rolllink.onmouseover=function() {clearInterval(MyMar)}
rolllink.onmouseout=function() {MyMar=setInterval(Marquee,rollspeed)}
</SCRIPT>

</td>
</tr>
</table>
          </td>
        </tr>
        <tr>
          <td colspan="3" Class="main_shadow"></td>
        </tr>
…………………………

三、向右滚动
--------------------------------------

<div id=demo style=overflow:hidden;height:120;width:560;>
<table align=left cellpadding=0 cellspace=0 border=0>
<tr>
   <td id=demo1 valign=top></td>
   <td id=demo2 valign=top></td>
</tr>
</table>
</div>
<script>
    var speed=30
    demo2.innerHTML=demo1.innerHTML
    demo.scrollLeft=demo.scrollWidth
    function Marquee(){
     if(demo.scrollLeft<=0)
     demo.scrollLeft+=demo2.offsetWidth
     else{
     demo.scrollLeft--
     }
    }
    var MyMar=setInterval(Marquee, speed)
    demo.onmouseover=function() {clearInterval(MyMar)}
    demo.onmouseout=function() {MyMar=setInterval(Marquee, speed)}
</script>

-------------------------------------
注意滚动图片数不要太大，这会影响页面下载速度。

十九、图片和文字从右向左流动

代码

<MARQUEE scrollAmount=3 width=400><IMG src="http://vip./ofo/gif/lian.gif" onload="javascript:if(this.width>screen.width-333)this.width=screen.width-333"><FONT face=隶书 color=lime size=4> 图片和文字从右到左流动 <IMG src="http://vip./ofo/gif/lian.gif" onload="javascript:if(this.width>screen.width-333)this.width=screen.width-333"></FONT>
<P></P></MARQUEE>

二十、图片和文字从左向右流动

图片和文字从左到右流动

代码

<MARQUEE direction=right width=400 height=50><FONT face=隶书 color=#ff0000 size=7>图片和文字从左到右流动 <IMG src="http://vip./ofo/gif/lian.gif" onload="javascript:if(this.width>screen.width-333)this.width=screen.width-333"> </FONT></MARQUEE>