CKEditor通常所指的就是fCKEDITOR，是优秀的网页编辑器，能够支持多种编程语言，使用的人越来越多，那么Linux下要如何使用网页编辑器CKEditor呢？下面小编就给大家介绍下Linux使用CKEditor的方法。

　　一、使用方法：

　　1、在页面《head》中引入ckeditor核心文件ckeditor.js

　　《script type=“text/javascript” src=“ckeditor/ckeditor.js”》《/script》

　　2、在使用编辑器的地方插入HTML控件《textarea》

　　《textarea id=“TextArea1” cols=“20” rows=“2” class=“ckeditor”》《/textarea》

　　如果是ASP.NET环境，也可用服务器端控件《TextBox》

　　《asp:TextBox ID=“tbContent” runat=“server” TextMode=“MultiLine” class=“ckeditor”》《/asp:TextBox》

　　注意在控件中加上 class=“ckeditor” 。

　　3、将相应的控件替换成编辑器代码

　　《script type=“text/javascript”》

　　CKEDITOR.replace（‘TextArea1’）;

　　//如果是在ASP.NET环境下用的服务器端控件《TextBox》

　　CKEDITOR.replace（‘tbContent’）;

　　//如果《TextBox》控件在母版页中，要这样写

　　CKEDITOR.replace（‘《%=tbContent.ClientID.Replace（“_”，“$”） %》’）;

　　《/script》

　　4、配置编辑器

　　ckeditor的配置都集中在 ckeditor/config.js 文件中，下面是一些常用的配置参数：

　　// 界面语言，默认为 ‘en’

　　config.language = ‘zh-cn’;

　　// 设置宽高

　　config.width = 400;

　　config.height = 400;

　　// 编辑器样式，有三种：‘kama’（默认）、‘office2003’、‘v2’

　　config.skin = ‘v2’;

　　// 背景颜色

　　config.uiColor = ‘#FFF’;

　　// 工具栏（基础‘Basic’、全能‘Full’、自定义）plugins/toolbar/plugin.js

　　config.toolbar = ‘Basic’;

　　config.toolbar = ‘Full’;

　　这将配合：

　　config.toolbar_Full = ［

　　［‘Source’，‘-’，‘Save’，‘NewPage’，‘Preview’，‘-’，‘Templates’］，

　　［‘Cut’，‘Copy’，‘Paste’，‘PasteText’，‘PasteFromWord’，‘-’，‘Print’， ‘SpellChecker’， ‘Scayt’］，

　　［‘Undo’，‘Redo’，‘-’，‘Find’，‘Replace’，‘-’，‘SelectAll’，‘RemoveFormat’］，

　　［‘Form’， ‘Checkbox’， ‘Radio’， ‘TextField’， ‘Textarea’， ‘Select’， ‘Button’， ‘ImageButton’， ‘HiddenField’］，

　　‘/’，

　　［‘Bold’，‘Italic’，‘Underline’，‘Strike’，‘-’，‘Subscript’，‘Superscript’］，

　　［‘NumberedList’，‘BulletedList’，‘-’，‘Outdent’，‘Indent’，‘Blockquote’］，

　　［‘JustifyLeft’，‘JustifyCenter’，‘JustifyRight’，‘JustifyBlock’］，

　　［‘Link’，‘Unlink’，‘Anchor’］，

　　［‘Image’，‘Flash’，‘Table’，‘HorizontalRule’，‘Smiley’，‘SpecialChar’，‘PageBreak’］，

　　‘/’，

　　［‘Styles’，‘Format’，‘Font’，‘FontSize’］，

　　［‘TextColor’，‘BGColor’］

　　］;

　　//工具栏是否可以被收缩

　　config.toolbarCanCollapse = true;

　　//工具栏的位置

　　config.toolbarLocation = ‘top’;//可选：bottom

　　//工具栏默认是否展开

　　config.toolbarStartupExpanded = true;

　　// 取消 “拖拽以改变尺寸”功能 plugins/resize/plugin.js

　　config.resize_enabled = false;

　　//改变大小的最大高度

　　config.resize_maxHeight = 3000;

　　//改变大小的最大宽度

　　config.resize_maxWidth = 3000;

　　//改变大小的最小高度

　　config.resize_minHeight = 250;

　　//改变大小的最小宽度

　　config.resize_minWidth = 750;

　　// 当提交包含有此编辑器的表单时，是否自动更新元素内的数据

　　config.autoUpdateElement = true;

　　// 设置是使用绝对目录还是相对目录，为空为相对目录

　　config.baseHref = ‘’

　　// 编辑器的z-index值

　　config.baseFloatZIndex = 10000;

　　//设置快捷键

上一页1234下一页共4页

　　config.keystrokes = ［

　　［ CKEDITOR.ALT + 121 /*F10*/， ‘toolbarFocus’ ］， //获取焦点

　　［ CKEDITOR.ALT + 122 /*F11*/， ‘elementsPathFocus’ ］， //元素焦点

　　［ CKEDITOR.SHIFT + 121 /*F10*/， ‘contextMenu’ ］， //文本菜单

　　［ CKEDITOR.CTRL + 90 /*Z*/， ‘undo’ ］， //撤销

　　［ CKEDITOR.CTRL + 89 /*Y*/， ‘redo’ ］， //重做

　　［ CKEDITOR.CTRL + CKEDITOR.SHIFT + 90 /*Z*/， ‘redo’ ］， //

　　［ CKEDITOR.CTRL + 76 /*L*/， ‘link’ ］， //链接

　　［ CKEDITOR.CTRL + 66 /*B*/， ‘bold’ ］， //粗体

　　［ CKEDITOR.CTRL + 73 /*I*/， ‘italic’ ］， //斜体

　　［ CKEDITOR.CTRL + 85 /*U*/， ‘underline’ ］， //下划线

　　［ CKEDITOR.ALT + 109 /*-*/， ‘toolbarCollapse’ ］

　　］

　　//设置快捷键 可能与浏览器快捷键冲突 plugins/keystrokes/plugin.js.

　　config.blockedKeystrokes = ［

　　CKEDITOR.CTRL + 66 /*B*/，

　　CKEDITOR.CTRL + 73 /*I*/，

　　CKEDITOR.CTRL + 85 /*U*/

　　］

　　//设置编辑内元素的背景色的取值 plugins/colorbutton/plugin.js.

　　config.colorButton_backStyle = {

　　element ： ‘span’，

　　styles ： { ‘background-color’ ： ‘#（color）’ }

　　}

　　//设置前景色的取值 plugins/colorbutton/plugin.js

　　config.colorButton_colors = ‘000，800000，8B4513，2F4F4F，008080，000080，4B0082，696969，B22222，A52A2A，DAA520，

　　006400，40E0D0，0000CD，800080，808080，F00，FF8C00，FFD700，008000，0FF，00F，EE82EE，

　　A9A9A9，FFA07A，FFA500，FFFF00，00FF00，AFEEEE，ADD8E6，DDA0DD，D3D3D3，FFF0F5，

　　FAEBD7，FFFFE0，F0FFF0，F0FFFF，F0F8FF，E6E6FA，FFF’

　　//是否在选择颜色时显示“其它颜色”选项 plugins/colorbutton/plugin.js

　　config.colorButton_enableMore = false

　　//区块的前景色默认值设置 plugins/colorbutton/plugin.js

　　config.colorButton_foreStyle = {

　　element ： ’span‘，

　　styles ： { ’color‘ ： ’#（color）‘ }

　　};

　　//所需要添加的CSS文件 在此添加 可使用相对路径和网站的绝对路径

　　config.contentsCss = ’。/contents.css