项目开发过程中,发现CKEDITOR 插件的弹出框 内 如果跟据项目需要写表格(table tr td),表格的边框等属性会被 CKEDITOR的清除或覆盖,导致表格很难看。

问题关键:

插件弹出框dialog中的 table标签的style属性,等被覆盖,即使自定义也无法生效。 初步判断是样式的优先级问题。

解决办法:自定义table的样式,使得优先级最高。

解决思路:

1.自定义样式

2.样式优先级:

a.尝试阅读源码,修改引入样式的先后顺序。但是无果。CKEDITOR是支持皮肤的,尝试过editor.css等,但是无果

b.采用样式的  !important 方式 (貌似IE6不支持吧)

3.试验,成功!

样式代码:

.editor-dialog-table table{

}

.editor-dialog-table table th{
border-width:1px !important;
border-style: solid !important;
border-color: black !important;
background-color: #4f82b4 !important;
color:#fff !important;
font-size: 14px !important;
line-height: 14px !important;
padding: 8px !important;
} .editor-dialog-table table tr{
border-width:1px !important;
border-style: solid !important;
border-color: lightgray !important;
} .editor-dialog-table table tr td{
border-width:1px !important;
border-style: solid !important;
border-color: lightgray !important;
padding: 8px !important;
}

效果截图:

这里要注意: css在哪里引用?

CKEDITOR的弹出框跟 嵌入编辑器(容器div或 textarea)所在文件平级,在这个html文件里引入即可。

另外:CKEDITOR的富文本编辑主体 由于是 iframe另外引入的,所有不同。

CKEDITOR 4.6.X 版本 插件 弹出对话框 Dialog中 表格 Table 自定义样式Style 问题的更多相关文章

  1. 10.JAVA之GUI编程弹出对话框Dialog

    在上节基础上添加对话框显示错误信息. 代码如下: /*弹出对话框显示错误信息,对话框一般不单独出现,一般依赖于窗体.*/ /*练习-列出指定目录内容*/ import java.awt.Button; ...

  2. Android 弹出对话框Dialog充满屏幕宽度

    final View view = LayoutInflater.from(context).inflate(layoutId, null); final Dialog dialog = new Di ...

  3. js弹出对话框的方法总结

    九种js弹出对话框的方法总结,需要的朋友可以参考一下 [1.最基本的js弹出对话框窗口代码] 这是最基本的js弹出对话框,其实代码就几句非常简单: <script LANGUAGE=" ...

  4. JavaScript:九种弹出对话框

    [1.最基本的js弹出对话框窗口代码] 这是最基本的js弹出对话框,其实代码就几句非常简单: <script LANGUAGE="javascript"> <!- ...

  5. js 弹出对话框的方法总结

    原文:http://www.cnblogs.com/xiaofengfeng/archive/2012/10/20/2732784.html <!DOCTYPE html PUBLIC &quo ...

  6. js插件---弹出层sweetalert2(总结)

    js插件---弹出层sweetalert2(总结) 一.总结 一句话总结: sweetalert2的效果非常好,效果比较Q萌,移动端适配也比较好,感觉比layer.js效果好点 1.SweetAler ...

  7. JavaScript插件——弹出框

    (JavaScript插件——弹出框) 前言 阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/aehyok/p/3404867.htm ...

  8. Xamarin.Forms弹出对话框插件

    微信公众号:Dotnet9,网站:Dotnet9,问题或建议,请网站留言: 如果您觉得Dotnet9对您有帮助,欢迎赞赏. Xamarin.Forms弹出对话框插件 内容目录 实现效果 业务场景 编码 ...

  9. (三)原生JS实现 - 插件 - 弹出层

    创建遮罩层 _createCover: function() { var newMask = document.createElement("div"); newMask.id = ...

随机推荐

  1. bootstrap 页面标题

    页面标题会突出显示,当一个网页中有多个标题且每个标题之间需要添加一定的间距时,页面标题显得特别有用,页面标题会给不是页面标题之间的元素加上横线 加以区分,以突出标题显示. 页面标题类 显示效果图 代码 ...

  2. asp.net mvc easyui datagrid分页

    提到 asp.net mvc 中的分页,很多是在用aspnetpager,和easyui datagrid结合的分页却不多,本文介绍的是利用easyui 中默认的分页控件,实现asp.net mvc分 ...

  3. unity3d控制模型的运动

    这里就不多做解释了,直接上代码,只为了备忘. public class HeroMove : MonoBehaviour { private float speed;//人物行动速度 private ...

  4. scrapy抓取的中文结果乱码解决办法

    使用scrapy抓取的结果,中文默认是Unicode,无法显示中文. 中文默认是Unicode,如: \u5317\u4eac\u5927\u5b66 在setting文件中设置: FEED_EXPO ...

  5. mysql-ubuntu14.04彻底卸载mysql

    删除mysql的数据文件 sudo rm /var/lib/mysql/ -R 删除mysql的配置文件 sudo rm /etc/mysql/ -R 自动卸载mysql(包括server和clien ...

  6. JDK1.9-新特性

    1. Java平台级模块系统 该特性使Java9最大的一个特性,Java提供该功能的主要的动机在于,减少内存的开销,JVM启动的时候,至少会有30~60MB的内存加载,主要原因是JVM需要加载rt.j ...

  7. 电脑不识别USB blaster驱动问题

    电脑不识别USB blaster,如下图: 解决办法:手动更新 http://zhidao.baidu.com/link?url=snVT__AsbtmQ4U5EBVN05Yrgv1TPv7AdVYe ...

  8. hdoj 1288 Hat's Tea

    Hat's Tea Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total S ...

  9. SqlServer 数据分页

     select * from ( select ROW_NUMBER() over (partition by name order by name) rowid,* from table )  t

  10. nginx调用php-fpm出错解决方法和nginx配置详解

    装完了nginx和php-5.5,配置好了nginx调用php后,就开始启动php-fpm. 使用下面的命令 复制代码 代码如下: /usr/local/php/sbin/php-fpm 就可以启动了 ...