您现在的位置是：首页 > cms教程 > DedeCMS教程DedeCMS教程
DedeCMS编辑器变成所见即所得的方法
宛儿2023-09-19DedeCMS教程已有人查阅
导读DedeCMS的默认编辑器的正文编辑区域显示效果不是非常友好，主要问题是字体太小，行间距也很小，看起来密密麻麻的，非常头疼。而且段落首行没有缩进，段落之间没有适当的间隔
DedeCMS的默认编辑器的正文编辑区域显示效果不是非常友好，主要问题是字体太小，行间距也很小，看起来密密麻麻的，非常头疼。而且段落首行没有缩进，段落之间没有适当的间隔，每行文字的长度也与发布后的页面显示的宽度不一样，这样用起来非常不方便。
其实这是可以轻松改变的。我们在编辑器里看到的文件的样式其实和正文一样，也是由一份CSS文件控制的，这份文件的位置在include/ckeditor/contents.css
打开这份文件，你会发现里面的样式少的可怜，怪不得这么难看。
为了能够使编辑器达到所见即所得的编辑效果，我们可以把它的CSS设计得跟正文一样。
首先在Body的样式中加入下面的内容
然后再在末尾增加段落的显示样式如下：（首行缩进2个字符，段落间距8Px，行高25px）
其实这是可以轻松改变的。我们在编辑器里看到的文件的样式其实和正文一样，也是由一份CSS文件控制的，这份文件的位置在include/ckeditor/contents.css
打开这份文件，你会发现里面的样式少的可怜，怪不得这么难看。
为了能够使编辑器达到所见即所得的编辑效果，我们可以把它的CSS设计得跟正文一样。
首先在Body的样式中加入下面的内容
width:712px;
这表示每行的较大长度是712px（可根据你网站正文的宽度自行调整）然后再在末尾增加段落的显示样式如下：（首行缩进2个字符，段落间距8Px，行高25px）
P{
text-indent:2em;
margin-bottom:8px;
line-height:25px;
}
重新登录你的后台，在编辑器输入内容，怎么样，好看多了吧，效果如下图所示，赶紧修改自己网站的编辑器显示效果吧！
感谢您的认可和支持
微信
支付宝
本文标签：
很赞哦！ ()
相关教程
图文教程
dedecms删除系统自定义变量的方法
本文实例讲述了dedecms删除系统自定义变量的方法。分享给大家供大家参考。具体实现方法如下：
dedecms友情链接分栏目调用的方法
很多朋友需要在dede的不同栏目页调用不同的友情链接，但是dedecms只有一个友情链接模块，调用非常不方便。这里提供个小技巧：实现dedecms友情链接分栏目自动调用！
织梦内容页调用SEO标题描述关键字的方法
找了很多帖子都没看到解决的方法，参考了论坛某人发的帖子，联想得出的方法。内容页调用SEO标题：在之间加入以下代码： 
dedecms列表页标题title后怎么加上页数其标题不重复
在列表页的标题后加上页数使列表页的标题不重复这样更利于优化，下面是从搜索整理的解决方法，有类似需求的朋友可以参考下，希望对大家有所帮助
相关源码
-
(自适应响应式)蓝色勘察设计院机构单位商会协会pbootcms模板下载本模板基于PbootCMS系统开发，为勘察设计院所、工程咨询单位设计，特别适合展示设计成果、技术服务和项目案例。采用响应式技术，确保设计图纸和方案以及文案在不同设备上都能清晰展示。查看源码 -
(自适应响应式)APP应用程序软件介绍落地页源码免费下载该模板为营销技术从业者设计，提供专业的内容展示平台。采用响应式布局，适配软件介绍、APP推广等营销场景，通过可视化后台可快速搭建符合行业特性的展示网站。查看源码 -
(PC+WAP)地暖热水器烘干机节能设备网站模板下载为地暖热水器及节能设备企业设计的PbootCMS网站模板，集成产品展示、节能方案介绍、技术参数说明等专业模块。采用PC与移动端同步响应架构查看源码 -
帝国CMS7.5养生生活健康网模板完整带会员中心可封装APP本套模板为生活服务类网站设计，适用于两性健康、减肥瘦身、生活资讯等领域。采用帝国CMS7.5核心开发，结构清晰合理，视觉体验舒适，能够有效满足相关行业的建站需求。查看源码 -
粉色家政月嫂保姆公司pbootcms网站模板(PC+WAP)为家政服务、月嫂保姆企业打造的营销型解决方案，基于PbootCMS内核开发，采用温馨粉色主题传递行业温度。PHP7.0+高性能架构支持SQLite/MySQL双数据库查看源码 -
(自适应)个人图集图片相册画册pbootcms网站模板源码本模板基于PbootCMS系统开发，为图片展示类网站设计，特别适合个人作品集、摄影画册、艺术图集等内容展示。采用响应式布局技术，确保各类图片在不同设备上查看源码
| 分享笔记 （共有 篇笔记） |
