三种编辑模式：Design、UBB和HTML的区别

      Design、UBB和HTML三种模式：可能很多人都没能了解他们之间的区别，现作细解   

      所有的使用动网程序论坛都支持三种编辑模式：Design、UBB和HTML，这三种编辑模式各有其功能和特点，鉴于有些网友常常混淆编辑模式，此贴加以说明，希望大家看了能够对论坛的三种编辑模式做到心中有数。

    1、Design编辑模式：

    Design的英文含义是“设计”，这里指半可视化的与Word相类似的编辑模式。用户可以在这个编辑模式下直接输入文字并进行修饰，其效果是“所见即所得”的(What you see is what you want)，你还可以在这里充分利用编辑框上方的工具栏进入诸如插入图片、插入媒体音频/视频文件、插入超级链接乃至取消等等操作，不同的是，当你插入上述内容时，它的可视化并不太理想——你不一定能够看到实际内容，而可能只是一些UBB语法格式的文字(我们下面会谈及UBB语法的)。不过Design编辑模式也有“预览”功能哦——当你在HTML下编写完一段完整的代码后，你试试切换到Design编辑模式，你会发现，你所编辑的HTML代码在这里可以看出效果来的(虽然这个效果不完全是真正发布后的效果)，这对你编写帖子和查看帖子效果无疑是有一定的帮助意义的。

    论坛默认的编辑模式就是Design模式。当你发布新帖或回复别人的帖子时，你首先进入的编辑模式都是Design模式。如果你需要进入别的编辑模式，那么，在如下三种情形下你可以单击编辑框下方的相应按钮进行切换：

    1）发表新帖时；
    2）打开一个帖子然后点击该帖子稍右上方的“回复”按钮时；
    3）引用别人的话时。

    Design编辑模式支持UBB语法，就是说，在Design编辑模式下，如果你直接使用UBB语法编辑帖子，论坛系统也是接受的。不过，由于“自动格式”等原因，有时在Design模式下使用UBB的一些语句会出现问题(如系统会加入<a href=...>...</a>、<font=...>...</font>之类的HTML代码)，造成所编辑的帖子发布后效果不如人意。

   2、 UBB编辑模式：

  UBB是早期一些论坛为了支持部分HTML特效而设计的语法标签，这些特定的语法语句通过论坛的特殊程序将其转换成HTML效果显示出来，至今大多数论坛程序仍然使用。UBB语法就是中括号语法，每条语句的语法标识符放在中括号里，和HTML语法一样，也定义了起始符，成双成对出现。比如，令文字颜色为红色，我们用如下语法格式(*号用时去掉，下同)：

[*color=red]我喜欢 [*/color]

效果：我喜欢

下面列举一些常用的UBB语法：

[*B]文字[*/B]：在文字的位置可以任意加入您需要的字符，显示为粗体效果。

[*I]文字[*/I]：在文字的位置可以任意加入您需要的字符，显示为斜体效果。

[*U]文字[*/U]：在文字的位置可以任意加入您需要的字符，显示为下划线效果。

[*align=center]文字[*/align]：在文字的位置可以任意加入您需要的字符，center位置center表示居中，left表示居左，right表示居右。

[*URL=http://2008wlkw.2000y.net]黑马在线动力[*/URL]：加入超级连接。

[*EMAIL=MAILThandanfang@163.net]写信给黑马[*/EMAIL]：有加入邮件连接。

[*img]图片地址[*/img]：在标签的中间插入图片地址可以实现插图效果。

[*flash]Flash连接地址[*/Flash]：在标签的中间插入Flash图片地址可以实现插入Flash。

[*code]文字[*/code]：在标签中写入文字可实现html中编号效果。

[*quote]引用[*/quote]：在标签的中间插入文字可以实现HTMl中引用文字效果。

[*list]文字[*/list] [*list=a]文字[*/list] [*list=1]文字[*/list]：更改list属性标签，实现HTML目录效果。

[*fly]文字[*/fly]：在标签的中间插入文字可以实现文字飞翔效果，类似跑马灯。

[*move]文字[*/move]：在标签的中间插入文字可以实现文字移动效果，为来回飘动。

[*glow=255,red,2]文字[*/glow]：在标签的中间插入文字可以实现文字发光特效，glow内属性依次为宽度、颜色和边界大小。

[*shadow=255,red,2]文字[*/shadow]：在标签的中间插入文字可以实现文字阴影特效，shadow内属性依次为宽度、颜色和边界大小。

[*color=颜色代码]文字[*/color]：输入您的颜色代码，在标签的中间插入文字可以实现文字颜色改变。

[*size=数字]文字[*/size]：输入您的字体大小，在标签的中间插入文字可以实现文字大小改变。

[*face=字体]文字[*/face]：输入您需要的字体，在标签的中间插入文字可以实现文字字体转换。

[*DIR=500,350]……[*/DIR]：为插入shockwave格式文件，中间的数字为宽度和长度。

[*RM=500,350,1]……[*/RM]：为插入realplayer格式的rm文件，中间的数字为宽度和长度，第三个数字取值为0和1，0表示手动播放，1表示自动播放。

[*MP=500,350,1]……[*/MP]：为插入为midia player格式的文件，中间的数字为宽度和长度，第三个数字取值为0和1，0表示手动播放，1表示自动播放。

[*QT=500,350]……[*/QT]：为插入为Quick time格式的文件，中间的数字为宽度和长度，第三个数字取值为0和1，0表示手动播放，1表示自动播放。

【说明】

1）有少数语法本论坛不一定支持。
2）查看本论坛的UBB语法模式会发现，它的语句模样其实是HTML格式的。

   3、 HTML编辑模式：

    这是论坛最高级的编辑模式，要求用户有一定的HTML语法知识，能够编写HTML代码。

    HTML文件是标准的ASCII文件，它看起来象是加入了许多被称为链接签(tag)的特殊字符串的普遍文本文件。从结构上讲，HTML文件由元素(element)组成，组成HTML文件的元素有许多种，用于组织文件的内容和指导文件的输出格式。绝大多数元素是“容器”，有起始标记和结尾标记。元素的起始标记叫做起始链接签(start tag)，元素结束标记叫做结尾链接签(end tag)，比如我们经常使用的表格就是由<table>和</table>分别作起始标识符，<table>里面还有各种参数和属性设置，<table>和</table>之间还有一些成对出现的诸如<tbody>、<th>、<tr>、<td>等元素。

    其实，如果你对HTML语法知识还不太了解的话，你还可以借助一些网页制作软件(如FrontPage、DreamWaver等)在可视化编辑状态下编写帖子，结束后再切换到HTML模式将相应代码复制到论坛上来。你也可以修改别人的代码，作为过渡阶段的学习手段，这是准许的。

    最后切记：<table>...</table>之类的用<>包含起来的代码就是HTML代码，它们只有在HTML编辑模式下编辑，你想要的效果才会在发布后得以正确显示。

和大家一起学习用html做贴(基础入门)

一个漂亮的贴子应该是：背景＋内容(文字，图片)+收尾

先说背景：

<TABLE align=center background="背景图片网址" border=10 cellSpacing=2 borderColor=#841A00 width=500><TBODY><TR><TD>

帖子的文章加图片

</TD></TR></TBODY></TABLE>


注意：前边用了多少<table......><tr><td>后面就要有多少</td></tr></table>收尾。多收和少收都会使帖子出错哦　：）


常用的参数设定及注解：

<table width="400" border="10" cellspacing="2" cellpadding="2" align="CENTER" valign="TOP" background="图片网址" bgcolor="#0000FF" bordercolor="#CF0000" bordercolorlight="#00FF00" bordercolordark="#00FFFF">

width="400"
表格宽度，接受绝对值（如 500）及相对值（如 80%）。

border="10"
表格边框的厚度。

cellspacing="2"
表格格线的厚度

cellPadding=5　表格格线内厚度


align="CENTER"
表格的摆放位置（水平），可选值为：左： left,　右： right,　居中： center

valign="TOP".
表格内内容的对齐方式（垂直），可选值为： top, middle, bottom。 　　

background="背景图片网址"
表格的背景图片，与 bgcolor 不要同用。

bgcolor="#0000FF"
表格的底色，与 background 不要同用

bordercolor="#CF0000"
表格边框颜色

bordercolorlight="#00FF00"
表格边框向光部分的颜色

bordercolordark="#00FFFF"
表格边框背光部分的颜色，使用 bordercolorlight 或 bordercolordark 时 bordercolor 将会失效。

例:



源代码如下这是一层的背景：

<TABLE cellSpacing=5 cellPadding=0 width=400 align=center background=http://www.mii8888.com/sozai/miisozai/bg/d3.jpg border=2>
<TBODY>
<TR>
<TD>
<P align=center><IMG src="http://img.pconline.com.cn/images/images/upload/bbs/2005/3/27/1/2/225/88/77/149/111188222299730.jpg"></P></TD></TR></TBODY></TABLE>

注：兰色部分表示背景图片地址，绿色表示图片地址！

大家可以按自己的需求做！愿意怎么做都可以！ cellSpacing=10 这个值是可以随便调整的！

文字的语法:

基本代码如下：

<P align=center><FONT color=#CFCF88 face=华文行楷 size=5>插入文字</FONT></P>


<P align=center>表示居中，<P align=left>表示居左，<P align=right>表示居右。

face=字体　常用字体为：宋体.黑体.楷体.仿宋.华文行楷.新宋体.华文新魏等

size=字体大小，这里的最大值为6　取值越大文字就越大

例

认识你们真好

代码如下：

<P align=center><FONT face=宋体 size=6 color=red><B>认识你们真好</B></FONT></P>

移动文字

基本代码：

<marquee direction=up behavior=scroll width=400 height=90 scrolldelay=80 scrollamount=1><font color=red size=+2 face=宋体>插入文字</font></marquee>

说明：

direction=移动方向　可选值为向上(up)　向下(down)　向左(left)　向右(right)

behavior=移动方式，　scroll 一圈一圈绕着走，　slide 只走一次，　behavior=alternate 来回走

width=宽度　　height=高度　　scrolldelay=速度　　scrollamount=位移

上面的参数大家可以根据不同的情况自行调节。

例

<P align=center>
<MARQUEE scrollAmount=1 scrollDelay=80 direction=up width=400 height=90><FONT face=宋体 color=red size=6>红袖添香论坛欢迎你</FONT></MARQUEE></P>

演示

红袖添香论坛欢迎你

贴图片的基本格式

基本代码：<img src=图片网址 width=图片宽度 height=图片长度>

注意：设定图片大小，此宽度及高度一般采用 pixels 作单位。通常只设为图片的真实大小，以免失真，若需要改图片大小最好使用图像编辑工具（改变大小的宽和高与原图的宽和高要成正比例，图片最好是改小不改大，以免失真。）。图片的居中，居左，居右上面已经介绍了，这里不再重复。。。。。

贴歌代码

1.背景音乐（适合　mid wma等格式）
<bgsound src=音乐网址 Loop=-1>

2.音频（适合MP3 WMA RM等很多格式）

代码如下：
<embed src=音乐网址 type=audio/x-pn-realaudio-plugin controls=ControlPanel StatusBar 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>

4.FLASH
<embed src=网址 width=400 height=400>

说明：AutoStart=true　表示是否要音乐文件传送完就自动播放，TRUE是要，FALSE是不要，默认为true

Loop=true　表示设定播放重复次数，LOOP=3表示重复3次，true表示无限次播放，FALSE播放一次即停止。

width=宽度 height=高度　可以设定控制播放器面板的大小，如果都设置为0就可以把播放器隐藏了。

如何在图片中加入文字？

演示

夕 阳 无 限 好 ， 只 是 近 黄 昏 品

上图的代码如下

<TABLE height=400 cellSpacing=1 cellPadding=0 width=550 align=center background=http://www.cj888.com/photo/326a/hehua/images/hehua018_jpg.jpg border=0>
<TBODY>
<TR>
<TD><BR>
<P>
<P>
<P align=center>
<MARQUEE style="WIDTH: 400px; HEIGHT: 300px" scrollAmount=3 direction=up height=514>
<CENTER><FONT color=#ffff00></FONT></CENTER><FONT color=#ffff00></FONT>
<P>
<P><FONT color=#ffff00></FONT>
<P align=center><FONT face=隶书 color=#ffff00 size=4>夕</FONT></P>
<P><FONT color=#ffff00></FONT>
<P align=center><FONT face=隶书 color=#ffff00 size=4>阳</FONT></P>
<P><FONT color=#ffff00></FONT>
<P align=center><FONT face=隶书 color=#ffff00 size=4>无</FONT></P>
<P><FONT color=#ffff00></FONT>
<P align=center><FONT face=隶书 color=#ffff00 size=4>限</FONT></P>
<P><FONT color=#ffff00></FONT>
<P align=center><FONT face=隶书 color=#ffff00 size=4>好</FONT></P>
<P><FONT color=#ffff00></FONT>
<P align=center><FONT face=隶书 color=#ffff00 size=4>，</FONT></P>
<P><FONT color=#ffff00></FONT>
<P align=center><FONT face=隶书 color=#ffff00 size=4>只</FONT></P>
<P><FONT color=#ffff00></FONT>
<P align=center><FONT face=隶书 color=#ffff00 size=4>是</FONT></P>
<P><FONT color=#ffff00></FONT>
<P align=center><FONT face=隶书 color=#ffff00 size=4>近</FONT></P>
<P><FONT color=#ffff00></FONT>
<P align=center><FONT color=#ffff00><FONT face=隶书 size=4>黄</FONT> </FONT></P>
<P><FONT color=#ffff00></FONT>
<P align=center><FONT face=隶书 color=#ffff00 size=4>昏</FONT></P>
<P><FONT color=#ffff00></FONT>
<P><FONT color=#ffff00></FONT>
<P align=center><FONT face=隶书 color=#ffff00 size=3>品</FONT></P>
<P>
<P align=left><FONT color=#ffff00></FONT></P>
<P><FONT color=#ffff00></FONT><FONT color=#ffff00></FONT></P>
<P><FONT color=#ffff00></FONT></P>
<P>
<P>
<P>
<P>
<P></P></MARQUEE></P>
<P>
<P>
<P>
<P>
<P>
<P>
<P></P></TD></TR></TBODY></TABLE>

演示

如何在图片中加入文字？ 如何在图片中加入文字？ 如何在图片中加入文字？ 如何在图片中加入文字？

代码如下：

<TABLE height=300 cellPadding=10 width=500 align=center background=http://bbs.guolan.com/upload/2004813181838.gif border=3 table="0">
<TBODY>
<TR>
<TD>
<DIV align=center><FONT face=楷体_GB2312><FONT size=4><FONT color=#ffffff></FONT></FONT></FONT>
<MARQUEE style="WIDTH: 380px; HEIGHT: 84px" scrollAmount=2 direction=up height=84><FONT color=#ff00ff>
<DIV align=center><FONT face=楷体_GB2312 color=#c709f7 size=4>如何在图片中加入文字？</FONT></DIV>
<DIV align=center><FONT face=楷体_GB2312 color=#c709f7 size=4></FONT><BR></DIV>
<DIV align=center><FONT face=楷体_GB2312 color=#1ae66b size=4>如何在图片中加入文字？</FONT></DIV>
<DIV align=center><FONT face=楷体_GB2312 color=#1ae66b size=4></FONT><BR></DIV>
<DIV align=center><FONT face=楷体_GB2312 color=#ffff00 size=4>如何在图片中加入文字？</FONT></DIV>
<DIV align=center><FONT face=楷体_GB2312 color=#ffff00 size=4></FONT><BR></DIV>
<DIV align=center><FONT face=楷体_GB2312><FONT size=4><FONT color=#ffffff>如何在图片中加入文字？</FONT></FONT></FONT></DIV></FONT></MARQUEE></DIV></TD></TR></TBODY></TABLE>



文字上下滚动代码：

<MARQUEE style="WIDTH: 380px; HEIGHT: 84px" scrollAmount=2 direction=up height=84><FONT color=#ff00ff>

注：scrollAmount=2   是控制字速，数值越大字速就越快！

对不起，我想问一下。
<TABLE align=center background="背景图片网址" border=10 cellSpacing=2 borderColor=#841A00 width=500><TBODY><TR><TD>

帖子的文章加图片

</TD></TR></TBODY></TABLE>

这个所说的贴子的文章加图片。图片要怎样加呢？

将图片和文章的代码放在<TABLE align=center background="背景图片网址" border=10 cellSpacing=2 borderColor=#841A00 width=500><TBODY><TR><TD>与</TD></TR></TBODY></TABLE>之间.

教程变乱了

HOHO~~~我成功了 ！！。谢谢红袖。谢谢红袖。！！
:009:004

可是我没有看懂

说实话……没太搞明白……