Question

在ckeditor 3中输入完整页面预览时是否可以更改正文样式。可能为整页设置不同的正文样式，而不是在整页模式下。这样做的原因是在使用最大化浏览器的较大屏幕上查看网页时使用ckeditor ...在这种情况下，它非常宽并且难以阅读内容。所以我想添加一些体型（但仅适用于整页模式），例如：

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

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

TNX！

Answer 1

当CKEditor切换到全屏模式时，它会将“ cke_maximized ”类添加到容器范围。

因此，您可以为整个容器范围（正文+工具栏）应用样式，如：

.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
      }  
  }
});

ckeditor 3种不同的体型，可进行整页预览

1 个答案: