怎樣修改DedeCMS文章正文的顯示樣式

來源：本站原創(chuàng)|時間：2021-08-05|欄目：dedecms|點擊：次

安裝DedeCMS后的默認模板中，正文內(nèi)容的顯示方式為左對齊，段落前面也沒有縮進，段落之間間距與行間距也沒有任何區(qū)別，這樣看起來非常不好看，也不便閱讀，所以需要改變一下排版樣式。

之所以會顯示成這樣的效果是因為在DedeCMS中的整個正文是一個DIV標簽，DIV標簽里面也沒有P標簽，可能是因為編輯器的原因，編輯器默認回車時生成BR標簽而不是P標簽，所以正文里面幾乎全是BR標簽，導(dǎo)致我們看到的都是分行，而沒有段落。

其正文對應(yīng)的CSS文件目錄位置在：\templets\default\style目錄下面的Page.css文件里

里面具體的CSS內(nèi)容為

.viewbox .content{

font-size:14px;

padding:12px 16px;

line-height:25px;

color:#333;

}

要想改變其正文的顯示效果，比如增加段落縮進，加大段落間距等，可對文章正文的P標簽進行適當?shù)腃SS樣式控制。

我們可以這樣做：

第一步，確認正文內(nèi)容包含P標簽

在文章的編輯頁面，點擊編輯器左上角的“源碼”命令，查看一下正文的源代碼中每段是否是用P標簽包裹，如果不是，則需要先把段落的BR標簽改成P標簽，當然不是在源代碼狀態(tài)改，可先再點一下“源碼”命令回到正常編輯視圖，把鼠標點到段落的末尾，然后按下Shift+Enter組合鍵，這樣就會自動加上P標簽了。

第二步，修改CSS代碼

在PAGE.CSS文件中的任意位置增加如下代碼，然后保存即可

.viewbox .content P{

text-indent:2em;

margin-bottom:8px;

}

第一句代碼的作用是增加段落縮進，段落首行縮進兩個字符，第二句代碼的作用是在每個段落的后面增加段落間距8px，如果你需要其它段落效果，可自行添加相應(yīng)的CSS代碼。

修改完以后，再刷新一下就可以看到效果了，效果如下：

上一篇：怎么將織夢cms的安全做到極致

欄目：dedecms

下一篇：給DedeCMS默認編輯器增加中文字體選項

本文標題：怎樣修改DedeCMS文章正文的顯示樣式