CKEDITOR用户使用指南.docx
《CKEDITOR用户使用指南.docx》由会员分享，可在线阅读，更多相关《CKEDITOR用户使用指南.docx（43页珍藏版）》请在冰豆网上搜索。
CKEDITOR用户使用指南
2012年12月
北京智明信通科技有限公司
1.CKEDITOR概述
是一个专门使用在网页上属于开放源代码的所见即所得文字编辑器。
2.CKEDITOR介绍
2.1.工具栏
1.工具栏提示：
光标移动到单个工具会出现工具栏使用提示。
2.折叠工具栏：
点击工具栏右下脚
按钮，会折叠工具栏
2.2.编辑区
1.如果文档的内容的编辑区域范围以外的跨越，一个标准的滚动条会出现。
要查看文本编辑区的大小超过您可以使用滚动条来滚动，或在浏览器窗口最大化编辑器，使用按钮。
2.3.右键菜单
1.右键菜单菜单是一个弹出式菜单时，就会出现你的CKEDITOR 内单击鼠标右键，可方便快速操作
2.4.元素路径
1.显示以下的HTML元素的层次结构。
2.元素的路径也可以被用来。
点击元素会选中元素中内容。
2.5.对话窗口
3.当一个对话窗口被打开时，包括工具栏的编辑器主窗口被禁用。
4.所有的对话窗口中包含的
按钮，让你确认设置并返回到主编辑器窗口中的
按钮，在弹出的窗口中的文件不作任何修改的情况下关闭。
5.使用位于窗口顶部右侧按钮，关闭对话窗口，返回到编辑区。
3.使用文档
3.1.创建一个新页面
文件内容输入到CKEDITOR 。
如果你想留空白编辑区，并重新开始，你可以创建一个新的文档。
为了实现这一目标，按
工具栏按钮。
注意：
新建文档之后之前编辑区域的内容将会消失。
3.2.文档预览
预览编辑区域内容，按
工具栏按钮。
预览的文件将打开新的浏览器窗口中
3.3.查看源码
如果你想查看您的文档的HTML源代码，使用的
工具栏按钮。
出现在编辑区中的文字，将包含所有相关的HTML标签和属性。
注：
可以在此模式下编辑文档。
如要恢复默认文档显示，需要在次点击
工具栏按钮。
3.4.内容模版
可以使用CKEDITOR模板，按
工具栏上的按钮。
以下内容模板 “窗口，将显示在屏幕上。
注意：
勾选替换当前内容，编辑区域的内容将被替换；如果进行了错误操作，可点击工具栏
进行撤销操作或者按键盘ctrl+z进行撤销操作。
以下是效果图：
3.5.打印文档
如果要打印文档，按下
工具栏上的按钮。
您的操作系统的标准印刷弹出的窗口会出现，您将能够选择打印机以及所有相关的选项。
分页符
如果你需要有控制的印刷版的分页，使用
的工具栏按钮。
注意：
注意文档内容分页符的使用，一旦插入分页符，当使用打印功能时，该文件将被打印到俩个单独的页面。
3.6.文档格式
CKEDITOR可以很容易地改变你的文字风格，但它同样也使得它很容易删除这些样式。
要删除文本样式应用到文档的文本，请选择文本片段，然后按工具栏按钮。
所有的文本样式将被删除，文字将显示在默认的字体。
下图显示了一个示例文本与一些造型-字体，字体大小，斜体，颜色-应用。
CKEDITOR风格的示范文本格式化
当您选择文本，然后使用删除格式功能，移除了所有的文本样式和文字的显示方式默认情况下，段落格式。
示例文本风格删除
3.7.格式样式
当你想自定义的文本片段看起来，你并不需要更改字体，大小，或分开文本和背景颜色。
选择一种风格，选择一个文字片段，然后按
工具栏按钮。
样式下拉列表中包含了一些预先定义的块和内联样式，您可以使用。
更容易做出的选择，样式名称显示在他们所代表的风格，给你一个预览文本看起来像什么。
样式“下拉菜单中CKEDITOR
一个样式可以应用到整个文档，段落，或任意长度的文本片段-甚至一个单一的字母。
注意，但是，审美性和可读性的原因是，建议不要太多的不同风格结合起来，在一个文档中保持一致的造型。
使用的样式在CKEDITOR
要移除的风格与样式功能，打开下拉列表，再次单击“格式样式的名称。
3.8.文本缩进
1.1.1.增加缩进
为了增加缩进的元素，按工具栏按钮。
块级元素包含光标将被缩进一个制表长。
这两个文本缩进方向在CKEDITOR
1.1.2.减少缩进
为了减少缩进的元素，按工具栏按钮。
一个块级元素包含光标的缩进，减少一个制表长。
减少缩进两个文本方向CKEDITOR
1.1.3.缩进级别
CKEDITOR支持多种缩进级别，每个元素。
要进一步缩进元素，需要多次按下工具栏按钮。
在CKEDITOR使用不同的缩进级别
3.9.文本对齐
文本对齐确定文本的位置相对于页面（或编辑区域）。
请注意，因为这种格式化选项的性质，文字的对齐方式只能适用于一个块级元素，就像一个段落，图像，列表项，或一格的元素。
大多数文档中的元素被突出显示在工具栏上有一个默认的对齐方式设置。
如果你想改变默认的对齐方式设置，选择其他选项单击工具栏按钮。
1.1.1.左对齐
当你文本左对齐，段的左边缘对齐。
这通常是默认的文本对齐方式设置的语言与左到右的方向。
要左对齐文本，请按工具栏按钮。
文本的左边对齐，届时将会有一些剩余空间在右边。
文本左对齐在CKEDITOR
1.1.2.居中
要居中的文本，按下工具栏按钮。
文本将对齐对称，留在双方会有一定的空间。
文本集中在CKEDITOR
1.1.3.右对齐
右对齐文本时，该段的右边缘对齐。
这通常是从右到左方向的语言与文字的对齐方式设置为默认的。
要正确对齐文本，请按工具栏按钮。
文本将对齐右页边距
文本右对齐CKEDITOR
3.10.创建列表
列表提供了一种方法来构造文本以及以明确的方式，属于一组项目。
CKEDITOR，可以创建两种类型的列表：
项目符号（无序）和编号（有序）列表。
1.1.4.项目符号列表
当你想要的项目，并不需要任何特定的顺序出现在一组数字，符号列表是有用的。
1.1.1.1.创建项目符号列表
要创建项目符号列表，按下工具栏上的按钮。
一个默认的列表标记将出现在包含光标线将成为缩进的文本行开始。
如果你想添加的列表项，然后按键盘上的Enter键。
光标会移动到下一行放置在其开始标记的列表。
项目符号列表默认列表标记插入CKEDITOR
该列表会自动继续，只要你行结束时按输入。
如果你想抑制列表的创建，然后按Enter键，在空行的列表标记或再次单击该按钮。
然后，光标会移动到下一个，不缩进的段落。
添加项目符号列表的另一种方法是选择一个或多个段落，然后按下工具栏上的按钮。
每个段落将成为一个单独的列表项。
1.1.1.2.项目符号列表属性
可以自定义项目符号列表的外观和修改列表标记。
为了改变列表样式，打开列表上下文菜单，一个列表项或菜单/应用程序键在键盘上点击鼠标右键，并选择“项目符号列表”属性 “菜单选项。
项目符号列表的上下文菜单中的项目符号列表属性“选项
项目符号列表属性 “窗口可以配置列表中标记的外观。
项目符号列表属性“窗口中CKEDITOR
类型下拉列表中包含以下选项：
∙空心圆 -列表标记成为一个圆形，中间是空的，在，。
∙实心圆 -列表标记成为填充在中间的一个圆的形状。
∙实心方块 -列表标记变成了四面的形状，填充在中间。
1.1.1.3.嵌套列表
要创建嵌套的项目符号列表，使用的CKEDITOR 增加缩进功能。
将光标放置在该行应该开始的嵌套列表，然后按工具栏上的按钮。
列表项将成为缩进和列表标记会改变。
添加到列表中的下一个项目将有相同的缩进，从而成为与前一个嵌套列表的一部分。
嵌套的项目符号列表中添加CKEDITOR
如果你想结束嵌套列表，而返回到以前的缩进级别，使用的CKEDITOR 减少缩进功能。
将光标置于行上，然后按工具栏上的按钮。
的列表项的缩进将减少，列表标记会改变的标记的列表，提高了列表的水平。
1.1.1.4.删除项目符号列表
如果你想删除列表格式，留下文字列表项完整，选择列表中的文件，然后按工具栏上的按钮。
标记和缩进的列表将被删除，前的列表项中的每一个将成为一个段落。
从项目符号列表格式的文件中CKEDITOR
1.1.5.编号列表
编号列表是有用的，当你想分组的项目，需要在一个特定的顺序出现。
它们非常适合于列表的程序，一步一步的指示。
1.1.1.1.创建编号列表
要创建一个带编号的列表，请按工具栏上的按钮。
默认的编号列表标记将出现在包含光标线将成为缩进的文本行开始。
如果你想添加的列表项，然后按键盘上的Enter键。
光标会移动到下一行放置在其开始标记的列表。
编号列表的默认列表标记插入CKEDITOR
该列表会自动继续编号。
添加带编号的列表的另一种方法是选择一个或多个段落，然后按下工具栏上的按钮。
每个段落将成为一个单独的列表项。
1.1.1.2.编号的列表属性
可以自定义编号列表的外观，其初始值，列表标记。
为了改变列表样式，打开列表上下文菜单，光标移动到编号列表上点击右键，并选择编号的列表属性 “菜单选项。
编号列表的上下文菜单中的编号列表“属性”选项
编号的列表属性 “窗口，您可以配置的初始值和列表标记类型。
的编号列表，可以使用十进制数字，罗马数字或英文字母的，无论是大写或小写。
编号列表属性“窗口中CKEDITOR
下面是所有带编号的列表属性 “窗口元素的概述：
∙开始序号--在第一列表中项目的列表，该列表将被使用的起始值。
∙类型 -列表的标记的类型。
可从下拉列表中的选项如下：
1.1.1.3.嵌套编号列表
创建嵌套的编号列表，使用的CKEDITOR 增加缩进功能。
将光标放置在该行应该开始的嵌套列表，然后按工具栏上的按钮。
将成为缩进列表项添加到列表中的下一个项目将前一个相同的缩进，从而成为嵌套列表的一部分。
嵌套的编号列表中添加CKEDITOR
默认情况下，嵌套的编号列表将使用十进制列表标记类型。
为了提高可读性的结构嵌套的编号列表，你可以为每一个嵌套级别不同的列表标记。
要做到这一点，打开列表中的上下文菜单在列表项上点击鼠标右键，并选择编号的列表属性 “菜单选项。
从“ 类型“下拉列表中选择将用于此嵌套级别的所有列表项的类型。
嵌套的编号列表中添加不同的列表标记CKEDITOR
如果你想结束一个嵌套列表，并返回到以前的缩进级别，使用的CKEDITOR 减少缩进功能。
将光标置于行了，这应该是一个延续前面的列表，然后按工具栏上的按钮。
1.1.1.4.删除编号列表
如果你想删除列表格式，留下完整的文字列表项，选择列表中的内容，然后单击工具栏上的按钮。
列表标记和缩进将被删除，每个列表条目将成为一个独立的段落。
编号列表格式从文件中CKEDITOR
1.1.1.5.混合列表类型
对于一个特别复杂的结构的项目，你想创建一个各种各样的缩进级别的项目符号和编号列表。
您可以用的，，和按钮来创建一个组合，准确地反映您的数据结构。
一个复杂的结构嵌套的项目符号和编号列表
3.11.超链接
1.1.6.链接和电子邮件
CKEDITOR 的链接功能，是一个功能强大的选项，点击的超链接或e-mail地址，您可以添加到你的文件，以及控制它们的外观和工作方式。
要插入一个链接到你的文件，按工具栏上的按钮，或者使用键盘快捷键Ctrl+L组合键。
如果你想给一个文本片段创建链接，要先选择它。
如果没有文本被选中时，链接将显示的为url或者email地址。
该链接将打开对话窗口，让您选择的链路类型和配置选项有关你的选择。
它包含两个或四个选项卡，组链接选项，根据不同的链接类型：
∙
∙（此选项卡仅适用于URL链接类型）
∙（此选项卡仅适用于URL链接类型）
∙
1.1.7.链接类型：
URL
URL是默认的链路类型，可以让你的网站地址添加到您的文档。
对于这种链接所有四个选项卡的链接对话框窗口的。
1.1.8.链接信息
“ 链接信息 “选项卡是默认选项卡，打开后，按下工具栏上的按钮。
它可以让你选择的链路类型，以及设置链路层协议和URL。
链接信息“选项卡的”链接“窗口的URL链接类型
以下是一个概括的所有链接信息 “选项卡元素：
∙链接类型 -的链路将被插入到文档的类别。
您可以选择以下选项：
oURL -网络地址，在互联网上，像一个网站，一个PDF文件或图像的任何资源。
示例：
o链接锚文本 -读者指向文档中的指定点的内部链接。
示例：
＃anchor1
o电子邮件 -e-mail地址。
示例：
myname@
∙协议 -使用的通信协议与网络地址。
您可以选择以下选项：
http:
//，https:
//开头，ftp:
//，新闻:
//或->“之间。
∙URL -网络地址的链接所指向的资源。
它可以位于同一台服务器上的网站，您目前或在外部服务器上。
o外部服务器：
如果你想使用一个外部地址，使用完整的绝对路径。
示例：
o本地服务器：
如果资源位于同一台服务器上，你可以使用相对路径，省略了域名，并开始以斜线。
示例：
/公司简介/mission.html
/HOWTO/printing.avi的
CKEditor是集成的文件浏览器（如），你也可以使用“ 浏览服务器“按钮，选择在服务器上可用的资源。
1.1.9.目标
“ 目标 “选项卡仅适用于URL链接类型。
它指定的链接后，将打开你点击它的位置。
默认情况下，没有设定目标的URL链接将打开的文件在同一个浏览器窗口或选项卡。
目标“选项卡中的”链接“窗口的URL链接类型
此选项卡只包含一个元素列表，让你选择的位置链接将打开一个下拉目标。
该列表包含以下选项：
∙“<未设置>” -打开链接的文件在同一个浏览器窗口或选项卡的默认设置。
∙ -打开链接的目标框架名称 “文本框中指定的帧的设置。
该文本框是唯一可见的，，后选择的目标。
目标“选项卡中的链接窗口与帧类型选择为目标的URL链接
∙<弹出窗口> -设置，在弹出的窗口名称 “文本框中指定在弹出的窗口中打开链接。
该文本框是唯一可见的，可设置弹出窗口的属性。
目标“选项卡中的链接窗口的URL链接弹出的窗口中，选择为目标
∙如果您选择打开一个弹出式窗口中的链接，您可以配置一些进一步的选项，在弹出的控件的外观。
但是，请注意，用户的浏览器设置可能会覆盖这些选项，在弹出的窗口中，而不是出现在一个标准的新的浏览器选项卡或窗口。
有以下选项可供选择：
o可调整大小 -此参数控制是否在弹出的窗口可以调整大小。
o状态栏 -此参数控制是否在弹出的窗口中，将包含状态栏。
o地址栏 -此参数控制是否在弹出的窗口中，将包含在地址栏中。
o工具栏 -此参数控制是否在弹出的窗口中，将包含工具栏。
o菜单栏 -此参数控制是否在弹出的窗口中，将包含菜单栏。
o全屏幕 -此参数控制是否在弹出的窗口将被最大化（全屏）。
o滚动条 -此参数控制是否将包含在弹出的窗口中的滚动条。
o依赖 -此参数控制是否在弹出的窗口将关闭，在打开的窗口中关闭（仅在Netscape）。
o宽度 -在弹出的窗口的宽度。
o高度 -在弹出的窗口的高度。
o左侧位置 -的偏移量从屏幕的左侧的弹出式窗口。
o顶部的位置 -的偏移量从屏幕顶部的弹出式窗口。
∙新窗口（_blank） -在新窗口中打开链接的设置。
∙整页（_top） -在一个窗口中，其位于顶部的设置中打开链接。
∙本窗口（_self） -打开链接的设置在同一窗口中的文件。
∙父窗口（_parent） -设置的窗口中打开链接的文档窗口是嵌套的。
1.1.10.上传
“ 上传 “选项卡仅适用于URL链接类型。
上传选项卡的链接对话框窗口允许你把你的自己的服务器资源。
如果服务器接受文件上传的用户和CKEditor是集成了一个文件浏览器（如），它是唯一可见的。
上传选项卡上的“链接”窗口的URL链接类型
要上传的文件，单击“文件输入字段旁边的浏览按钮。
当您的操作系统的文件浏览器打开时，导航到相应的文件夹，双击或使用打开按钮，选择一个文件。
要发送到服务器的文件，单击“ 上传到“服务器”按钮，“ 链接信息 “选项卡将打开，并上载的文件的URL会自动出现在URL字段。
1.1.11.高级
高级 “选项卡可让您配置额外的链接选项，如分配一个ID，一个类，一个Tab键索引，工具提示，或CSS样式属性。
其目的是为高级用户提供的HTML和CSS知识，并提供几乎无限的可能性的演示文稿的链接。
高级“选项卡上的”链接“窗口
以下是所有高级选项卡元素的概述：
∙ID -在文档中的链接元素的id属性的唯一标识符。
∙语言的文字方向 -方向：
左到右（LTR）或从右到左（RTL）（迪尔属性）。
∙访问键 -键盘快捷键访问链接元素的accesskey属性。
∙产品名称 -链接元素的名称（名称属性）。
∙语言代码 -根据（郎属性）指定的链接元素的语言。
∙“Tab键索引” -的链接元素的tabindex属性的Tab键顺序。
∙标题 -文本的显示工具提示，当鼠标光标悬停在链接（标题属性）。
∙内容类型 -内容的链路类型（类型属性）。
∙样式表名称 -类的链接元素（类的属性）。
需要注意的是一个链接元素可能会被分配一个以上的类。
如果是这样的情况下，单独的类名中包含空格。
∙字符集编码 -字符集的链接的资源（字符集属性）。
∙关联 -当前的文件和链接目标（REL属性）之间的关系。
∙行内样式 -CSS样式定义（样式属性）。
请注意，每个值都必须以分号和个人，应以空格分隔。
1.1.12.链接类型：
链接锚文本中
如果你想为指向的文件中预先设定一个，链接锚文本链接类型“下拉列表中选择。
当你选择了这个链接类型，两个连接 “窗口选项卡将成为链接信息 “选项卡和高级选项卡。
请注意，如果你没有在文档中定义的任何锚，一条消息，告诉你，将显示在“ 链接信息 “选项卡。
文件中定义的无锚链接信息“选项卡上的链接窗口
当你添加锚点到您的文档，您将可以选择从下拉列表中的“ 链接信息 “选项卡。
链接信息“选项卡上的链接窗口中的链接锚文本链接的类型
“ 链接信息 “选项卡包含以下选项中选择一个锚一件容易的事：
∙锚名称 -一个下拉列表，其中包含在文档中建立的所有锚的名称。
∙通过元素ID -一个下拉列表，其中包含所有的锚建立在文档中包含的ID属性的标识符。
注：
为了添加一个id一个锚，你需要。
对于所有的高级选项卡元素的详细说明，请参阅上面的部分。
1.1.13.链接类型：
电子邮件
CKEDITOR很容易地插入到你的文件可点击e-mail地址，甚至添加的e-mail消息，当你点击链接时，将创建一个主题和正文。
如果你要添加一个超链接的文档的e-mail地址，邮件的链接类型“下拉列表中选择电子邮件。
如下图
链接信息“选项卡上的链接窗口中的E-mail链接类型
“ 链接信息 “选项卡可让您配置的收件人和邮件内容包含以下字段：
∙E-Mail地址 -收件人的e-mail消息的地址。
此字段是强制性的e-mail链接工作。
∙留言主题 -将被粘贴到电子邮件消息的主题行中的默认文本。
∙“邮件正文” -将被粘贴到电子邮件消息，其内容的默认文本。
对于所有的高级选项卡元素的详细说明，请参阅上面的部分。
1.1.14.移除链接
当光标被放置在一个链接，在工具栏上的按钮将被激活。
按下该按钮，删除该链接。
另外，您还可以打开元素的右键菜单中按鼠标按钮或使用菜单/应用程序键在键盘上，选择“ 取消链接“命令。
3.12.锚
CKEDITOR支持将锚文本文件。
要插入支架，按下工具栏上的按钮。
下面的Anchor属性“窗口中会出现：
Anchor属性“窗口中CKEDITOR
为了创造一个锚点，锚点名称 “文本框中输入其名称，。
一旦你点击“确定”，该图标将出现在文档中。
请注意，锚可以导致一个文件（如果没有被选中文本，同时创建了锚）中的一个点，看起来就像下面的例子：
锚插入到文档中，没有文本选择
或者，如果先在文档中选中一些内容，这个选择将显示一个蓝色的虚线边框周围，就像这个例子：
锚插入到文档中选择一些文本
现在，您可以创建一个链接到你的锚的按钮。
一旦准备就绪，您的文档的链接将带读者一节标有锚。
插入到文档中的链接指向它的一个锚
1.1.15.移除锚点
删除一个锚一样容易将它添加。
当光标被放置在一个锚点，删除锚点上下文菜单命令可。
按下鼠标按钮或使用菜单/应用程序键在键盘上打开该元素的上下文菜单，并选择“ 删除锚点“命令。
此选项会删除锚点从文件和，叶纯文本。
删除的锚锚上下文菜单命令可用于
3.13.Flash
CKEDITOR让您文件添加到您的文档在一个简单而直观的方式。
为了插入一个Flash对象，按工具栏上的按钮。
Flash属性 “对话框将打开的窗口，让你设置的配置选项定义Flash对象的来源，它的大小，显示属性，或其他先进的性能。
Flash属性 “窗口中包含四个选项卡，组Flash对象选择：
∙常规
∙上载
∙属性
∙高级
3.13.1.常规
在常规选项卡的默认选项卡打开后，按下工具栏上的按钮。
它允许您设置的URL的Flash对象和配置方式，它会出现在文件中。
常规“选项卡上的”Flash属性“窗口中
下面是一个概述的所有常规 “选项卡元素：
∙URL -网络地址的Flash对象。
可能位于您目前或在外部服务器上的网站在同一服务器上的对象。
o外部服务器：
如果你想使用一个外部地址，使用完整的绝对路径。
示例：
o本地服务器：
如果图像位于同一台服务器上，你可以使用相对路径，省略了域名，并开始以斜线。
示例：
/animation/flash2.swf
CKEditor是集成的文件浏览器（如），你也可以使用“ 浏览服务器“按钮，选择一个Flash对象从服务器上可用的。
∙宽度 -Flash对象的宽度（以像素为单位）。
∙高度 -Flash对象的高度，以像素为单位。
∙水平间距 -Flash对象和其他文档元素，围绕着它，以像素为单位之间的水平间距
∙垂直间距 -Flash对象和其他文档元素，围绕着它，以像素为单位之间的垂直间距
∙预览 -一个初步的看法，选定的Flash对象根据上述选择格式化。
3.13.2.上传
Flash属性 “窗口的“ 上传 “选项卡允许您发送您自己的Flash对象到服务器。
。
上传的Flash属性“窗口中的选项卡
要上传一个Flash文件，请单击“文件输入字段旁边的浏览按钮。
当您的操作系统的文件浏览器打开时，导航到相应的文件夹，双击或使用打开按钮，选择一个文件。
要发送到服务器的文件，单击上传到服务器按钮
3.13.3.属性
“ 属性 “选项卡可让您设定不同的的闪光灯选项来控制插入的对象的行为。
他们还提供了访问AdobeFlashPlayer设置，使该对象自动播放或循环。
属性“选项卡上的”Flash属性“窗口中
以下是所有属性选项卡元素的概述：
∙缩放 -参数来控制缩放，拉伸或压缩，当浏览器窗口的大小（规模属性）的Flash对象。
您可以选择以下选项：
o全部显示 -保留原始的宽高比整个对象是可见的。
边界可能存在的。
o无边框 -对象进行缩放以适合指定的区域内没有任何边界，保留原始高宽比（两侧的对象，可能会出现）。
o精确匹配 -，整个对象指定的区域内是可见的，但可能不会保留原来的宽高
升级会员 