定义样式
样式定义是一个JavaScript数组，通过调用CKEDITOR.stylesSet.add函数注册。必须给样式定义赋以唯一的名字，这样后面就可以配置每个编辑器实例来加载它。这种方法可以使一个样式定义被页面中多个CKEditor实例共享。
下面的代码展示了如何注册一个例子样式定义。
CKEDITOR.stylesSet.add( 'my_styles', [
// Block-level styles
{ name: 'Blue Title', element: 'h2', styles: { 'color': 'Blue' } },
{ name: 'Red Title' , element: 'h3', styles: { 'color': 'Red' } },
// Inline styles
{ name: 'CSS Style', element: 'span', attributes: { 'class': 'my_style' } },
{ name: 'Marker: Yellow', element: 'span', styles: { 'background-color': 'Yellow' } }
]);
如上面所示的样式定义注册可以内置于页面源代码中，或者存在于外部文件中，只要需要时，“按需”加载。（见下面）。
当准备好定义后，你必须通过使用stylesSet设置使编辑器应用新注册的样式。这可以在config.js文件中设置，例如：
config.stylesSet = 'my_styles';
使用外部样式定义文件
可以将样式定义的注册调用包含在一个外部JavaScript文件中。缺省情况，CKEditor从其安装文件夹中的styles.js文件中加载样式定义。
你的样式定义文件可以保存在站点的任意地方（或互联网的某个地方）。但，你必须知道访问它所需的URL。例如，你可以将此文件保存在站点的根目录中，然后按/styles.js调用它，或者放在其它任意地方，并使用其完整的URL引用它，如http://www.example.com/styles.js。
此时，改变stylesSet设置，使编辑器指向此文件：
config.stylesSet = 'my_styles:/styles.js'; //或者 config.stylesSet = 'my_styles:http://www.example.com/styles.js';
样式定义设置的语法总是：样式定义名称:文件的URL。
注意，必须使用在此文件中注册样式定义时使用过的唯一的名称。
样式规则
在样式定义中的输入项称为“样式规则”。每条规则定义了单个样式的显示名字和元素、属性以及所使用的CSS样式。下面是它的一般表现形式：
{
name: 'Name displayed in the Styles drop-down list',
element: 'HTML element name (for example "span")',
styles: {
'css-style1': 'desired value',
'css-style2': 'desired value',
...
}
attributes: {
'attribute-name1': 'desired value',
'attribute-name2': 'desired value',
...
}
}
名称和元素值是必须的，而其它的值是可选的。
样式的类型
有三种样式类型，每一种都与在样式规则中使用的元素相关: