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

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
eWebEditor功能特点: eWebEditor除了具有前台的调用功能外,还具有很强的后台管理功能,能够对编辑器多种功能进行各种有效的自定义,具体如下: 大量常用功能按钮 eWebEditor包含了日常所要用到所有的样式功能,如复制、剪切、粘贴、表格、图片、文件、字体、颜色等,并在不断的补充中。 内附文件上传功能 eWebEditor内涉及的文件相关的功能中,如图片来源,媒体文件来源,附件来源等,都自带有从客户端直接上传到服务器端的功能。 功能界面可自定义 eWebEditor内的功能按钮及显示样式允许自定义。您可以根据自己实际需要定制各按钮的图片,样式,按钮功能的个数等。 同时多个编辑器支持 可以在同一个表单Form里有多个eWebEditor,也可以在同一页里有多个eWebEditor,也可以有多个样式不同的eWebEditor。 大文件支持 一般的输入框有102399字节的限制(100K左右),大文本内容不能使用,而eWebEditor理论上支持无限大文件。 多样式支持 您只需要在您的整个网站中使用一个eWebEditor,可以定制多个样式,在不同的地方使用不同的样式,而没必要在要用的地方都要拷进去。如:一个样式适合宽度为400的屏幕,共10个工具按钮;一个样式适合宽度为500的屏幕,共15个按钮等。 前台支持 一般很多使用都把涉及HTML编辑功能的脚本程序都放在管理员的后台管理中进行,而如允许用户在线投稿的前台却不敢使用,怕的是恶意的脚本。eWebEditor自带有一个解释函数,方便前台显示,根据不同的参数样式显示相应的HTML脚本,去除恶意脚本。 调用简单 在编程开发时,只要写一句代码就可以完成eWebEditor的调用。 自动提交 现在很多的在线文本编辑器,在编辑完后,都要点一下保存功能,或者在提交按钮中加入脚本进行处理,然后再提交,而eWebEditor只需加入调用的那一行外,无需上面的操作处理。 状态保持 现在很多的在线文本编辑器,在提交后,如果服务器端较验没成功,点击“退回”时,原来编辑器中编辑的内容就会丢失,而eWebEditor会保持编辑后的状态,并且能够与Reset按钮同步Reset。 智能粘贴 eWebEditor具有三种粘贴方式,常规方式粘贴,纯文本方式粘贴,或者以Word方式粘贴,如果剪贴板中的内容是Word形式的,将有提示是否去除Word格式,因为Word粘进来文档可是非常非常的大,冗余的代码实在的多。 大小自适应 eWebEditor可以按你调用的宽度和高度自适应编辑器的大小,特别是高度,这是很多编辑器所不具有的,大大方便了调用,使页面能够达到更好的效果。 多种编辑模式 eWebEditor具有4种编辑模式,有:HTML代码模式、可视设计模式、纯文本模式、预览模式,可以满足所有应用的需要。 完善的接口 eWebEditor作为一个强大的在线编辑模块,提供了完善的接口,满足更高级用户的需要,您可以通过接口实时控制或者获取编辑器的内容或者状态。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值