dede行间距调整方法有哪些？

调整文章内容页的行间距（最常用）

这是用户最常需要调整的地方,因为文章内容是网站的核心。

操作步骤：

1. 找到 CSS 文件

   • 登录你的网站后台。
   • 进入“文件管理器” -> “模板” -> “默认模板” -> “style” (或者你当前模板的文件夹)。
   • 找到并下载 article.css 或 dedecms.css 这类名称的 CSS 文件，通常文章内容的样式都在这个文件里。

2. 找到文章内容的 CSS 选择器

   • 在文本编辑器（如 VS Code、Sublime Text 或记事本）中打开这个 CSS 文件。
   • 搜索以下关键词来定位控制文章内容区域的样式：
     • article-content
     • arccontent
     • content
     • .content (带点的是类选择器)
   • 你会找到类似下面这样的代码块：

     /* 这是一个常见的文章内容区样式 */
     .article-content {
       font-size: 14px;
       line-height: 1.5; /* 这就是行高！ */
       color: #333;
       margin: 20px 0;
     }

3. 修改 line-height 值

   
   （图片来源网络，侵删）
   • line-height 属性就是用来控制行间距的。
   • 如何调整：
     • 数值型： 直接设置一个数字，如 line-height: 2;，这个数字会乘以字体大小（font-size）得到最终的行高，比如字体是 14px，行高就是 14 * 2 = 28px，这是最推荐的方式。
     • 像素型： 直接设置像素值，如 line-height: 24px;，这种方式更直接，但不如数值型灵活（当字体大小改变时，行高不会自动按比例调整）。
     • 百分比型： 如 line-height: 150%;，效果和数值型类似，但计算方式稍有不同。

4. 保存并上传

   • 修改完成后,保存 CSS 文件。
   • 通过“文件管理器”将修改后的文件上传回原来的位置。
   • 重要： 为了看到效果，请务必清除浏览器缓存（按 Ctrl + F5 强制刷新）或者登录 DedeCMS 后台点击“更新缓存”->“更新系统缓存”。

示例：

如果觉得原文的 line-height: 1.5; 太挤，想让它更宽松，可以修改为：

.article-content {
    font-size: 14px;
    line-height: 1.8; /* 从1.5增加到1.8，行间距变大了 */
    color: #333;
    margin: 20px 0;
}

调整文章列表页（首页、栏目页）的行间距

列表页的文章标题、摘要等也需要调整行间距。

操作步骤：

1. 找到 CSS 文件

   • 同样在后台的“文件管理器”中，找到 list.css 或者主样式文件 style.css。

2. 找到列表项的 CSS 选择器

   • 在 CSS 文件中搜索以下关键词：
     • listbox (列表容器)
     • item (列表项)
     • title (文章标题)
     • intro (简介)
   • 你可能会找到类似这样的代码：

     /* 列表项容器 */
     .listbox .item {
       margin-bottom: 20px;
       padding-bottom: 10px;
       border-bottom: 1px dashed #eee;
     }

   / 文章标题 / .listbox .item h3 { font-size: 16px; line-height: 1.6; / 标题的行高 / }

   // .listbox .item .intro { font-size: 13px; line-height: 1.7; / 摘要的行高 / color: #666; margin-top: 8px; }

3. 修改 line-height 值

   • 和方法一一样,修改你想要调整的部分的 line-height 值，比如想让摘要的文字更松散，就把 .intro 的 line-height 从 7 改成 2。

4. 保存、上传、清除缓存。

   重复方法一的最后一步。

通过后台全局样式调整（适用于特定模板）

有些模板可能会提供一个“后台全局样式”的功能，让你不用修改代码就能调整。

1. 登录 DedeCMS 后台。
2. 进入“系统” -> “系统基本参数”。
3. 在左侧菜单找到“核心设置”。
4. 在右侧查找是否有类似“网站全局样式”、“自定义CSS”之类的输入框。
5. 如果有,可以直接在里面输入 CSS 代码来覆盖默认样式。

   /* 让所有正文内容的行间距变大 */
   .article-content, .arccontent {
       line-height: 1.8 !important;
   }

   • !important 可以确保你的样式优先级更高，覆盖掉模板原有的样式。
6. 点击“保存”即可。

注意： 这种方法不是所有模板都支持，如果找不到这个选项，请使用方法一和方法二。

总结与小贴士

核心要点：

• line-height 是关键：记住这个 CSS 属性。
• 数值型推荐：使用 line-height: 1.8; 这样的数值，比 px 单位更灵活。
• 清除缓存：修改后一定要清除浏览器缓存和 DedeCMS 系统缓存，否则可能看不到效果。

希望这些详细的步骤能帮助你成功调整 DedeCMS 的行间距！