记一次php版本的Ueditor上传图片不能自适应配置的坑

最新推荐文章于 2023-11-22 14:47:58 发布

蓝风blue

最新推荐文章于 2023-11-22 14:47:58 发布

阅读量373

点赞数

分类专栏：学习笔记文章标签：前端编辑器

本文链接：https://blog.youkuaiyun.com/weixin_44387713/article/details/126764864

版权

学习笔记专栏收录该内容

5 篇文章

订阅专栏

本文介绍了如何解决编辑器中图片过大导致边界问题的方法，包括修改ueditor的iframe.css和config.js，以及利用编辑器的网络图片下载功能。务必移除注释并清理缓存以确保效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

默认的版本，上传完了图片，如果过大是会超出编辑器的边界的。很难写作。。
在网上查找了好多好多资料，大多都远久失效了。
最后找到了个，但是还是错误的，修改后是这样的。
找到这个文件：\ueditor\themes\iframe.css 在里面加入样式
如下代码
img{ max-width: 100%; /* 图片自适应宽度 */ } body{ overflow-y: scroll !important; } .view{ word-break: break-all; } .vote_area{ display: block; } .vote_iframe{ background-color: transparent; border: 0 none; height: 100%; } #edui1_imagescale{ display: none !important; /* 去掉点击图片后出现的拉伸边框 */ }
这个文件默认是空的，很多人说这个改了没有就是还缺少一步设置
在这里插入图片描述

保存后找到：ueditor.config.js 这个文件86行，把里面的 ,iframeCssUrl: URL + ‘/themes/iframe.css’ 的注释去掉，保存；只有这里去掉了注释，刚才改的css才能生效。。。
最后清理一下浏览器的缓存就可以使用了。
最后再说下，这个编辑器的好处就是可以远程把网络图片直接下载到服务器上，
希望有同样问题的小伙伴能避坑。