CKEditor结合了内联样式

Question

重现的步骤

我正在使用内联CKEditor。我使用字体大小，行高和＆amp;字体系列插件。所有这些都适用于嵌套跨度。

E.g。文字输入是 - “CKEditor很棒”

当我应用以下命令时。

• 1. 添加后 - 字体系列：

<span style='font-family: Arial;'>CKEditor is awesome</span>

• 1. 添加后 - 字体大小：

<span style='font-family: Arial;'><span style='font-size: 30px'>CKEditor is awesome</span ></span >

• 1. 添加行高后：

<span style='font-family: Arial;'><span style='font-size: 30px;'><span style='line-height:50px'>CKEditor is awesome</span ></span ></span >

所以，所有这些都添加在嵌套的span元素中。

预期结果

<span style='font-family: Arial;font-size: 30px;line-height:50px'>CKEditor is awesome</span>

OR

<span class="target_class" style='font-family: Arial;font-size: 30px;line-height:50px'>CKEditor is awesome</span>

实际结果

<span style='font-family: Arial;'><span style='font-size: 30px;'><span style='line-height:50px'>CKEditor is awesome</span></span></span>

其他详情

为了获得预期的结果，我使用下面的代码片段为每个范围添加公共类

CKEditor Version: 4.4.2

config.fontSize_style       = { element : 'span', styles: { 'font-size': '#(size)' }, attributes : { 'data-font-size': '#(size)', 'class' : 'target_class' } };

config.cp_line_height_style = { element : 'span', styles: { 'line-height': '#(size)' }, attributes : { 'data-line-height': '#(size)', 'class' : 'target_class' } };