Ckeditor 样式:图像在编辑器中向右浮动

Ckeditor 样式:图像在编辑器中向右浮动,ckeditor,styles,Ckeditor,Styles,我需要能够在ckeditor中将图像向右或向左浮动,如本例所示: (请参见“增强图像”下的) 我已经下载了插件,并将以下代码添加到我的ckeditor replace中: extraPlugins: 'image2', removePlugins: 'loremipsum, texttransform, liveedit', image2_alignClasses: [ 'image-left', 'image-center', 'image-right' ],

我需要能够在ckeditor中将图像向右或向左浮动,如本例所示:

(请参见“增强图像”下的)

我已经下载了插件,并将以下代码添加到我的ckeditor replace中:

extraPlugins: 'image2',
          removePlugins: 'loremipsum, texttransform, liveedit',
    image2_alignClasses: [ 'image-left', 'image-center', 'image-right' ],
    image2_captionedClass: 'image-captioned'...
然后,在我的css文件中,我将类浮动到它们各自的值:left,right(当我选择将图像浮动到右侧时,在源代码下,我看到它被赋予了类图像右侧)。到目前为止还不错,但正如我所说,更改需要在ckeditor中进行。用户需要查看文档的外观

在样式中,我需要在哪里或什么地方更改ckeditor中的行为?我查看了样式文档,但仍然不清楚如何操作这些类(如果我需要这样做的话)

例如:

var style = new CKEDITOR.style( { element: 'img', attributes: { 'class': 'foo' } } );
我想我需要正确地定位类图像,并给它一个浮动,对吗

建议?

如中所述,您需要在样式表中为这些类定义CSS规则。设置此配置选项后,必须向编辑器提供相应的样式定义:

  • 因为它可以通过在编辑器加载的样式表中定义其他样式来完成。加载内容的目标页面上必须提供相同的样式
  • 对于样式,可以使用
    直接定义
    ,即在页面的
    部分内
对于定义编辑器内容的样式表,请使用配置选项,例如:

config.contentsCss = [ '/css/mysitestyles.css', '/css/mywidgetstyles.css' ];

请参阅以下通过类完成的标题图像样式和对齐。

查看演示如何使用类对齐标题图像小部件。文档可以在这里找到:谢谢你把我带到正确的地方。神奇的代码是:contentsCss:[CKEDITOR.getUrl('contents.css'),//为小部件样式添加css。'assets/widgetStyles.css'],--我在js选项卡下找到了它。有点晦涩。你们做得很好…但有些事情可以说得更清楚。如果你回答这个问题,我会接受的。