javascript - ckeditor，如何调整换行代码显示样式

Question

我正在测试 CKEditor

我正在尝试在编辑器中显示，以匹配我的站点 css 样式以显示最终结果。

我想做的是通过添加一个类来设计“换行代码”按钮以匹配我网站的 css。

我在 this page of the manual 上看过，你可以做这样的事情:

config.format_pre = { element: 'pre', attributes: { 'class': 'editorCode' } };

但是，像这样对代码块做同样的事情:

config.format_code = { element: 'code', attributes: { 'class': 'someclass' } };

实际上什么都不做。有人知道我可能遗漏了什么吗？

我已经在其他元素上测试过它，所以我知道配置文件的更改正在被提取。

Answer 1

一件重要的事情是，每个通过 config.format_tagname 格式化的标签也应该包含在 config.format_tags 中。 .但是，这两个设置(config.format_tagname 和 config.format_tags)仅适用于 block 级元素(如您引用的 manual page 中所述)。

由于 code 元素被 CKEditor 视为内联元素(参见 DTD )，因此无法在此处使用此配置。

但是，修改通过 Style 下拉列表添加的元素的最简单方法是编辑 CKEditor 目录中的 styles.js 文件。下拉样式基于此文件，因此您可以轻松修改 code element there .您还可以定义自定义 stylesSet .