恋恋风尘论坛 » [设计素材] » ★[HTML转帖]从零开始学HTML语言音画制做★

查看完整版本: ★[HTML转帖]从零开始学HTML语言音画制做★

烟，鬼魅青雾 2006-9-14 01:39

★[HTML转帖]从零开始学HTML语言音画制做★

在用HTML代码格式前，要在发表框里先点在<A href="http://jy.music.topzj.com/faq.php?page=misc#1" target=_blank>Discuz! 代码</A> 可用才能生效。。
 
HTML的英语全称为Hyper Text Markup Language，中文意思是超文本标识语言（简称为：超文本语言）。 
它是计算机语言的最基础、最简单的部分。我们知道计算机最基本的识别文字（也叫语言）就是26个英文字母+10个阿拉伯数字+部分标点符号。论坛上的HTML音画制做是不借助任何软件的，所以就必须使用HTML语言（部分网站及专业论坛是不开放HTML设置的）。 
初学者一打开HTML制式，看到的往往是一堆代码，即便不晕也是丈二和尚，往往会在这个时期放弃学习，实际上你只要摸上规律，找到窍门，它是很简单的，因为它的组成是有定律的、是固定的，HTML语言音画最基本的构成就是四个部分： 边框 图片（内容） 音乐 FLASH
下面先讲边框：
边框可以设置任意N层，你想要几层就几层，网上很协调美观的边框大部分都是专业人士制做（有些网站可以专门下载），你不要一看见一个漂亮边框就认为楼主高不可攀，实际上大部分会员用的协调美观的边框都是共享的（当然，也有很大一部分高手是原创，例如大家比较熟悉的夜色迷离、白山岫水等高手），所以我在这里可以这样说：网上的边框是共享的，大家完全可以心安理得地去借用和复制，不用脸红（但本坛支持原创）！哈哈，我是借用别人的边框从来不脸红的人。
下面是一个七层边框的实例介绍，图片可以任意换，只要你觉着好看就行：
<TABLE cellSpacing=0 borderColorDark=#001a1a cellPadding=10 width=500 borderColorLight=#055b56 background=图片地址 border=0> <TBODY> <TR> <TD width="100%"> <TABLE cellSpacing=0 borderColorDark=#001a1a cellPadding=15 width=500 borderColorLight=#055b56 background=图片地址 border=0> <TBODY> <TR> <TD width="100%"> <TABLE cellSpacing=0 cellPadding=3 width="100%" background=图片地址 border=0> <TBODY> <TR> <TD width="100%"> <TABLE cellSpacing=0 cellPadding=15 width="100%" background= 图片地址 border=0> <TBODY> <TR> <TD width="100%"> <TABLE cellSpacing=0 cellPadding=3 width="100%" background=图片地址 border=0> <TBODY> <TR> <TD width="100%"> <TABLE cellSpacing=0 cellPadding=15 width="100%" background=图片地址 border=0> <TBODY> <TR> <TD width="100%"> <TABLE cellSpacing=10 borderColorDark=#001a1a cellPadding=0 width="100%" borderColorLight=#055b56 background=图片地址 border=0> <TBODY> <TR>
<TD>（此处插入主文）</TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE> 蓝色部分是结尾，
其中：border =边框粗细 width= 边框宽度 height =边框高度 cellspacing=单元格间距 cellpadding=边框间距 borderColor=边框颜色 background =插入的背景（这几个格式你可要背过了啊，如果也和我一样记忆力不好，可以复制到你的文件夹里）
下面是帖子内容的基本格式（这些您可要记住了，如记忆力不好，可复制到文件夹里）

1、贴图片格式（支持jpg、gif等格式），红色代码是图片居中命令：
<psrc="./images/smilies/titter.gif" border=0 smilieid="220419"> align=center> <IMG src="内容图片地址">
2、贴普通字体格式，蓝色代码为字的颜色、红色代码为字的大小（最大为了7，最小为1），其他运动字体的格式，另行讲解：
<CENTER>color=#e4dc9b size=4>妖魔鬼怪论坛</CENTER>
3、贴FLASH格式（红色代码分别是宽度与高度）：
<EMBED pluginspage=http://www.macromedia.com/go/getflashplayer src=FLASH地址 width=380 height=270 type=application/x-shockwave-flash quality="high" wmode="transparent"></EMBED>

烟，鬼魅青雾 2006-9-14 01:43

介绍三种flash 的代码

代码1（普通的flash的插入代码） 
<DIV class=quote><EMBED height=170 pluginspage=http://www.macromedia.com/go/getflashplayer src=地址 type=application/x-shockwave-flash width=330 wmode="transparent" quality="high"></EMBED></DIV>
代码2（无限制的flash的代码） 
<DIV class=quote><EMBED style="LEFT: 250px; WIDTH: 400px; POSITION: absolute; TOP: 900px; HEIGHT: 300px" align=right src=地址 width=400 height=300 type=application/octet-stream wmode="transparent" quality="high" ;;></EMBED> </DIV>
代码3（大型flash )
<DIV class=quote><TR><TD><EMBED style="LEFT: 50px; WIDTH: 850px; POSITION: absolute; TOP: 10px; HEIGHT: 1500px" align=right src=地址 width=500 height=1500 type=application/octet-stream wmode="transparent" quality="high" ;;></EMBED></TD> </DIV>
代码4（双层flash的代码） 
<DIV class=quote><EMBED align=right src=地址 width=420 height=350 type=application/octet-stream wmode="transparent" quality="high"><EMBED align=right src=地址 width=420 height=350 type=application/octet-stream wmode="transparent" quality="high"> </DIV>

常用特效 1。透明 
<DIV class=quote>style="FILTER: Alpha(opacity=100,style=2)"</DIV>
2。倒影 
<DIV class=quote><IMG src="图片地址"><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="图片地址"></FONT></DIV>
3蝴蝶飞舞 
<DIV class=quote><MARQUEE behavior=alternate direction=up height=300 width=110><img src=http://bbs.mz99.com/UploadFile/2004-6/20046733350553.gif></MARQUEE><MARQUEE behavior=alternate direction=up height=250 width=110><img src=http://bbs.mz99.com/UploadFile/2004-6/20046733350553.gif></MARQUEE><MARQUEE behavior=alternate direction=up height=300 width=110><img src=http://bbs.mz99.com/UploadFile/2004-6/20046733350553.gif></MARQUEE><MARQUEE behavior=alternate direction=up height=250 width=110><img src=http://bbs.mz99.com/UploadFile/2004-6/20046733350553.gif></MARQUEE></DIV>

烟，鬼魅青雾 2006-9-14 01:50

图片加透明FDLASH格式：
<center><TABLE cellSpacing=2 cellPadding=2 border=10 bordercolor=#84B98D background=图片><TBODY><TD><EMBED src=透明网址 width=500 height=375 type=application/x-shockwave-flash quality="high" menu="false" wmode="transparent"></embed></table></center>
发贴前别忘了先点上<A href="http://jy.music.topzj.com/faq.php?page=misc#1" target=_blank>Discuz! 代码</A> 可用 
贴音乐格式（红色部分为播放器的大小，设置为0就隐藏了播放器）：
1.背景音乐（适合　mid wma等格式） <bgsound src=音乐网址 Loop=-1>
2.音频（适合MP3 WMA RM等很多格式） <embed src=网址 AutoStart=true Loop=true width=400 height=40
3.视频 <embed src=视频网址 type=audio/x-pn-realaudio-plugin controls=imagewindow,ControlPanel,StatusBar AutoStart=true Loop=true width=400 height=400>
说明：AutoStart=true　表示是否要音乐文件传送完就自动播放，TRUE是要，FALSE是不要，默认为true Loop=true　表示设定播放重复次数，LOOP=3表示重复3次，true表示无限次播放，FALSE播放一次即停止。 
 
</A>
1、红色部分是边框；
2、蓝色部分是内容；
3、黑色部分是结尾
4、紫色部分是音乐
<TABLE cellSpacing=15 cellPadding=0 width=570 background=http://222.186.123.12/yueming/UploadFile/2004-11/2004111720481551.jpg border=0> <TBODY> <TR> <TD width=520> <TABLE cellSpacing=10 cellPadding=0 width=520 background=http://gb.qjinfo.com/userfilepath/xiaotan/xiaotan007/cancaoparatifundo1.jpg border=0> <TBODY> <TR> <TD width=520> <TABLE cellSpacing=4 cellPadding=0 width=520 background=http://life121888.512j.com/index/GardenOfGoldstrip[1].jpg___200494123055106.jpg border=0> <TBODY> <TR> <TD width=520> <TABLE cellSpacing=10 cellPadding=0 background=http://gb.qjinfo.com/userfilepath/xiaotan/xiaotan007/cancaoparatifundo1.jpg border=0> <TBODY> <TR> <TD width=520> <TABLE cellSpacing=10 borderColorDark=#990000 cellPadding=0 width=520 borderColorLight=#cc0000 background=http://222.186.123.12/yueming/UploadFile/2004-11/2004111720481551.jpg border=1> <TBODY> <TR> <TD width=520> <TABLE cellSpacing=4 cellPadding=10 width=520 background=http://sbr0912.vicp.net/dvbbs/UploadFile/2004-12/2004123103319481.jpg border=0> <TBODY> <TR> <TD width=520 background=http://gb.qjinfo.com/userfilepath/xiaotan/xiaotan007/cancaoparatifundo1.jpg></TD> <TR> <TD width=520> <TABLE cellSpacing=0 cellPadding=0 width=520 background="" border=0> <TBODY> <TR> <TD> <palign=center><IMG src="http://www.616bbs.com/picture/xx9/ss2/373.gif"> <palign=center><IMG src="http://www.mtvbbs.com/UploadFile/2004-12/200412618938565.gif"> <palign=center><IMG src="http://tech.china.com/zh_cn/home4u/sucai/gifanimation/line/0025.gif"> <TABLE borderColor=#d2b48c height=230 cellSpacing=1 width=360 align=center background=http://www.mtvbbs.com/UploadFile/2004-12/2004126172826197.jpg border=8> <TBODY> <TR> <TD align=middle width="93%"><EMBED src=http://mtv.vicn.com/upload/2004482345353317.swf width=360 height=230 type=application/x-shockwave-flash wmode="transparent" menu="false" quality="high"></TD></TR></TBODY></TABLE> <palign=center><IMG src="http://sbr0912.vicp.net/dvbbs/UploadFile/2004-12/2004122145722665.gif"> <palign=center> <TABLE borderColor=#d2b48c height=400 cellSpacing=3 width=540 background=http://www.mtvbbs.com/UploadFile/2004-12/2004126172728883.jpg border=1> <TBODY> <TR> <TD align=middle width="93%"><EMBED src=http://favorites2003.vicp.net/picture/cl/2.swf width=540 height=400 type=application/x-shockwave-flash quality="high" menu="false" wmode="transparent"></TD></TR></TBODY></TABLE> <palign=center><IMG src="http://sbr0912.vicp.net/dvbbs/UploadFile/2004-12/2004122145722665.gif"> <palign=center> <TABLE borderColor=#d2b48c height=400 cellSpacing=3 width=540 align=center background=http://www.mtvbbs.com/UploadFile/2004-12/2004126172712268.jpg border=8> <TBODY> <TR> <TD align=middle width="95%"><EMBED src=http://imgfree.21cn.com/free/flash/4.swf width=540 height=400 type=application/x-shockwave-flash wmode="transparent" menu="false" quality="high"></TD></TR></TBODY></TABLE> <palign=center><IMG src="http://sbr0912.vicp.net/dvbbs/UploadFile/2004-12/2004122145722665.gif"> <palign=center> <TABLE borderColor=#d2b48c height=210 cellSpacing=3 width=540 align=center background=http://www.mtvbbs.com/UploadFile/2004-12/200412617271816.jpg border=8> <TBODY> <TR> <TD align=middle width="93%"><EMBED src=http://imgfree.21cn.com/free/flash/4.swf width=540 height=210 type=application/x-shockwave-flash wmode="transparent" menu="false" quality="high"></TD></TR></TBODY></TABLE> <palign=center><IMG src="http://tech.china.com/zh_cn/home4u/sucai/gifanimation/line/0025.gif"> <palign=center><IMG src="http://www.maoge.com.cn/bbs/UploadFile/2004-12/2004126164838195.gif"> <palign=center><IMG src="http://www.616bbs.com/picture/xx9/ss2/373.gif"></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE><EMBED src=http://mp3.baidu.com/u?u=http://www.mckxx.com/shaoxiandui/media/YWMJBPDg~wP0I-zm7wPwMuos6xxd9g3~K1sz.MP3 width=0 height=0 type=audio/mpeg Loop="true" AutoStart="true"> 
1、红色边框部分：
<TABLE cellSpacing=15 cellPadding=0 width=570 background=http://222.186.123.12/yueming/UploadFile/2004-11/2004111720481551.jpg border=0>
A、<TABLE =开始 <TABLE> =结尾（这两个是绝对格式，否则就成乱码了）
B、cellSpacing=15 =单元格间距（可以任意设置宽度）
C、cellPadding=0 =边框间距
D、width=570 =边框宽度
E、background =插入的背景格式
F、*<A href="http://222.186.123.12/yueming/UploadFile/2004-11/2004111720481551.jpg" target=_blank><A href="http://222.186.123.12/yueming/UploadFile/2004-11/2004111720481551.jpg" target=_blank>http://222.186.123.12/yueming/UploadFile/2004-11/2004111720481551.jpg</A></A>* =背景图片
G、border=0> = 边框粗细 
2、蓝色内容部分：
<TBODY> <TR> <TD> <palign=center><IMG src="http://www.616bbs.com/picture/xx9/ss2/373.gif"> <palign=center><IMG src="http://www.mtvbbs.com/UploadFile/2004-12/200412618938565.gif"> <palign=center><IMG src="http://tech.china.com/zh_cn/home4u/sucai/gifanimation/line/0025.gif"> <TABLE borderColor=#d2b48c height=230 cellSpacing=1 width=360 align=center background=http://www.mtvbbs.com/UploadFile/2004-12/2004126172826197.jpg border=8> <TBODY> <TR> <TD align=middle width="93%"><EMBED src=http://mtv.vicn.com/upload/2004482345353317.swf width=360 height=230 type=application/x-shockwave-flash wmode="transparent" menu="false" quality="high"></TD></TR></TBODY></TABLE>
A、（过渡指令码，我们就这么叫吧）
<TBODY> <TR> <TD>
B、（分隔线图片、GIF图片）
<palign=center><IMG src="http://www.616bbs.com/picture/xx9/ss2/373.gif"> <palign=center><IMG src="http://www.mtvbbs.com/UploadFile/2004-12/200412618938565.gif">
C、背景图片
<TABLE borderColor=#d2b48c height=230 cellSpacing=1 width=360 align=center background=http://www.mtvbbs.com/UploadFile/2004-12/2004126172826197.jpg border=8>
D、单层FLASH
<TBODY> <TR> <TD align=middle width="93%"><EMBED src=http://mtv.vicn.com/upload/2004482345353317.swf width=360 height=230 type=application/x-shockwave-flash wmode="transparent" menu="false" 
E、本单元结尾
</TD></TR></TBODY></TABLE> 
3、黑色结尾部分（略，可系统自动结尾）
</TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>
4、紫色音乐部分：
<EMBED src=http://mp3.baidu.com/u?u=http://www.mckxx.com/shaoxiandui/media/YWMJBPDg~wP0I-zm7wPwMuos6xxd9g3~K1sz.MP3 width=0 height=0 type=audio/mpeg Loop="true" AutoStart="true">
A、<EMBED src= =开始
B、音乐地址：
<A href="http://mp3.baidu.com/u?u=http://www.mckxx.com/shaoxiandui/media/YWMJBPDg~wP0I-zm7wPwMuos6xxd9g3~K1sz.MP3" target=_blank><A href="http://mp3.baidu.com/u?u=http://www.mckxx.com/shaoxiandui/media/YWMJBPDg~wP0I-zm7wPwMuos6xxd9g3~K1sz.MP3" target=_blank>http://mp3.baidu.com/u?u=http://www.mckxx.com/shaoxiandui/media/YWMJBPDg~wP0I-zm7wPwMuos6xxd9g3~K1sz.MP3</A></A>
C、播放器大小（隐藏格式）
width=0 height=0
D、自动重复播放格式
type=audio/mpeg Loop="true" AutoStart="true">

红的指尖缘 2006-9-19 17:32

唉,今天把这资料复下来可累死我了,不知什么时候能学会????
:L :L :L :L :L :L :L :L :L

好多年没看英文字,看得我晕呢~~~~

大老爷 2006-9-20 19:10

加油，你一定行的！

妖魔鬼怪 2007-9-23 11:59

好东西,就是太晕眼睛.

残月如昨 2007-11-5 22:15

眼花加头晕......

页: [1]

查看完整版本: ★[HTML转帖]从零开始学HTML语言音画制做★