eWebSoft在线 HTML 编辑器的使用说明

 http://www.sunmood.com/bbs/non-cgi/editor/editor.html

　eWebEditor是的基于网页的、所见即所得的在线HTML编辑器。她能够在网页上实现许多桌面编辑软件（如：Word）所具有的强大可视编 辑功能；她是一个真正的绿色软件，不需要在计算机上安装任何的客户端软件；她的易用使得WEB开发人员只要一行代码即可完成调用。
　
使用说明
界面概述： 所见即所得的在线编辑器界面主要分为以下三大部分：

菜单栏 编辑器顶部为菜单栏，主要放置各种编辑功能的选项及按钮图标，使用者只需点击图标或选择相关选项即可实时对编辑栏编辑的内容进行添加或修改、修饰。
编辑栏 编辑器中部空白处为编辑栏，主要是供使用者输入及编辑内容所用，同时所编辑的内容全部都是所见即所得，但有部分内容，如活动的图像、文字、电影等在编辑状态下只会呈现静止状态，需使用者转换到预览状态方可真实再现。
状态栏 编辑器底部为状态栏，主要放置转换编辑器状态的按钮图标，状态共分为：代码状态、编辑状态（默认）、文本状态、预览状态。具体每种状态的作用请详见帮助中心目录的“状态栏使用说明”。
菜单栏使用说明：

编辑器菜单栏图标功能使用说明如下：

：设置字体样式为粗体。
：设置字体样式为斜体。
：设置字体样式为带下划线。
：设置字体样式为带中划线。
：设置字体样式为上标。
：设置字体样式为下标。
：设置字体变大。
：设置字体样变小。
：设置内容向左对齐。
：设置内容向右对齐。
：设置内容向中对齐。
：设置内容两端对齐。
：设置内容以编号列表形式排列。
：设置内容以列表项形式排列。
：减少内容的缩进量。
：增加内容的缩进量。
：设置字体的颜色。
：设置字体背景颜色。
：设置对象背景颜色。
：剪切指定内容。
：复制指定内容。
：粘贴剪贴板中的内容。
：以纯文件形式粘贴剪贴板中的内容。
：粘贴从Word中复制的内容，并去除冗余格式。
：删除指定内容。
：删除指定内容的格式。
：撒消上次操作。
：恢复上次操作。
：选定所有内容。
：取消选定的内容。
：表单菜单。
：插入文本输入框。
：插入文字区。
：插入单选按钮。
：插入复选框。
：插入下拉框。
：插入按钮。
：插入或修改字幕，即滚动文字。
：插入水平尺。
：插入换行符。
：插入段落。
：插入或修改超级链接。
：删除超级链接或标签。
：图形热点链接。
：标签管理。
：表格菜单。
：插入表格...。
：表格属性...。
：单元格属性...。
：拆分单元格...。
：表格行属性...。
：插入行（在上方）。
：插入行（在下方）。
：合并行（向下方）。
：拆分行。
插入列（在左侧）。
：插入列（在右侧）。
：合并列（向右侧）。
：拆分列。
：在指定位置插入或修改栏目框。
：在指定位置插入或修改网页帧。
：在指定位置插入或修改图片。
：在指定位置插入Flash动画。
：在指定位置插入自动播放的媒体文件。
：在指定位置插入其它文件。
：远程自动文件获取。
：在指定位置插入EXCEL表格。
：在指定位置插入特殊字符。
：指定位置的背景图片管理。
：在指定位置插入表情图标。
：在指定位置插入当前日期。
：在指定位置插入当前时间。
：转换指定内容为代码样式。
：转换指定内容为引用样式。
：显示或隐藏指导方针。
：查找替换功能。
：新建文档功能。
：相对或绝对位置设置功能。
：上移一层。
：下移一层。
：缩放菜单。
：增高编辑区。
：减小编辑区。
：转为代码状态。
：转为编辑状态。
：转为文本状态。
：转为预览状态。
：打印全页。
：保存内容到相关联的表单。
：打开全屏编辑。
：关闭全屏编辑并返回。
：弹窗保存并返回。
：查看在线使用帮助。
：关于编辑器的版权信息。
：直接访问eWebEditor站点。
：工具菜单。
：文件视图菜单。
：编辑菜单。
：对象效果菜单。
：组件菜单。
编辑器菜单栏下拉选项功能使用说明如下：

段落格式：设置文字内容的段落格式，使内容更加条理及便于阅读。
特殊字体格式：设置文字内容的特殊格式，包括删除线、飞行文字、移动文字等。
选择字体：设置文字内容的字体格式，可用自定义字体功能设置列表中没出列出的字体格式。注：需浏览者操作系统安装有相应字体文件才可正常显示自定义的字体。
字号：设置文字内容的大小。共分7种尺寸。
缩放：放大或缩小编辑区内的内容。
注意事项：

部分提供修改功能的按键或选项，只需选择原来插入的对象，再按同一按键或选项，即可进行修改。
部分提供设置功能的按键或选项，都可以通过再按一次按键或选项来取消前一次的设置。
编辑栏使用说明：

编辑器编辑栏主要放置供使用者编辑内容的编辑框，若内容超出框架宽度或长度的话，会自动出现滚动条。另外还可通过状态栏的状态转换可转换编辑框的不同编辑状态。
状态栏使用说明：

编辑器状态栏放置有编辑器状态转换栏，共有四种状态可供转换，详细如下：

编辑状态(默认)，在此状态下所有编辑的内容皆为所见即所得的方式。
代码状态，在此状态下所有编辑的内容皆以HTML标记源代码方式显示或编辑。
文本状态，在此状态下所有编辑的内容皆以纯文本方式显示或编辑。
预览状态，在此状态下所有内容皆以不可编辑的页面输出方式显示，可利用此状态预览编辑内容输出后的效果。
使用技巧：

乾坤小挪移 如果在网络上看到哪篇文章或新闻甚至页面觉得不错的话，可以用鼠标将相应页面内容全部选择起来后，直接拖动或复制到编辑器的编辑框即可，而且原页面上的图片、文字、CSS样式、动态效果等都能原封不动地转移到编辑框，不用修改或添加任何代码。
巧用插入自动播放媒体功能 插入自动播放媒体功能可以自动识别各种媒体格式并用相应的播放器在页面自动播放，而且这个功能还能识别图像文件，压缩文件等。大家可以充分利用此功能编辑出更多色声俱全的内容。
灵活运用预览状态 编辑内容中带有动态效果、即时播放媒体、GIF动画等活动内容时，编辑状态中只能显示静态的图像或播放器界面，这时只需要将状态转换为预览状态就可以马上看到这些内容的动态实时效果，如果想继续编辑的话，只需再转换到编辑状态即可。

HTML标签做帖攻略

原代码如下：

<TABLE align=center background="帖子背景图" border=0 cellPadding=0 cellSpacing=0 borderColor=#ffff00 width="100%"><TBODY><TR><TD>

帖子内容，文字或图片.....
</TD></TR></TBODY></TABLE>

<TABLE> 的参数设定（常用）：

<table width="400" border="1" cellspacing="2" cellpadding="2" align="CENTER" valign="TOP" background="myweb.gif" bgcolor="#0000FF" bordercolor="#CF0000" bordercolorlight="#00FF00" bordercolordark="#00FFFF" cols="2">

注解：

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

border="1"
表格边框的厚度，不同浏览器有不同的内定值，故请指明。

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

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

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

background="myweb.gif"
表格的背景图片，与 bgcolor 不要同用。

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

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

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

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

cols="2"
表格栏位数目，只是让浏览器在下载表格时先画出整个表格而已。

原代码如下：

<TABLE align=center background=http://bbs.mz99.com/UploadFile/2004-5/200452611713336.gif border=0 cellPadding=0 cellSpacing=0 height=180 width=350 table>
<TBODY>
<TR>
<TD>

<EMBED height=170 pluginspage=http://www.macromedia.com/go/getflashplayer src=http://www.cn898.net/bg/4.swf type=application/x-shockwave-flash width=330 wmode="transparent" quality="high"></EMBED>

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

其中插入透明FLASH的代码为：

<EMBED height=170 pluginspage=http://www.macromedia.com/go/getflashplayer src=http://www.cn898.net/bg/4.swf type=application/x-shockwave-flash width=330 wmode="transparent" quality="high"></EMBED>

说明：也就是把FLASH放在图片里面，这样图片就必需作为背景才行，不足之处就在于图片往往较大，而论坛显示范围有限，作为背景的图片常常无法显示全图。所以建议大家在用这种格式的时候最好是选取一些较小的图，也或者自己用PS将图改小了再用。：

标记	类型	译名或意义	作 用	备注
文件标记
<HTML>	●	文件声明	让浏览器知道这是 HTML 文件
<HEAD>	●	开头	提供文件整体资讯
<TITLE>	●	标题	定义文件标题，将显示于浏览顶端
<BODY>	●	本文	设计文件格式及内文所在
排版标记
<!--注解-->	○	说明标记	为文件加上说明，但不被显示
<>	○	段落标记	为字、画、表格等之间留一空白行
<BR>	○	换行标记	令字、画、表格等显示于下一行
<HR>	○	水平线	插入一条水平线
<CENTER>	●	居中	令字、画、表格等显示于中间	反对
<RE>	●	预设格式	令文件按照原始码的排列方式显示
<DIV>	●	区隔标记	设定字、画、表格等的摆放位置
<STRONG>	●	加重语气	产生字体加粗 Bold 的效果
<B>	●	粗体标记	产生字体加粗的效果
<EM>	●	强调标记	字体出现斜体效果
<I>	●	斜体标记	字体出现斜体效果
<TT>	●	打字字体	Courier字体，字母宽度相同
<U>	●	加上底线	加上底线	反对
<H1>	●	一级标题标记	变粗变大加宽，程度与级数反比
<H2>	●	二级标题标记	将字体变粗变大加宽
<H3>	●	三级标题标记	将字体变粗变大加宽
<H4>	●	四级标题标记	将字体变粗变大加宽
<H5>	●	五级标题标记	将字体变粗变大加宽
<H6>	●	六级标题标记	将字体变粗变大加宽
<FONT>	●	字形标记	设定字形、大小、颜色	反对
<BASEFONT>	○	基准字形标记	设定所有字形、大小、颜色	反对
<BIG>	●	字体加大	令字体稍为加大
<SMALL>	●	字体缩细	令字体稍为缩细
<STRIKE>	●	画线删除	为字体加一删除线	反对
<CODE>	●	程式码	字体稍为加宽如<TT>
<KBD>	●	键盘字	字体稍为加宽，单一空白
<SAMP>	●	范例	字体稍为加宽如<TT>
<VAR>	●	变数	斜体效果
<CITE>	●	传记引述	斜体效果
<BLOCKQUOTE>	●	引述文字区块	缩排字体
<DFN>	●	述语定义	斜体效果
<ADDRESS>	●	地址标记	斜体效果
清单标记
<OL>	●	顺序清单	清单项目将以数字、字母顺序排列
<UL>	●	无序清单	清单项目将以圆点排列
<LI>	○	清单项目	每一标记标示一项清单项目
<MENU>	●	选单清单	清单项目将以圆点排列，如<UL>	反对
<DIR>	●	目录清单	清单项目将以圆点排列，如<UL>	反对
<DL>	●	定义清单	清单分两层出现
<DT>	○	定义条目	标示该项定义的标题
<DD>	○	定义内容	标示定义内容
表格标记
<TABLE>	●	表格标记	设定该表格的各项参数
<CAPTION>	●	表格标题	做成一打通列以填入表格标题
<TR>	●	表格列	设定该表格的列
<TD>	●	表格栏	设定该表格的栏
<TH>	●	表格标头	相等于<TD>，但其内之字体会变粗
图形标记
<IMG>	○	图形标记	用以插入图形及设定图形属性
连结标记
<A>	●	连结标记	加入连结
框架标记
<FRAMESET>	●	框架设定	设定框架
<FRAME>	○	框窗设定	设定框窗
<IFRAME>	○	页内框架	于网页中间插入框架	IE
多媒体
<BGSOUND>	○	背景声音	于背景播放声音或音乐	IE
<EMBED>	○	多媒体	加入声音、音乐或影像
其他标记
<MARQUEE>	●	走动文字	令文字左右走动	IE

注：

• ● 表示该标记属围堵标记，即需要关闭标记如 </标记>。
  
• ○ 表示该标记属空标记，即不需要关闭标记。
  
• IE 表示该标记只适用于Internet Explorer。
  
• 反对 表示该标记不为W3C所赞同，通常这标记是 IE 或
  NC自订，且己为众所支持，只是HTML标准中有其它同功能或更好的选择。
  
• 弃用 表示该标记己为W3C所弃用，是过时的标记，但 HTML
  具向下兼容的特 性，不用担心新浏览器不支援旧标记。
  
• 新表示该标记是HTML4.0中新增的。
  
  色彩渐变代码生成器

  http://member.netease.com/~phoesky/tool/colorjb.htm

  1 白色 #FFFFFF
  2 红色 #FF0000 3 绿色 #00FF00 4 蓝色 #0000FF 5 牡丹红 #FF00FF6 青色 #00FFFF 7 黄色 #FFFF00 8 黑色 #000000 9 海蓝 #70DB93 10 巧克力色 #5C3317 11 蓝紫色 #9F5F9F 12 黄铜色 #B5A642 13 亮金色 #D9D919 14 棕色 #A67D3D 15 青铜色 #8C7853 16 2号青铜色 #A67D3D 17 士官服蓝色 #5F9F9F 18 冷铜色 #D98719 19 铜色 #B87333 20 珊瑚红 #FF7F00 21 紫蓝色 #42426F 22 深棕 #5C4033 23 深绿 #2F4F2F 24 深铜绿色 #4A766E 25 深橄榄绿 #4F4F2F 26 深兰花色 #9932CD 27 深紫色 #871F78 28 深石板蓝 #6B238E 29 深铅灰色 #2F4F4F 30 深棕褐色 #97694F 32 深绿松石色 #7093DB 33 暗木色 #855E42 34 淡灰色 #545454 35 土灰玫瑰红色 #856363 36 长石色 #D19275 37 火砖色 #8E2323 38 森林绿 #238E23 39 金色 #CD7F32 40 鲜黄色 #DBDB70 41 灰色 #C0C0C0 42 铜绿色 #527F76 43 青黄色 #93DB70 44 猎人绿 #215E21 45 印度红 #4E2F2F 46 土黄色 #9F9F5F 47 浅蓝色 #C0D9D9 48 浅灰色 #A8A8A8 49 浅钢蓝色 #8F8FBD 59 浅木色 #E9C2A6 60 石灰绿色 #32CD32 61 桔黄色 #E47833 62 褐红色 #8E236B 63 中海蓝色 #32CD99 64 中蓝色 #3232CD 65 中森林绿 #6B8E23 66 中鲜黄色 #EAEAAE 67 中兰花色 #9370DB 68 中海绿色 #426F42 69 中石板蓝色 #7F00FF 70 中春绿色 #7FFF00 71 中绿松石色 #70DBDB 72 中紫红色 #DB7093 73 中木色 #A68064 74 深藏青色 #2F2F4F 75 海军蓝 #23238E 76 霓虹篮 #4D4DFF 77 霓虹粉红 #FF6EC7 78 新深藏青色 #00009C 79 新棕褐色 #EBC79E 80 暗金黄色 #CFB53B 81 橙色 #FF7F00 82 橙红色 #FF2400 83 淡紫色 #DB70DB 84 浅绿色 #8FBC8F 85 粉红色 #BC8F8F 86 李子色 #EAADEA 87 石英色 #D9D9F3 88 艳蓝色 #5959AB 89 鲑鱼色 #6F4242 90 猩红色 #BC1717 91 海绿色 #238E68 92 半甜巧克力色 #6B4226 93 赭色 #8E6B23 94 银色 #E6E8FA 95 天蓝 #3299CC 96 石板蓝 #007FFF 97 艳粉红色 #FF1CAE 98 春绿色 #00FF7F 99 钢蓝色 #236B8E 100 亮天蓝色 #38B0DE 101 棕褐色 #DB9370 102 紫红色 #D8BFD8 103 石板蓝色 #ADEAEA 104 浓深棕色 #5C4033 105 淡浅灰色 #CDCDCD 106 紫罗兰色 #4F2F4F 107 紫罗兰红色 #CC3299 108 麦黄色 #D8D8BF 109 黄绿色 #99CC32