PS: 斑竹们，我不知道选用什么分类标签，又非填不可，所以就瞎选[轻音乐]了，抱歉。

 

 

 

套用代码中涉及最基本的边框 + 图片 + 文字 +透明flash + 音乐播放器+以及左移全屏代码，并分解说明他们的替换变化。

 

特别提醒：要使用代码，在编辑状态下，先把左边的 <禁用 URL 识别> <禁用 Smilies> <启用HTML>都打勾，然后在discuz代码模式中输入代码。 输入后，点击<所见即所得>切换。这时候你能看到效果了。

[ 本帖最后由 秋水长空 于 2007-8-17 10:11 编辑 ]

套用代码如下：

<TABLE id=table1 style="LEFT: -10px; WIDTH: 700px; POSITION: relative" borderColor=#993366 height=600 width=700 background=http://pic.hualongxiang.com/attachments/day_070807/20070807_c0e74c95a5cb54395c6cWDpnqDxVgX5Z.jpg border=7>
<TBODY>
<TR><EMBED style="LEFT: 40px; POSITION: absolute; TOP: 8px" align=left src=http://www.dabaoku.com/flash/flash/39.swf width=600 height=450 type=application/octet-stream wmode="transparent" quality="high" ;;></EMBED>
<TD>
<MARQUEE style="WIDTH: 275px; HEIGHT: 332px" scrollAmount=1 direction=up>
<P><FONT color=white size=2>     不要说<BR>     也不要问<BR>     目光交错的一瞬<BR>     就注定了今生缘分<BR>     此情可以见真心<BR>     春风急<BR>     秋风也<BR>     狠乱乱纷纷是红尘<BR>     浮浮沉沉似幻似真<BR>     金枝玉叶的结局也只是<BR>     飘 随风不停<BR>     心难平静 <BR>     灿烂不过梦境<BR>     翻手是云<BR>     覆手是风<BR>     却难握住几份真情<BR>     飘 飘浮不停<BR>     人似浮萍<BR>     真爱不过飘零<BR>     落花有情<BR>     流水无情<BR>     沧桑之后是真情</FONT></P>
<P><BR><FONT color=white size=2>     爱难舍情<BR>     更难分<BR>     一意怎能够孤行<BR>     分分秒秒<BR>     难舍难分<BR>     追逐真爱的结局也只是<BR>     飘 随风不停<BR>     心难平静灿烂不过梦境<BR>     翻手是云<BR>     覆手是风<BR>     却难握住几份真情<BR>     飘 飘浮不停<BR>     人似浮萍真爱不过飘零<BR>     风也飘零雨也飘零<BR>     难忘今生伴我行</FONT></P></MARQUEE>
<P> </P>
<P> </P>
<P> </P>
<P> </P>
<P> </P>
<P> </P>
<P> </P>
<P> </P>
<P>        <EMBED style="FILTER: Alpha(opacity=100,style=2); WIDTH: 125px; HEIGHT: 35px" align=left src=http://music0.hexun.com/Save/Music/2006/0820/339/M_A9CC4889C0D58F5D.WMA width=125 height=35 type=application/octet-stream loop="1" autostart="true" ALGIN="MIDDLE"></EMBED></P>
<P> </P>
<P> </P>
<P> </P>
<P> </P></TD></TR></TBODY></TABLE>

 

 

 

效果如下：

不要说      也不要问      目光交错的一瞬      就注定了今生缘分      此情可以见真心      春风急      秋风也      狠乱乱纷纷是红尘      浮浮沉沉似幻似真      金枝玉叶的结局也只是      飘 随风不停      心难平静      灿烂不过梦境      翻手是云      覆手是风      却难握住几份真情      飘 飘浮不停      人似浮萍      真爱不过飘零      落花有情      流水无情      沧桑之后是真情      爱难舍情      更难分      一意怎能够孤行      分分秒秒      难舍难分      追逐真爱的结局也只是      飘 随风不停      心难平静灿烂不过梦境      翻手是云      覆手是风      却难握住几份真情      飘 飘浮不停      人似浮萍真爱不过飘零      风也飘零雨也飘零      难忘今生伴我行

[ 本帖最后由 秋水长空 于 2008-9-1 10:29 编辑 ]

 

分解说明：左移全屏幕代码（代码中蓝色字体）

 id=table1 style="LEFT: -10px; WIDTH: 700px; POSITION: relative"

此代码的作用：

一般来说，在hualongxiang上面，由于有左边导航条和个人资料栏，所以占用了左边部分叶面，再在右边做帖的话，其音画帖子用的画面图片宽度值不宜超过720。 否则有部分不全立马显示在视觉中，需要关闭左边导航条或者用鼠标拖动IE底部的横向滚动条察看到。  此左移全屏代码可以使叶面左移覆盖在个人资料栏占用的叶面上。 我公布的代码中LEFT: -10px只是左移了-10个单位。 如果改成LEFT: 0px就表示一点也没左移。 如果改成LEFT: -150px后 你们看看效果就知道了用处了。

 

 

分解说明：图片替换

就是把图片地址换成你自己需要的图片，很简单的，就不说了

地址就是background=代码后面的jpg文件地址。

我选用的图片是宽度700高度600的，你们选用的图片要看一下属性里面的尺寸大小，然后把

height=600 width=700 里面的宽度高度参数换成自选图片一致的尺寸参数。

另外请注意，同时要换掉蓝色字体左移全屏代码中的WIDTH:后面的宽度参数值，也要和图片一致。

 

另外，建议选用的图片宽度不要超过750。 如果太大的，就用PS处理一下改小尺寸。

 

分解说明：边框的线条粗细 和 颜色变化：

borderColor=#993366 表示边框的颜色，替换颜色参数请参阅我以前制作帖里的色号表

border=7 表示边框的粗细值。自己换成20看看就知道了。 如果你选用的底图本身就有了边框，再用html代码加上边框后会比较难看，那么很容易，把border=7改成border=0就行了。

 

以上的边框是最简单的边框，看到很多花哨的(套层)边框，这需要自己收集边框代码，收集方式在后后面楼层讲解。

[ 本帖最后由 秋水长空 于 2007-8-7 14:21 编辑 ]

分解说明：添加透明flash效果

 

如代码中红色字体部分

<EMBED style="LEFT: 40px; POSITION: absolute; TOP: 8px" align=left src=http://www.dabaoku.com/flash/flash/39.swf width=600 height=450 type=application/octet-stream wmode="transparent" quality="high" ;;>

 

LEFT: 40px 是flash在帖面上出现的左边的定位位置

TOP: 8px 是flash在帖面上出现的顶部的定位位置

这就可以设定falsh的定位位置了。 读者试验时候把这2个参数值随意改改看看效果（看效果不非要发表帖子，点编辑界面下的<预览帖子>按钮就可以了。记住这个功能，很有用）

 

width=600 height=450 是flash显示区域的大小，宽度和高度设定了后flash面积盖住的区域就设好了。试验时候自己改动参数看看就明白了。

 

用以上4各参数就可以随意定位falsh位置和大小了。

 

扩展说明：

有时候你们看到叶面上有多个falsh效果，其实就是添加了2个或者3个或者更多的falsh. 很简单只要复制falsh代码重复进去，如：

<EMBED style="LEFT: 40px; POSITION: absolute; TOP: 8px" align=left src=http://www.dabaoku.com/flash/flash/39.swf width=600 height=450 type=application/octet-stream wmode="transparent" quality="high" ;;><EMBED style="LEFT: 40px; POSITION: absolute; TOP: 8px" align=left src=http://www.dabaoku.com/flash/flash/39.swf width=600 height=450 type=application/octet-stream wmode="transparent" quality="high" ;;>

需要第3个就再复制插入一遍。

 

注意：插入后把第2个flash换一下（就是swf格式文件的地址）。我复制时候地址都一样的。 同时注意，我复制的定位位置和宽度高度参数都一样，你想错开显示在叶面的不同位置，就去改上面说的那4个参数值。 一边改参数，改好了就按钮<预览帖子>看看，不行再改，再看。

 

如下提供一些透明flash素材的网址供大家使用：

 

http://bbs.hualongxiang.com/thread-3874686-1-1.html

 

http://hi.baidu.com/kxyhj66/blog/item/94360af7553f3523720eece1.html

 

http://www.wrjy.com.cn/bbs/viewthread.php?tid=6359&extra=&page=4

 

http://www.wzsj-home.com/flash-sc/touming-flash/flash.htm

 

http://www.hebeimusic.com/viewthread.php?tid=46218

 

 

 

[ 本帖最后由 秋水长空 于 2007-8-17 17:22 编辑 ]

分解说明：文字添加

最简单的文字添加办法是直接把文字做在图片上，缺点是不会动。 优点是安装字库后，PS时候字库里面有很多好看的文字样式，活泼，能和画面浑然一体。

 

公布的代码中的移动字幕（绿色字体部分,MARQUEE 代码段落）也是最简单的一种。

style="WIDTH: 275px; HEIGHT: 332px" scrollAmount=1 direction=up

 

WIDTH: 275px; HEIGHT: 332px指字幕区域的面积宽/高尺寸。

 

scrollAmount=1 是滚动速度参数，一般不要去改这个。如果想滚动时候慢点停顿些的话，插入scrolldelay=120或者scrolldelay=150。如这样style="WIDTH: 275px; HEIGHT: 332px" scrollAmount=1 scrolldelay=150 direction=up

 

direction=up 指文字方向，向上

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

我重点说明关于文字不从代码中修改的偷懒方法：

 

首先在编辑界面的上部，大家能看到<Discuz!代码模式>和<所见即所得模式>，当你复制了我2楼公布的代码输入后，其实就是在<Discuz!代码模式>编辑状态下；此时再按<所见即所得模式>按钮，就切换到了可视直观效果状态下。 当然，你会发现，在<所见即所得模式>编辑界面上的flash效果不出现，并且播放器也不是完全如2楼贴子里看起来一样。这只是因为没有发表，不在编辑状态下显示而已。这时候你按一下编辑界面下部的<预览贴子>就能看到全效果了。   

 

说到这里，我乘机说一下3个技巧：

1：是你在<所见即所得模式>编辑界面上随便什么地方点一下，然后Ctrl+A(就是键盘全选操作),这时候你能看见所有元素，比如字母区域，flash区域，写字空格区域，播放器位置。

2：第2个小技巧：在<Discuz!代码模式>状态下复制代码后，要想开始我此时说的在<所见即所得模式>中偷懒直观修改运用的话，先把左移全屏代码的参数LEFT=-10归零，让LEFT=0   等其他参数全部改好后发表贴子前再切换到<Discuz!代码模式>下去改左移全屏代码的参数。

3：在<Discuz!代码模式>编辑状态下可以使用常规的右键选定复制功能，但是在<所见即所得模式>中就没法那样复制，必须用键盘的 Ctrl+C(就是复制).      至于粘贴，用鼠标右键 或者键盘Ctrl+V 在2种编辑状态下都可以的。

 

说完3个实用小技巧，我们继续。

在<所见即所得模式>编辑界面上， 我们来修改文字字幕的区域大小和字体+颜色。

 

字幕区域大小的修改：用鼠标去点文字区域所在的地方，当第一次点中文字区域时候，就出现了字幕的边界效果，犹如在word文档上的文本框。你可以用鼠标去拉伸字幕区域的边界，这样就可导致字幕区域高度和宽度的变化。 相当于傻瓜式的修改。

注意：我刚才说“当第一次点中文字区域时候”，是因为，经常falsh区域覆盖在文字区域上面（相当于上图层),你点的时候，应该是先点中flash区域，这你能看出来的。别着急，耐心的再点，直到点中文字区域 :-)

 

文字+字体+颜色的修改：  “当第一次点中文字区域时候”，你再点一下，就进入了文字修改层面，会发现鼠标停留进了文字中，这时候你全选Ctrl+A一下，删除原有文字，复制进去你自己要的文字。此时建议用Ctrl+C 和Ctrl+V的复制/粘贴 键盘操作功能。

文字改好后，继续刚才的选定文字部分，用编辑界面上部的按钮，比如文字大小，文字颜色，字体等按钮去修改。

 因为按钮键中文字的颜色很少，你要颜色可选多的话，切换到<Discuz!代码模式>，找到代码中文字颜色参数，用色号表里面的颜色参数去修改。

 

扩展说明 3点：

1。“当第一次点中文字区域时候”，出现了字幕的边界，你这会儿按删除键，就会把整个文字字幕区域全部删除。 就没有文字了，但是你可以粘贴复制进去其他的文字字幕形式。 我下面列2个和2楼不同的文字字幕格式。 要替换下面的文字字幕，用傻瓜直观方法如下：  再开一个备用编辑界面，把代码输入到<Discuz!代码模式>中，然后切换到<所见即所得模式>，点中直观的文字区域，Ctrl+C复制。   然后到主编辑界面上，用鼠标点到你刚才删除原有字幕格式的地方，注意阿，要点到看到鼠标在底图上出现书写文字鼠标闪动的时候，此时Ctrl+V粘贴上去就行了。

 

2。当你的字幕区域宽度高度超过底图的尺寸后，就会把底图扩展出去，造成重复性溢出。那么你就缩小字母区域的尺寸，用刚才字幕区域大小的修改所说的办法。

 

3。字幕区域在贴面上的靠左/靠右/居中：当第一次点中文字区域时候”，出现了字幕的边界，你可以使用编辑界面上部的靠左/靠右/居中 按钮功能键实现。 试试看 :-)

 

 

 

--------------以下供试验练习用的2个文字字幕格式代码和效果--------

 

格式1的代码：

<DIV style="PADDING-RIGHT: 5px; PADDING-LEFT: 5px; SCROLLBAR-FACE-COLOR: #000000; FILTER: chroma(color=#000000); PADDING-BOTTOM: 5px; MARGIN: 10px; SCROLLBAR-HIGHLIGHT-COLOR: #000000; OVERFLOW: auto; WIDTH: 284px; SCROLLBAR-SHADOW-COLOR: #d0d0d0; SCROLLBAR-ARROW-COLOR: #d0d0d0; PADDING-TOP: 5px; SCROLLBAR-TRACK-COLOR: #000000; SCROLLBAR-BASE-COLOR: #d0d0d0; HEIGHT: 323px; scrollbar-3d-light-color: #d0d0d0; scrollbar-dark-shadow-color: #d0d0d0"><FONT style="FONT-SIZE: 9pt; LINE-HEIGHT: 180%" face="arial bLACK" color=#d0d0d0>
<DIV align=center><FONT style="FONT-SIZE: 13pt; FILTER: glow(color=white,strength=2); WIDTH: 89.66%; COLOR: #482c1b; LINE-HEIGHT: 150%; FONT-FAMILY: comic sans ms; HEIGHT: 2214px"><STRONG><FONT face=宋体 size=3>这个冬天，我用寂寞舔噬伤口<BR>         By 可爱小妖</FONT></STRONG>
<P align=left><FONT face=楷体_GB2312 size=3>    </FONT><FONT face=楷体_GB2312 size=3>总以为，转了一圈，我又能回到原点，回到那个无欲无求无爱无痛的境地。可是突然发觉，心，却再也回不去了，明明感觉到了一丝失落，一点生疼。<BR>    完全高估了自己的承受能力，这个自己精心策划的情感游戏，最终，却没能让自己全身而退，还是会不自觉地想折回去寻找他的只字片语，一切只为证明，他确实真实地存在过。<BR>    轻轻地我走了，正如我轻轻地来。他甚至没有看到我跟他最后的道别。<BR>    很庆幸，也很感激他，在自己向世俗低头之前，我还能静静地，用</FONT></P></FONT></DIV></FONT></DIV>

 

格式1的效果：

这个冬天，我用寂寞舔噬伤口
         By 可爱小妖

    总以为，转了一圈，我又能回到原点，回到那个无欲无求无爱无痛的境地。可是突然发觉，心，却再也回不去了，明明感觉到了一丝失落，一点生疼。
    完全高估了自己的承受能力，这个自己精心策划的情感游戏，最终，却没能让自己全身而退，还是会不自觉地想折回去寻找他的只字片语，一切只为证明，他确实真实地存在过。
    轻轻地我走了，正如我轻轻地来。他甚至没有看到我跟他最后的道别。
    很庆幸，也很感激他，在自己向世俗低头之前，我还能静静地，用

 

 

 

格式2的代码：

<MARQUEE style="LINE-HEIGHT: 100%; TEXT-ALIGN: left" scrollAmount=1 scrollDelay=150 direction=up width=320 height=328><BR>
<DIV align=right>
<DIV style="FONT-SIZE: 13pt; FILTER: glow(color=#000000); WIDTH: 90%; COLOR: #ffffff; LINE-HEIGHT: 140%; FONT-FAMILY: 楷体_GB2312; HEIGHT: 1585px">
<P align=center><FONT size=4>如梦如念<BR></FONT><FONT size=2>          --- by 凌星小雨</FONT></P>
<P align=left> </P>
<P align=left><FONT size=2>阳光明媚。 <BR>喜欢这样充满阳光味道的气息来开头。如今。<BR><BR>似乎好久都没有把自己拿到阳光底下晒晒了，以至于总觉得有股发霉的气息逐渐向全身扩散，吞噬我的脑细胞，还侵袭着我的骨髓。尽管每天都在有阳光味道的被窝里入眠。只是不曾让我看到皎洁月光流淌下美丽的誓言，不曾让我拥抱彩色的梦。<BR></FONT></P></DIV></DIV></MARQUEE>

 

格式2的效果：

如梦如念
          --- by 凌星小雨

 

阳光明媚。
喜欢这样充满阳光味道的气息来开头。如今。

似乎好久都没有把自己拿到阳光底下晒晒了，以至于总觉得有股发霉的气息逐渐向全身扩散，吞噬我的脑细胞，还侵袭着我的骨髓。尽管每天都在有阳光味道的被窝里入眠。只是不曾让我看到皎洁月光流淌下美丽的誓言，不曾让我拥抱彩色的梦。

 

[ 本帖最后由 秋水长空 于 2007-8-9 18:22 编辑 ]

不容易，还剩下播放器变化没说了。

 

播放器变化/植入：

 

2楼播放器代码说明：

<EMBED style="FILTER: Alpha(opacity=100,style=2); WIDTH: 125px; HEIGHT: 35px" align=left src=http://music0.hexun.com/Save/Music/2006/0820/339/M_A9CC4889C0D58F5D.WMA width=125 height=35 type=application/octet-stream loop="1" autostart="true" ALGIN="MIDDLE">

 

其中autostart="true"是自动播放，当autostart="false"时候是手动播放。

align=left 是播放器靠左，align=right 如果 是靠右，align=center  是居中. 当然，这也可以在<所见即所得模式>中鼠标点中选定了播放器后用编辑界面上部的靠左/靠右/居中 按钮功能键实现 。

 

刚才详细说了文字的偷懒直观方法，现在就很简单了，一样的手法。

 

在<所见即所得模式>，用鼠标去点到播放器的轮廓区域，可以拉伸高度宽度达到修改大小目的。

如果按Delete就删除掉了播放器，删除了要换其他播放器格式的话：

我另外的教程里面列出一些其他播放器格式代码，

再开一个备用编辑界面，把其他播放器格式代码输入到<Discuz!代码模式>中，然后切换到<所见即所得模式>，点中播放器轮廓区域，Ctrl+C复制。   然后到主编辑界面上，用鼠标点到你刚才删除原有播放器的地方，注意阿，要点到看到鼠标在底图上出现书写文字鼠标闪动的时候，此时Ctrl+V粘贴上去就行了。

 

[ 本帖最后由 秋水长空 于 2007-8-7 22:36 编辑 ]

代码收集办法：

 

这些边框代码，字幕代码，所有所有的元素代码，需要整理收集(当然你有水平有时间去自己编最好)。  看到好的帖子，觉得其设计的代码元素不错，想使用的话就去找到作者的代码。

 

方法： 在看到的帖子界面上，用右键-<查看源文件>--出现1个写字板文件，里面全是代码。这些代码包括了论坛网页上的可以看到的所有东西的代码。 而作者的音画代码只是其中的很小一部分。

 

迅速找到音画代码那一部分的方法：一般音画帖里有文字有音乐的。 你复制音画帖里面的文字的一部分，然后在那个写字板文件中用顶部按钮 <编辑>--<查找>，就很快找到那部分的大致地方。然后，因为音画帖的起始代码都是边框Table开始的， 前后找一下就可以了。这需要对音画代码有所熟悉之后就很快了。   PS: 小7现在该是找代码复制老手了，哈哈

 

用音乐地址也能很快在写字板里面找到音画部分的代码： 用MP3或者wma当关键词去查找。

 

当对代码很熟悉后，可以从最基本的参数修改起，可以玩复杂的代码了。

[ 本帖最后由 秋水长空 于 2007-8-7 23:00 编辑 ]

罗里巴索讲完，为了大家能容易看懂，我都恶心如此罗索了。

 

还发现，我不能老挖大坑活埋自己了 ：-）

[ 本帖最后由 秋水长空 于 2007-8-7 22:58 编辑 ]

发现你还真男人哦，赞一个！ 建议置顶。

简单易学.LZ真是费心了.赞一个　：）

一千个谢谢~一万个谢谢~LZ太有才了~太能干了~谢谢谢谢谢~~~~~~~~~~

引用:

原帖由 傀儡的救赎 于 2007-8-7 23:36 发表 发现你还真男人哦，赞一个！ 建议置顶。

你这话说的，N年前当我的X和我的Y遇上的时候起，我就是男人了。为了流畅，建议你把“赞一个！” 改为 “亲一个！” 哈哈哈哈。。。

 

引用:

原帖由 竹语清风 于 2007-8-8 11:29 发表 简单易学.LZ真是费心了.赞一个　：）

 

没费心，倒是费时间了。 每个字都是打出来的，想当年毕业论文貌似也就这点字数 :-)

 

 

引用:

原帖由 qxywww 于 2007-8-8 12:29 发表 一千个谢谢~一万个谢谢~LZ太有才了~太能干了~谢谢谢谢谢~~~~~~~~~~

 

哦，为了打字辛苦决定笑纳 ：-） 原来你属于潜水，呵呵，潜品不错。

[ 本帖最后由 秋水长空 于 2007-8-8 13:23 编辑 ]

说你真男人的意思是说你很man,说到做到，言而有信。如果改为亲一个，就要用这个表情 ，忽忽~~~~

只要不是小P孩那样阴晴不定，这点小事不难做到吧。 你也可以“真男人”一把，然后进入男人世界，哈哈。

LZ真是太好了

好同志

好贴啊,傻瓜也感动

把我们当傻瓜了

你本来就是！

强悍，崇拜

发现某人泡妞比我还狠 路过个 你们继续