ckeditor 3种不同的正文样式，用于整页预览

Question

在ckeditor 3中输入整页预览时，是否可以更改正文样式。也许可以为整页设置与不在整页模式下不同的正文样式。这是因为在浏览器最大化的大屏幕上查看网页时使用了ckeditor。。。在这种情况下，它非常宽，很难阅读内容。所以我想添加正文样式（但仅适用于整页模式），比如：

...
margin: 5%;
padding: 5%;
border: 1px dotted #666;
...

这将为内容提供更多的文本处理器外观。

TNX！

Answer 1

当CKEditor切换到全屏模式时，它会将"cke_maximized"类添加到容器span中。

因此，您可以将样式应用于整个容器跨度（主体+工具栏），如：

.cke_maximized{
   margin: 5%;
   padding: 5%;
   border: 1px dotted #666;
}

或仅用于内容主体：

.cke_maximized iframe{
   margin: 5%;
   padding: 5%;
   border: 1px dotted #666;
}

这些只是示例，您可以尝试并选择更适合您的css选择器。

更新1:

当然，如果javascript代码对您的目的还不够，您可以使用它。你可以使用这样的东西：

var editor = CKEDITOR.instances.editor1;
editor.on("afterCommandExec", function(e){
  if(e.data.name == 'maximize'){
      // maximized
      if(e.data.command.state == CKEDITOR.TRISTATE_ON){
          // add special css class to body(e.editor.document.getBody())
      } else {
      // minimized
      // remove special css from body
      }  
  }
});