您现在的位置是：首页 > cms教程 > DedeCMS教程DedeCMS教程

DedeCMS编辑器变成所见即所得的方法

宛儿2023-09-19DedeCMS教程已有人查阅

导读DedeCMS的默认编辑器的正文编辑区域显示效果不是非常友好，主要问题是字体太小，行间距也很小，看起来密密麻麻的，非常头疼。而且段落首行没有缩进，段落之间没有适当的间隔

DedeCMS的默认编辑器的正文编辑区域显示效果不是非常友好，主要问题是字体太小，行间距也很小，看起来密密麻麻的，非常头疼。而且段落首行没有缩进，段落之间没有适当的间隔，每行文字的长度也与发布后的页面显示的宽度不一样，这样用起来非常不方便。
其实这是可以轻松改变的。我们在编辑器里看到的文件的样式其实和正文一样，也是由一份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主页左上角的文字的方法

图文教程

相关源码

(自适应)调节阀门气动球阀控制阀网站模板源码下载为调节阀门、气动球阀等工业设备企业打造的响应式网站模板，基于PbootCMS系统开发。突出产品参数展示与技术文档管理功能，通过专业化的布局设计有效呈现工业设备特性，适配各类终端访问需求。查看源码
(自适应响应式)陶瓷研磨盘抛光机械设备pbootcms网站模板本模板基于PbootCMS系统开发，为研磨抛光设备制造企业设计，特别适合陶瓷研磨盘、抛光设备等表面处理设备展示。采用响应式布局技术，确保各类设备的参数和工艺在不同终端上都能清晰呈现。查看源码
(自适应)简繁双语响应式服装服饰西装工装校服定制pbootcms模板本模板基于PbootCMS内核开发，为服装服饰行业量身打造，尤其适合西装定制、工装生产、校服订制等服装类企业使用。模板采用响应式布局设计，确保在手机、平板、电脑查看源码
(PC+WAP)蓝色电子半导体电子设备网站pbootcms源码下载本模板基于PbootCMS内核开发，为半导体和电子科技行业设计，特别适合电子元器件、集成电路、半导体设备及相关技术产品展示。查看源码
(PC+WAP)房屋建造建筑工程房地产建材行pbootcms网站模板下载本模板基于PbootCMS内核开发，为房屋建造、建筑工程及房地产建材类企业设计。通过本模板可快速搭建具有行业特色的企业官网，只需替换文字与图片内容即可适配其他行业使用。查看源码
帝国cms7.5模板生活常识美食女性时尚综合资讯门户源码本模板为帝国cms7.5生活资讯类网站设计，以天奇生活网为参考原型，涵盖生活常识、美食烹饪、女性时尚等多元化内容板块。采用响应式布局设计，适配各种终端设备，为访客提供优质的阅读体验。模板结构清晰合理，内容展示层次分明，符合生活类网站的用户需求。查看源码