如何在 Divi 中创建渐变分隔线

Divi是一款流行的 WordPress 主题，以其多功能模块而闻名，使网站设计师和开发人员能够轻松创建令人惊叹的布局。在其令人印象深刻的模块库中，Divi 分隔线模块脱颖而出，成为一款独特的工具，可让用户制作出迷人的分隔线。在这篇博文中，我们将深入探讨渐变分隔线的迷人世界，并探索如何利用Divi分隔线模块来增强您的设计。我们将仔细研究渐变分隔线的工作原理，并为您提供鼓舞人心的示例以激发您的创造力。

预览

以下是我们的渐变设计最终效果的预览。

如何使用 Divi 的分隔线模块创建渐变分隔线

使用 Divi 的分隔线模块构建分隔线的方法有很多种。默认情况下，模块会显示一条线作为分隔线。但是，可以停用此线并利用模块的背景设置来生成分隔线，可以使用各种背景选项（例如颜色、渐变、图像等）对其进行自定义。我们不会显示实际的分隔线，而是专注于设计分隔线的容器以生成具有独特风格的分隔线。

隐藏分隔线

操作步骤很简单，先在布局中添加一个分隔线模块，然后在内容选项卡下隐藏分隔线。

创建令人惊叹的网站

使用最好的免费页面构建器 Elementor

现在开始

分隔线背景

接下来，从“内容”选项卡上的“背景”设置菜单中选择要使用的背景类型。在本文中，我们将重点介绍背景渐变选项。

添加尺寸和间距

要构建几乎任何尺寸或形状的时尚分隔线，请使用“设计”选项卡上的“大小和间距”选项来调整分隔线容器的高度和宽度。要生成所需的尺寸，请使用宽度和高度、最大宽度和最大高度、模块对齐以及顶部和底部填充。

添加边框半径

要进一步设计形状，请添加边框选项，如边框半径。可以一起或单独调整角以产生迷人的形状。对于特殊设计，您还可以添加边框宽度、样式等。

渐变分隔线

我们将利用 Divi 中包含的免费Home Baker 布局包中的登录页面作为我们的第一个渐变分隔线。此布局包的图稿具有棕色渐变和强大的深色轮廓。我们将使用布局包的调色板通过渐变复制此内容。我们将使用英雄部分中已有的分隔线模块作为我们的第一个插图。这个很简单，但它具有很大的视觉冲击力。这是我们添加分隔线模块之前的布局，供参考。