在使用CKEditor编辑器上传图片的时候,总是会为img标签自动添加width和height的style内联样式,直接导致图片无法根据网页进行自适应效果,默认上传图片后效果如下:
查看源代码:
<p><img alt="" src="/upload/images/0(2).jpg" style="height:640px; width:640px" /></p>
CKEditor编辑器官方提供了“disallowedContent”属性即可解决以上问题:解决这个问题其实很简单,解决方法如下:
首先找到CKEditor配置文件“config.js”,在配置文件中加入下面这段代码:
config.disallowedContent = 'img{width,height};img[width,height]';
如果此功能只需要在单独几个页面模块中使用,那么在创建实例的方法replace里传入参数即可,如下:
CKEDITOR.replace(
"ckeditorId"
,{disallowedContent:'img{width,height};img[width,height]';
});
配置完成后,上传了一张图,效果如下:
这个时候发现,再上传图片的时候编辑器不会自动添加宽高样式了!