javascript - 债权人 - 将外部样式表应用于 CKEditor textarea 中的内部文本

Question

我知道很多人问过类似的问题，但我想要的是别的东西。

我喜欢 CKEditor，但有一件事困扰着我，即内联样式。我想摆脱它。我添加了这段代码来自定义下拉列表:

    CKEDITOR.stylesSet.add( 'default', [
                // Block Styles
                { name: 'Blue Title',       element: 'h3',      attributes: { 'class': 'Blue' } },
                { name: 'Red Title',        element: 'h3',      attributes: { 'class': 'Red' } },

                // Inline Styles
                { name: 'Marker: Yellow',   element: 'span',    attributes: { 'class': 'Yellow' } },
                { name: 'Marker: Green',    element: 'span',    attributes: { 'class': 'Lime' } }


            ] );

如您所见，我没有为元素使用任何样式，只是类。现在，当我单击下拉列表并选择其中任何一个时，我得到了:

<p><span class="Yellow">this is a paragraph</span></p>

这很好。但是下拉列表没有样式，所见即所得文本区域中的文本没有更改。

我试过了

CKEDITOR.config.contentsCss = '/myStyle.css';

把这段代码放进去

#Yellow{
background-color: #ffff00;
}

#Lime{
background-color: lime;
}

但仍然没有任何反应。

我使用了“stylesparser”和“stylescombo”插件，但还是不行。 (或者我不知道如何配置它们)

我试图将这些 css 行放入 contents.css 文件中，但没有任何反应。

我想知道，我所问的在 CKEditor 中是否可行？如果是，如何？如果否，是否有任何其他编辑器可以给我此功能？

非常感谢

Answer 1

在深入研究每一件事之后，我发现我在我的 css 中使用“#”来定义类样式。将其更改为“。”之后一切都如我所料。没有内联样式，当我将样式应用于段落或文本时，它变得可视化并且不需要任何额外的插件。