ckeditor_学习(2) 功能概览

这篇文章用来说明 ckeditor 的所有可配置的功能，分为终端用户配置和开发者配置

1.终端用户配置

用户接口 – 设置编辑器的UI和语言
Editor 尺寸设置 – 设置编辑器的尺寸
插入内容 – 添加丰富的插入内容，图片，代码，表格，数学公式.
文本样式 – 设置文本样式.
文档代码编辑 –编辑文档的源代码.
能力支持 – 一些可对残障人士提供帮助的工具.

2.开发者配置

编辑器UI – 编辑UI.
工具栏 – 自定义工具栏.
API 接口 – 使用 CKEditor API.
输出控制 – 调整编辑器的输出通过设置html的格式.
工具集 – 额外的工具，是编辑器配置和扩展更简单.

1.1 用户接口

通过配置config.uiColor (rgb 格式）的对头部颜色进行配置。

config.uiColor = #66AB16;

通过配置config.defaultLanguage 对编辑器语言进行设置

config.defaultLanguage = 'de';

1.2 尺寸设置

1.2.1 基础尺寸设置

config.width = 500;        // 500 pixels high.
config.height = '25em';     // CSS unit (em).

通过对cofnig.height和cofnig.width设置，控制编辑器的宽高。只对经典样式的编辑器有用，对行内编辑器无效

1.2.2 高度自动增加

添加Auto-grow插件是编辑器高度跟随文章内容自适应，高度增加了用户编辑内容是离工具栏的距离就远了，看具体的项目需求吧。

通过config.extraPlugins 添加autogrow 插件，可以对autogrow 插件进行自定义配置

config.extraPlugins = 'autogrow';
config.autoGrow_minHeight = 250;// 设置编辑器最小高度
config.autoGrow_maxHeight = 600;// 设置编辑器最大的高度 在最小和最大高度之间会高度会适应内容高度

其他参数配置

config.autoGrow_onStartup = true; // 设置为true 编辑器在创建和内容高度变化的时候更新高度，如果不设置会在编辑器每次获得焦点的时候更新高度出发浏览器的重绘增加不必要的开销

config.autoGrow_bottomSpace = 50; // 文本内容距离编辑器底部的距离。

config.removePlugins = 'resize'; // 移除resize插件，设置了autogrow功能，resize功能就可以不使用，这两个都是为了解决高度问题的插件。

转载于:https://www.cnblogs.com/pipu-qiao/p/8492100.html

ckeditor_学习(2) 功能概览相关推荐

Smartbi电子表格版功能概览
Smartbi电子表格作为新一代的Java web报表工具,它具有什么功能?有哪些特点?相对其他报表产品相比有什么优势?通过下面的功能概览,帮助大家认识电子表格产品. 软件的安装 Smartbi电子表 ...
2月份隐私计算、联邦学习的市场概览
2月份隐私计算.联邦学习的市场概览摘要:在隐私计算市场中,三股信息流如清风拂面,流转不息.采购意向,犹如花开满园,为供应商和服务提供商探明商机:招标信息,如云卷云舒,为客户了解市场动态提供重要参考: ...
系列博文-Three.js入门指南(张雯莉)-静态demo和three.js功能概览
一:一个最简单的静态DEMO //body加载完后触发init() //WebGL的渲染是需要HTML5 Canvas元素的,你可以手动在HTML的<body>部分中定义Canvas元素, ...
kail linux稳定版本,Kali Linux 2020.3 稳定版已发布更新后新功能概览
Kali Linux 2020.3稳定版已发布,新版带来了许多令人印象深刻的更新,例如引入 zsh,并宣布从 bash 切换至 zsh 的计划(目前仍然默认使用 bash,2020.4 将默认使用 z ...
JDK 6中新增的Java Console类功能概览
转载自 JDK 6中新增的Java Console类功能概览 JDK 6中提供了java.io.Console类专用来访问基于字符的控制台设备.如果你的Java程序要与Windows下的cmd或者L ...
lua本学习笔记功能
Lua本学习笔记功能 1. 函数返回指定任务的主要功能是完成,在这种情况下,函数被用作调用语句.函数可以计算并返回值,在这种情况下,作为分配值表达式语句使用. 语法: funcationfunc_ ...
百词斩英语单词小助手（主要实现英语单词学习的功能。用户可对词典文件中的单词进行预览，增删改查。同时还可进行中英、英中测试。本系统还提供了测试成绩的显示功能。）
struct word //单词的结构体 {char en[MAX_CHAR]; // 英文形式char ch[MAX_CHAR]; //中文形式 } s[MAX_NUM]; //单词数组 int n ...
C#软件开发实例.私人订制自己的屏幕截图工具（一）功能概览
本实例全部文章目录 (一)功能概览 (二)创建项目.注册热键.显示截图主窗口 (三)托盘图标及菜单的实现 (四)基本截图功能实现 (五)针对拖拽时闪烁卡顿现象的优化 (六)添加配置管理功能 (七)添加 ...
【PM模块】操作功能概览
操作功能一.概览在IDES订单处理过程中,先是收集维护需求,然后对维护订单进行处理. 这一过程包含包含了以下步骤: 通知计划调度执行结束二.工作台和角色工作台为其他系统提供了一个标准化 ...