简体   繁体   English

如何禁用CKEditor对话框皮肤?

[英]How to disable CKEditor dialog skin?

I hope somebody can give me some idea on this. 我希望有人可以就此提出一些建议。 I have a CKEditor 3.6 dialog which contains a single element of type html and loads an external page (or actually it's body html content). 我有一个CKEditor 3.6对话框,其中包含一个html类型的单个元素,并加载一个外部页面(或实际上它的正文html内容)。 The style sheet for that page is loaded by MediaWiki 1.17 resource loader. 该页面的样式表由MediaWiki 1.17资源加载器加载。 My problem is that CKEditor skin takes priority over my style sheet. 我的问题是CKEditor皮肤优先于我的样式表。 In firebug I can even disable CKEditor styles and see how the page gets it's original shape. 在firebug中,我甚至可以禁用CKEditor样式,并查看页面如何获得它的原始形状。 Is there a way maybe to disable CKEditor style sheet for this dialog or lower its priority? 有没有办法可以为此对话框禁用CKEditor样式表或降低其优先级? Or any other way to solve this? 或者任何其他方式来解决这个问题? Any ideas will be appreciated. 任何想法将不胜感激。

Update: so simpler question is how can I remove inherited CSS properties which break my design? 更新:如此简单的问题是如何删除破坏我的设计的继承的CSS属性?

Please check something with Firebug: 请用Firebug检查一下:

Open your dialog window and right click in the HTML element that contains the external content, then select "Inspect Element". 打开对话框窗口并右键单击包含外部内容的HTML元素,然后选择“Inspect Element”。

In Firebug, select the HTML panel, then select the Style pane on the right side and make sure that the "Only Show Applied Styles" option is Not checked. 在Firebug中,选择HTML面板,然后选择右侧的“样式”窗格,并确保未选中“仅显示应用样式”选项。

Look at the right side of the style pane where the source file for each style block is shown, do you see that your style sheet (from the resource loader) is providing some of the styles? 查看样式窗格右侧显示每个样式块的源文件,您是否看到样式表(来自资源加载器)提供了一些样式?

Do the styles from your style sheet all have lines through them to indicate that they've been overridden? 样式表中的样式是否都有通过它们的线条以表示它们已被覆盖?

In the past, I've used the information from the HTML and Style panes to create more targeted selectors for the styles, you may be able to over-ride the editor styles using that approach. 过去,我使用HTML和Style窗格中的信息为样式创建更有针对性的选择器,您可以使用该方法覆盖编辑器样式。


Please provide the code being used: 请提供正在使用的代码:

What is the structure of the external HTML content (including any classes and ids or styles)? 外部HTML内容的结构是什么(包括任何类和ID或样式)?

Is the entire block enclosed in a container (div or table)? 整个块是否包含在容器(div或table)中?

Are any of your styles targeted through the <body> tag of the external page? 您的任何样式是否都通过外部页面的<body>标记进行定位?

For the dialog code, you can strip out any functionality, unless it's pertinent like .addClass() . 对于对话框代码,您可以删除任何功能,除非它与.addClass() Just show the structure of the tab like so: 只需显示选项卡的结构:

CKEDITOR.dialog.add( 'Plugin Name', function( editor )
{
  return {
    title : Plugin.title,
    minWidth : 350,
    minHeight : 230,
    contents : [
      {
        id : 'TabId',
        label : Lang.TabId,
        title : Lang.TabId,
        elements :
        [
          {
            id : 'ElementId',
            type : 'html',
            label : Lang.ElementId,
            title : Lang.ElementId,
            style : 'text-align: center;',
            html : '<div>' + Some Content + '</div>',
            children :
            [

Viewing the code will make it easier to answer your question. 查看代码可以更轻松地回答您的问题。

Be Well, 好吧,
Joe

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM