dede修改文章空白

修改CSS样式（最推荐、最通用）

这是最规范、最推荐的方法，通过修改CSS，你可以统一控制所有文章的显示样式,且不影响文章本身的内容。

目标： 修改文章正文的段落间距、行高、首行缩进等。

操作步骤：

1. 找到CSS文件 DedeCMS的CSS文件通常位于你的网站模板目录下，路径一般为： /templets/你的模板名称/style/ 或 /templets/你的模板名称/css/ 在这个文件夹里，找到主样式文件，通常是 style.css 或 main.css。

2. 定位文章正文样式 在CSS文件中，找到控制文章正文内容的CSS选择器，这个选择器通常是 .article-content 或 .art_content，你可以通过浏览器的“检查元素”功能快速找到它。

   • 在浏览器中打开任意一篇文章。
   • 在文章正文区域点击鼠标右键，选择“检查”。
   • 在开发者工具中，查看被选中的HTML元素的Class或ID名称,这就是你需要修改的CSS选择器。

3. 添加或修改CSS属性 在你的CSS文件中,为这个选择器添加或修改以下属性：

   • 段落间距 (Margin): 控制段落之间的上下间距。

     .article-content p {
         margin-bottom: 20px; /* 设置段落下方间距为20像素 */
         margin-top: 0;       /* 清除段落上方间距，避免叠加 */
     }

   • 行间距 (Line-height): 控制文字行与行之间的距离,影响阅读体验。

     .article-content {
         line-height: 1.8; /* 设置行高为字体大小的1.8倍 */
     }

   • 首行缩进 (Text-indent): 让段落首行缩进,符合中文排版习惯。

     .article-content p {
         text-indent: 2em; /* 首行缩进2个字符的宽度 */
     }

   • 综合示例： 将以上效果组合在一起,你可以得到一个更完整的CSS规则：

     /* 适用于文章正文区域内的所有段落 */
     .article-content p {
         margin-bottom: 20px;   /* 段落下方间距 */
         line-height: 1.8;      /* 行高 */
         text-indent: 2em;      /* 首行缩进 */
     }
     /* 如果文章正文本身也需要间距 */
     .article-content {
         padding: 20px; /* 给整个内容区域加内边距 */
     }

4. 保存并刷新 保存修改后的CSS文件，然后刷新你的网站文章页面,就能看到效果了。

修改编辑器默认样式

如果你希望以后发布的新文章自动带有这些样式，可以修改编辑器的默认配置，这通常适用于DedeCMS内置的编辑器或集成的外部编辑器（如KindEditor, CKEditor等）。

目标： 让新发布的文章自动应用特定的样式。

操作步骤：

1. 进入编辑器配置 登录DedeCMS后台，依次进入 系统 -> 系统基本参数 -> 核心设置。

2. 修改编辑器样式 在“核心设置”页面中，找到名为 Html编辑器默认样式 的配置项。 在这里输入你希望在编辑器中默认生效的CSS代码。

   输入以下内容：

   body {
       line-height: 1.8;
       font-family: "Microsoft YaHei", sans-serif;
   }
   p {
       margin-bottom: 15px;
       text-indent: 2em;
   }

   保存设置后，这个样式就会成为编辑器里的默认样式，但请注意，这个方法可能不会对所有编辑器都生效,且效果可能不如方法一稳定。

修改文章模板文件

如果你想从根本上改变文章内容的HTML结构,可以修改文章的模板文件。

目标： 修改文章内容在HTML中的包裹方式。

操作步骤：

1. 找到文章模板 文章模板通常位于你的网站模板目录下，路径一般为： /templets/你的模板名称/article_article.htm

2. 调用标签 在这个模板文件中，找到文章内容的调用标签，通常是 {dede:field.body/}。

3. 添加包裹标签 你可以在 {dede:field.body/} 外面包裹一个 <div>，并给它一个自定义的class,以便于用CSS控制。

   修改前：

   <div class="article-content">
       {dede:field.body/}
   </div>

   修改后（推荐）：

   <div class="article-content">
       {dede:field.body/}
   </div>

   再按照方法一，在CSS文件中为 .article-content 添加样式。

常见问题与解决方案

问题1：为什么我修改了CSS，但文章里<p>标签没有效果？

原因分析： 这通常是因为DedeCMS在保存文章时，对内容进行了处理，可能将段落包裹在<p>标签之外，或者使用了<div>标签。 解决方案：

1. 使用浏览器“检查元素”功能,查看文章正文实际生成的HTML结构是什么。
2. 如果段落是用<div>标签包裹的，那么你的CSS选择器就应该是 .article-content div 而不是 .article-content p。
3. 如果没有段落标签，那说明文章内容是连续的，你可以在CSS中使用选择器 .article-content 直接设置 line-height 和 padding 来调整间距。

问题2：如何快速批量修改已有文章的空白？

重要提示： 强烈建议在操作前备份数据库！

批量修改数据库内容有风险,请务必谨慎。

1. 登录phpMyAdmin 进入你的网站数据库管理工具（通常是phpMyAdmin）。

2. 选择数据库 在左侧列表中选择你的DedeCMS数据库名。

3. 执行SQL语句 在顶部菜单点击“SQL”，在输入框中执行以下语句（请根据你的实际情况修改表前缀#@_）。

   示例1：为所有文章的<p>标签添加样式 这个语句会找到dede_addonarticle表）中body字段里所有的<p>标签，并在其内部添加一个style属性。

   UPDATE `#@__addonarticle` SET `body` = REPLACE(`body`, '<p>', '<p style="margin-bottom: 20px; line-height: 1.8;">');

   示例2：移除所有文章的<p>标签样式 这个语句会移除所有<p>标签中的style属性。

   UPDATE `#@__addonarticle` SET `body` = REPLACE(`body`, 'style="margin-bottom: 20px; line-height: 1.8;"', '');

   示例3：添加首行缩进 这个语句会给所有<p>标签添加text-indent: 2em;的样式。

   UPDATE `#@__addonarticle` SET `body` = REPLACE(`body`, '<p>', '<p style="text-indent: 2em;">');

4. 确认并执行 检查SQL语句无误后，点击“执行”。

警告： 直接操作数据库非常危险，一旦写错SQL语句可能会导致数据错乱甚至丢失。不熟悉SQL的用户请勿轻易尝试,修改前务必备份数据库。

对于绝大多数用户来说，方法一（修改CSS样式） 是解决“文章空白”问题的最佳选择。