| 可打印版本 | 推薦給朋友 | 訂閱主題 | 收藏主題 | 上一主題 | 下一主題 |

     
21 X [ 查看 [Thank You!] 名單 ]
標題: [關閉主題] [自SEED] [教學] 音畫貼入門教程,
 
jmepp UID 739585
等級 120城主祕書
職業

總分 5063
積分 5034
金幣 5725
貼子 2977
支持 2519
狀態 離線

閱讀權限 120
註冊日期 2006-12-16
上次訪問 2014-06-19
最後發表 2012-05-15
查看資料 發短訊息 Blog 頂部
NO:1 2008-05-27 00:06 [ 放大字體 ] [ 總評: 積分 +50 ]

[自SEED] [教學] 音畫貼入門教程



18P2P 音画贴入门教程

第一课

(制作边框与加入背景图)


效果:


参数注解

表格边框颜色:bordercolor=#cccccc
表格的底色:bgcolor=#000000
表格格线的厚度:cellspacing=30
表格格线内厚度:cellPadding=0
加入背景图片:background="背景图片网址"
表格宽度:width="100%" 接受绝对值(如800)及相对值(100%)
表格边框的厚度:border=0
表格的摆放位置:align="center" 可选值为:左: left, 右: right, 居中: center
表格结尾:</TD></TR></TBODY></TABLE> 注意:前面用了多少<TBODY><TR><TD>后面就必需有多少个</TD></TR></TBODY></TABLE>多一个或少一个都会出错的!!
本示范贴还没用到的两个重要参数:
表格边框向光部分的颜色:bordercolorlight=#00FF00
表格边框背光部分的颜色:bordercolordark=#00FFFF 使用 bordercolorlight 或 bordercolordark 时 bordercolor 将会失效


一层边框:

代码:

<TABLE borderColor=#cccccc cellSpacing=30 cellPadding=0 width="100%" align=center background=http://freett.com/yhss/images/Stars.gif border=0><TBODY><TR><TD></TD></TR></TBODY></TABLE>

二层边框:

代码:
<TABLE borderColor=#cccccc cellSpacing=30 cellPadding=0 width="100%" align=center background=http://freett.com/yhss/images/Stars.gif border=0><TBODY><TR><TD>
<TABLE borderColor=#cccccc cellSpacing=25 cellPadding=0 width="100%" align=center background=http://www.spiritisup.com/inxgrad2.jpg border=0><TBODY><TR><TD></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>


三层边框:

代码:
<TABLE borderColor=#cccccc cellSpacing=30 cellPadding=0 width="100%" align=center background=http://freett.com/yhss/images/Stars.gif border=0>
<TBODY><TR><TD>
<TABLE borderColor=#cccccc cellSpacing=25 cellPadding=0 width="100%" align=center background=http://www.spiritisup.com/inxgrad2.jpg border=0><TBODY><TR><TD>
<TABLE borderColor=#00b3e8 cellSpacing=3 cellPadding=0 width="100%" bgColor=#000000 align=center border=1><TBODY><TR><TD></TD></TR></TBODY></TABLE>
</TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>

加入背景图片:

代码:
<TABLE borderColor=#cccccc cellSpacing=30 cellPadding=0 width="500" align=center background=http://freett.com/yhss/images/Stars.gif border=0><TBODY><TR><TD>
<TABLE borderColor=#cccccc cellSpacing=25 cellPadding=0 width="100%" align=center background=http://www.spiritisup.com/inxgrad2.jpg border=0><TBODY><TR><TD>
<TABLE borderColor=#00b3e8 cellSpacing=3 cellPadding=0 width="100%" bgColor=#000000 align=center border=1>
<TBODY><TR><TD>
<TABLE borderColor=#cccccc cellSpacing=0 cellPadding=0 width="500" height=428 align=center background=http://www.hq0517.com/vip/img/tshi.jpg border=0><TBODY><TR><TD></TD></TR></TBODY></TABLE>
</TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>


提示:
因为背景图width="500" ,所以将第一层的width="100%" 改为绝对值"500"来控制贴子的大小


本课完毕,本人水平有限,如有不对之处,请老师指正!

18P2P JMEPP 制作






18P2P 音画贴入门教程

第二课

(插入FLASH)


效果:


代码:
<EMBED src=http://yhss.es.land.to/469.swf width=500 height=428 type=application/x-shockwave-flash wmode="transparent" quality="high"></EMBED>

注解:
以图片为背景方式的插入FLASH,会受到背景限制,FLASH的宽度和高度必须等于或小于背景图片的宽度和高度,否则背景会变形!


效果:

代码:
<EMBED style="LEFT: 190px; WIDTH: 450px; POSITION: absolute; TOP: 1335px; HEIGHT: 350px" align=right src=http://yhss.es.land.to/046.swf type=application/octet-stream quality="high" wmode="transparent"></EMBED>

注解:
以定位方式插入FLASH,不受背景限制,随心所欲,TOP: 1335px 是指FLASH与帖子上边之间的距离(也就是FLASH与IE的距离),LEFT: 190px 是指FLASH与帖子左边的距离,WIDTH: 450px HEIGHT: 350px是指FLASH宽度和高度。


全贴代码:
<TABLE borderColor=#cccccc cellSpacing=30 cellPadding=0 width="500" align=center background=http://freett.com/yhss/images/Stars.gif border=0><TBODY><TR><TD>
<TABLE borderColor=#cccccc cellSpacing=25 cellPadding=0 width="100%" align=center background=http://www.spiritisup.com/inxgrad2.jpg border=0><TBODY><TR><TD>
<TABLE borderColor=#00b3e8 cellSpacing=3 cellPadding=0 width="100%" bgColor=#000000 align=center border=1><TBODY><TR><TD>
<TABLE borderColor=#cccccc cellSpacing=0 cellPadding=0 width="500" height=428 align=center background=http://www.hq0517.com/vip/img/tshi.jpg border=0><TBODY><TR><TD>
<EMBED src=http://yhss.es.land.to/469.swf width=500 height=428 type=application/x-shockwave-flash wmode="transparent" quality="high"></EMBED></TD></TR></TBODY></TABLE>
<EMBED style="LEFT: 190px; WIDTH: 450px; POSITION: absolute; TOP: 1335px; HEIGHT: 350px" align=right src=http://yhss.es.land.to/046.swf type=application/octet-stream quality="high" wmode="transparent"></EMBED></TD></TR></TBODY></TABLE>
</TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>


本课完毕

18P2P JMEPP 制作





18P2P 音画贴入门教程

第三课

(加入文字)


效果:


18P2P音画时尚版热烈
各位朋友的到来
我们的宗旨是:
“音与画的完美集合、视与听的最佳感受”
为您提供欣赏音乐的最佳交互平台!






It All Begins With Love


文字移动代码:
<MARQUEE scrollAmount=1 scrollDelay=100 direction=up width=400 height=250><P align=center><FONT style="FONT-SIZE: 12pt" face=宋体 color=#FF00FF>18P2P音画时尚版热烈<BR>各位朋友的到来<BR>我们的宗旨是:<BR>“音与画的完美集合、视与听的最佳感受”
为您提供欣赏音乐的最佳交互平台!</FONT></P></MARQUEE>


移动注解:
direction=移动方向 可选值为向上(up),向下(down),向左(left),向右(right)
behavior=移动方式 scroll 一圈一圈绕着走,slide 只走一次,behavior=alternate 来回走
scrolldelay=速度 scrollamount=位移
width=宽度 height=高度
上面的参数大家可以根据不同的情况自行调节

文字注解:
<FONT color=#CFCF88 face=华文行楷 size=5>插入文字</FONT>
face=字体 size=字体大小,这里的最大值为7 取值越大文字就越大,color=颜色代码
另一种贴法:
<FONT style="FONT-SIZE: 12pt" face=宋体 color=#ffff00>插入文字</FONT>,FONT-SIZE:数值越大文字就越大


全贴代码:
<TABLE borderColor=#cccccc cellSpacing=30 cellPadding=0 width="500" align=center background=http://freett.com/yhss/images/Stars.gif border=0><TBODY><TR><TD>
<TABLE borderColor=#cccccc cellSpacing=25 cellPadding=0 width="100%" align=center background=http://www.spiritisup.com/inxgrad2.jpg border=0><TBODY><TR><TD>
<TABLE borderColor=#00b3e8 cellSpacing=3 cellPadding=0 width="100%" bgColor=#000000 align=center border=1><TBODY><TR><TD>
<TABLE borderColor=#cccccc cellSpacing=20 cellPadding=0 width="500" height=428 align=center background=http://www.hq0517.com/vip/img/tshi.jpg border=0><TBODY><TR><TD>
<BR><BR><P align=center><MARQUEE scrollAmount=1 scrollDelay=100 direction=up width=400 height=250><P align=center><FONT style="FONT-SIZE: 12pt" face=宋体 color=#FF00FF><B>18P2P音画时尚版热烈<BR>各位朋友的到来<BR>我们的宗旨是:<BR>“音与画的完美集合、视与听的最佳感受”<BR>为您提供欣赏音乐的最佳交互平台!</B><BR><BR><BR></FONT></MARQUEE><BR><BR><BR><FONT style="FONT-SIZE: 20pt; FILTER: shadow(color=black); WIDTH: 100%; COLOR: #e6bd1a; LINE-HEIGHT: 150%; FONT-FAMILY: 黑体"><B>It All Begins With Love</B></FONT></TD></TR></TBODY></TABLE>
</TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>
</TD></TR></TBODY></TABLE>

不同的移动组合就有不同的效果,可以讲是变化多端,文字的种类也非常多,请参考论坛的教程和示范,在这就不多介绍。(或者抽时间再补充也行)
本课完毕

18P2P JMEPP制作





18P2P 音画贴入门教程

第四课

(在FLASH上加文字与加入播放器)


18P2P音画时尚版热烈
各位朋友的到来
我们的宗旨是:
“音与画的完美集合、视与听的最佳感受”
为您提供欣赏音乐的最佳交互平台!



It All Begins With Love

代码:
<DIV id=layer2 style="Z-INDEX: 2; LEFT: 300px; WIDTH: 400px; POSITION: absolute; TOP: 470px; HEIGHT: 250px">
<MARQUEE scrollAmount=1 scrollDelay=100 direction=up width=400 height=250><P align=center><FONT style="FONT-SIZE: 12pt" face=宋体 color=#FF00FF>18P2P音画时尚版热烈<BR>各位朋友的到来<BR>我们的宗旨是:<BR>“音与画的完美集合、视与听的最佳感受”<BR>为您提供欣赏音乐的最佳交互平台!</FONT></MARQUEE></DIV>


<DIV id=layer2 style="Z-INDEX: 2; LEFT: 300px; WIDTH: 400px; POSITION: absolute; TOP: 760px; HEIGHT: 50px">
<FONT style="FONT-SIZE: 20pt; FILTER: shadow(color=black); WIDTH: 100%; COLOR: #e6bd1a; LINE-HEIGHT: 150%; FONT-FAMILY: 黑体">It All Begins With Love </FONT></DIV>


参数注解如同定位FLASH


播放器代码:
<EMBED style="FILTER: invert(); WIDTH: 300px; HEIGHT: 24px" src=http://www.mjbox.com/r/zs/zs888168/1.mp3 type=audio/x-ms-wma volume="0" loop="-1" autostart="true"></EMBED>



参数注解:
width="0" height="0" 表示隐藏播放器
type=audio/x-ms-wma 播放器支持的文件类型
loop="-1" 表示循环播放 可设置播放次数,用具体数字代替即可
autostart="true" true为自动播放,可设为手动播放"false"
为了贴子美观,已将播放器隐藏


全贴代码:
<TABLE borderColor=#cccccc cellSpacing=30 cellPadding=0 width="500" align=center background=http://freett.com/yhss/images/Stars.gif border=0><TBODY><TR><TD>
<TABLE borderColor=#cccccc cellSpacing=25 cellPadding=0 width="100%" align=center background=http://www.spiritisup.com/inxgrad2.jpg border=0><TBODY><TR><TD>
<TABLE borderColor=#00b3e8 cellSpacing=3 cellPadding=0 width="100%" bgColor=#000000 align=center border=1><TBODY><TR><TD>
<TABLE borderColor=#cccccc cellSpacing=0 cellPadding=0 width="500" height=428 align=center background=http://218.77.120.146:88/data1/36_data/data5/photos/41/62/47/946982.jpg border=0><TBODY><TR><TD>
<EMBED src=http://yhss.es.land.to/469.swf width=500 height=428 type=application/x-shockwave-flash wmode="transparent" quality="high"></EMBED></TD></TR></TBODY></TABLE>
<EMBED style="LEFT: 230px; WIDTH: 400px; POSITION: absolute; TOP: 490px; HEIGHT: 350px" align=right src=http://yhss.es.land.to/046.swf type=application/octet-stream quality="high" wmode="transparent"></EMBED>
<DIV id=layer2 style="Z-INDEX: 2; LEFT: 300px; WIDTH: 400px; POSITION: absolute; TOP: 470px; HEIGHT: 250px"><MARQUEE scrollAmount=1 scrollDelay=100 direction=up width=400 height=250><P align=center><FONT style="FONT-SIZE: 12pt" face=宋体 color=#FF00FF><B>18P2P音画时尚版热烈<BR>各位朋友的到来<BR>我们的宗旨是:<BR>“音与画的完美集合、视与听的最佳感受”<BR>为您提供欣赏音乐的最佳交互平台!</B><BR><BR><BR></FONT></MARQUEE></DIV>
<DIV id=layer2 style="Z-INDEX: 2; LEFT: 330px; WIDTH: 400px; POSITION: absolute; TOP: 760px; HEIGHT: 50px"><FONT style="FONT-SIZE: 20pt; FILTER: shadow(color=black); WIDTH: 100%; COLOR: #e6bd1a; LINE-HEIGHT: 150%; FONT-FAMILY: 黑体"><B>It All Begins With Love </B></FONT></DIV>
</TD></TR></TBODY></TABLE><EMBED style="FILTER: invert(); WIDTH: 0px; HEIGHT: 0px" src=http://www.mjbox.com/r/zs/zs888168/1.mp3 type=audio/x-ms-wma volume="0" loop="-1" autostart="true">
</EMBED></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>

本课完毕

18P2P JMEPP 制作





18P2P 音画贴入门教程

第五课

(发贴)


18P2P音画时尚版热烈
各位朋友的到来
我们的宗旨是:
“音与画的完美集合、视与听的最佳感受”
为您提供欣赏音乐的最佳交互平台!



It All Begins With Love

添加全屏代码:
<TABLE style="LEFT: 0px; POSITION: relative; TOP: 50px" WIDTH: 500px><TBODY><TR><TD></TD></TR></TBODY></TABLE>

参数注解:
LEFT: 0px 是指帖子与左边的距离
TOP: 50px 是指帖子与上边之间的距离
WIDTH: 500px 是指贴子宽度
参数根据不同的情况自行调节


全贴代码:
<TABLE style="LEFT: 0px; POSITION: relative; TOP: 50px" WIDTH: 500px><TBODY><TR><TD>
<TABLE borderColor=#cccccc cellSpacing=30 cellPadding=0 width="500"
align=center background=http://freett.com/yhss/images/Stars.gif border=0><TBODY><TR><TD>
<TABLE borderColor=#cccccc cellSpacing=25 cellPadding=0 width="100%"
align=center background=http://www.spiritisup.com/inxgrad2.jpg border=0><TBODY><TR><TD>
<TABLE borderColor=#00b3e8 cellSpacing=3 cellPadding=0 width="100%" bgColor=#000000 align=center border=1><TBODY><TR><TD>
<TABLE borderColor=#cccccc cellSpacing=0 cellPadding=0 width="500" height=428 align=center background=http://www.hq0517.com/vip/img/tshi.jpg border=0><TBODY><TR><TD>
<EMBED src=http://yhss.es.land.to/469.swf width=500 height=428 type=application/x-shockwave-flash wmode="transparent" quality="high"></EMBED></TD></TR></TBODY></TABLE>
<EMBED style="LEFT: 230px; WIDTH: 400px; POSITION: absolute; TOP: 490px; HEIGHT: 350px" align=right src=http://yhss.es.land.to/046.swf type=application/octet-stream quality="high" wmode="transparent"></EMBED>
<DIV id=layer2 style="Z-INDEX: 2; LEFT: 300px; WIDTH: 400px; POSITION: absolute; TOP: 470px; HEIGHT: 250px"><MARQUEE scrollAmount=1 scrollDelay=100 direction=up width=400 height=250><P align=center><FONT style="FONT-SIZE: 12pt" face=宋体 color=#FF00FF><B>18P2P音画时尚版热烈<BR>各位朋友的到来<BR>我们的宗旨是:<BR>“音与画的完美集合、视与听的最佳感受”<BR>为您提供欣赏音乐的最佳交互平台!</B><BR><BR><BR></FONT></MARQUEE></DIV>
<DIV id=layer2 style="Z-INDEX: 2; LEFT: 330px; WIDTH: 400px; POSITION: absolute; TOP: 760px; HEIGHT: 50px"><FONT style="FONT-SIZE: 20pt; FILTER: shadow(color=black); WIDTH: 100%; COLOR: #e6bd1a; LINE-HEIGHT: 150%; FONT-FAMILY: 黑体"><B>It All Begins With Love </B></FONT></DIV>
</TD></TR></TBODY></TABLE><EMBED style="FILTER: invert(); WIDTH: 0px; HEIGHT: 0px" src=http://www.mjbox.com/r/zs/zs888168/1.mp3 type=audio/x-ms-wma volume="0" loop="-1" autostart="true">
</EMBED></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE> 如果贴子位置太低加上几个<BR><BR><BR><BR><BR>

注意:
如果贴子里面涉及到定位代码,为了预览跟发出去的效果一致,必须添加全屏代码,而且定位代码一定要在主框架里,(即不能放到最尾端的</TD></TR></TBODY></TABLE>之外),因为我们预览的定位是贴子里的定位,如果没有前面的工夫,我们发出去的就是IE的定位啦,到时你不要说我的FLASH跑到那里了,哈哈,找了一下,原来在IE上面!注意:在本版区发贴一定要将代码紧凑排列,否则会强制换行,贴子就会失去原有的效果!


图片、音乐、FLASH上传常用空间:

在线编辑器1:点击

在线编辑器2:点击

5460 空间:点击

yupoo 空间:点击

m8空间:点击

woyo空间:点击



以上内容,其实教程还谈不上,只是介绍一下本人制作贴子的经过,结合版区其它教程,希望能为音画爱好的新手帮上一点小忙!其待你们发挥自己的创作能力,制作出更多更优秀的自己音画作品!你的分享就是大家的快乐,请多多支持18P2P音画时尚版!


18P2P JMEPP 制作






[ 本貼最後由 cctv00000 於 2012-07-31 23:12 編輯 ]

jmepp UID 739585
等級 120城主祕書
職業

總分 5063
積分 5034
金幣 5725
貼子 2977
支持 2519
狀態 離線

閱讀權限 120
註冊日期 2006-12-16
上次訪問 2014-06-19
最後發表 2012-05-15
查看資料 發短訊息 Blog 頂部
NO:2 2008-05-27 00:08 [ 放大字體 ]



实战贴

18P2P音画时尚版热烈
各位朋友的到来
我们的宗旨是:
“音与画的完美集合、视与听的最佳感受”
为您提供欣赏音乐的最佳交互平台!



It All Begins With Love



代码:
<TABLE style="LEFT: 0px; POSITION: relative; TOP: 50px" WIDTH: 500px><TBODY><TR><TD><TABLE borderColor=#cccccc cellSpacing=30 cellPadding=0 width="500" align=center background=http://freett.com/yhss/images/Stars.gif border=0><TBODY><TR><TD><TABLE borderColor=#cccccc cellSpacing=25 cellPadding=0 width="100%" align=center background=http://www.spiritisup.com/inxgrad2.jpg border=0><TBODY><TR><TD><TABLE borderColor=#00b3e8 cellSpacing=3 cellPadding=0 width="100%" bgColor=#000000 align=center border=1><TBODY><TR><TD><TABLE borderColor=#cccccc cellSpacing=0 cellPadding=0 width="500" height=428 align=center background=http://www.hq0517.com/vip/img/tshi.jpg border=0><TBODY><TR><TD><EMBED src=http://yhss.es.land.to/469.swf width=500 height=428 type=application/x-shockwave-flash wmode="transparent" quality="high"></EMBED></TD></TR></TBODY></TABLE><EMBED style="LEFT: 10px; WIDTH: 450px; POSITION: absolute; TOP: 140px; HEIGHT: 350px" align=right src=http://yhss.es.land.to/046.swf type=application/octet-stream quality="high" wmode="transparent"></EMBED><DIV id=layer2 style="Z-INDEX: 2; LEFT: 100px; WIDTH: 400px; POSITION: absolute; TOP: 160px; HEIGHT: 250px"><MARQUEE scrollAmount=1 scrollDelay=100 direction=up width=400 height=250><P align=center><FONT style="FONT-SIZE: 12pt" face=宋体 color=#FF00FF><B>18P2P音画时尚版热烈<BR>各位朋友的到来<BR>我们的宗旨是:<BR>“音与画的完美集合、视与听的最佳感受”<BR>为您提供欣赏音乐的最佳交互平台!</B><BR><BR><BR></FONT></MARQUEE></DIV><DIV id=layer2 style="Z-INDEX: 2; LEFT: 130px; WIDTH: 400px; POSITION: absolute; TOP: 420px; HEIGHT: 50px"><FONT style="FONT-SIZE: 20pt; FILTER: shadow(color=black); WIDTH: 100%; COLOR: #e6bd1a; LINE-HEIGHT: 150%; FONT-FAMILY: 黑体"><B>It All Begins With Love</B></FONT></DIV></TD></TR></TBODY></TABLE><EMBED style="FILTER: invert(); WIDTH: 0px; HEIGHT: 0px" src=http://www.mjbox.com/r/zs/zs888168/1.mp3 type=audio/x-ms-wma volume="0" loop="-1" autostart="true"></EMBED></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE><BR><BR><BR>


[ 本貼最後由 cctv00000 於 2012-07-31 23:15 編輯 ]

     



Powered by UNetBoard 4.9.12 RTM © 2000-2006. Design & Mend by AndyGod. (Kernel by Discuz!)
處理需時 0.028729 秒, 查詢 6 次 , Gzip 壓縮 ( Cookies 錯誤解決方法 )
所有時間為 GMT+8, 現在時間是 2019-09-21 12:33 繁體中文 - 清除 Cookies - 聯繫我們 - 18P2P-Forum - 純文字版