你有没有希望你知道如何在图像上方显示文本 Elementor ?

在这个新教程中，我们将向您展示如何做到这一点。

如果您不知道我们今天要谈什么，我们邀请您观看以下视频：

然后，让我们回到为什么我们在这里。

要完成本教程，您需要 Elementor 专业版，因为我们将使用仅此版本支持的自定义 CSS 代码Elementor.

另请参阅以下指南： 如何使用 Elementor 创建图片库

让我们创建一个具有 3 列结构的新部分，然后在面板中，让我们定义 高度 河畔 最小高度进而 最小高度 让我们点击 VH 并将滑块设置为 100.

让我们选择中间的列，然后在选项卡中 样式，在该部分 背景 让我们点击 经典 为 背景类型，然后选择深色。

让我们在这个专栏中 内部部分小部件。 内部部分小部件默认配置为 2 列，让我们删除其中的一列。 让我们通过修改它来配置面板中的其余部分 高度 河畔 最小高度 和 最小高度 让我们将光标设置为 400.

另请参阅： Elementor：如何缩放个人资料卡

然后，在 垂直对齐 让我们选择 环境.

然后放下 标题小部件 在 内部部分 让我们输入标题照片，然后在对齐上，让我们选择 中心。

在标签中 样式 让我们修改一下 Title 的颜色，让它不可见时可见，

让我们放下一个 文本编辑器小部件 以下 标题小部件. 然后，在选项卡中 样式, 在对齐上选择 中央. 让我们也改变文本的颜色，使其可见。

也可以看看： Elementor：如何添加分隔线来创建部分

让我们选择 中间栏 并在其选项卡中 样式，重置背景颜色并加载图像，然后 职务 让我们选择 居中居中, 重复 河畔 不重复, 覆盖 河畔 尺寸.

在节 边框 让我们修改所有 边界半径为 12。 在 盒子阴影, 将滑块设置为 0 为 横，要 0 对于垂直，到 40 在模糊上， -10 在广播中。 您应该在图像下方看到美丽的阴影效果。

南 背景叠加， 选择 经典 为 背景类型 和 钻石颜色 选一个 黑色，在不透明度上，让我们将滑块设置为 0.55

在标签中 先进，让我们抓住 20 所有边距。

让我们选择我们的 内部部分 并转到其标签 先进 在自定义 CSS 部分复制并粘贴以下代码片段：

/*Afficher ou masquer un contenu au survol*/
selector{
    opacity: 0;
    transition: 0.5s ease-in-out;
}
selector:hover{
    opacity: 1;
}

（如果您没有此部分，则表示您没有 Pro 版本，如果您想继续，则需要升级您的版本）。

让我们再次选择我们部分的中间列，在它的选项卡中 样式，并且在部分 背景叠加，检查我们是否在选项卡上 正常，让我们降低 不透明度 à 0.

然后点击标签 概述然后在 经典 为 背景类型 和 钻石颜色， 选择一个 深色，那么不透明度 河畔 0.55，并为 过渡时间 让我们将滑块设置为 0.5.

这是我们操纵的最终结果。

让我们将列复制两次并删除其他 2 个空列。剩下的就是更改背景图像以及 内容 两个新列的文本编辑器。

在平板电脑和智能手机上预览您的作品，看看它的外观。 然后保存或更新它。

所以。 您刚刚在图像上方显示了一个文本，其中 页面生成器 Elementor.

立即获取Elementor Pro！

结论

所以 ！ 这就是本文向您展示如何在图像上方显示文本的内容。 如果您对如何到达那里有任何疑虑，请告知我们 评论.

但是，您也可以咨询 我们的资源，如果您需要更多的元素来执行创建Internet网站的项目，请参考我们关于 WordPress博客创建 或者那个 Divi：有史以来最好的WordPress主题.

但与此同时， 在您不同的社交网络上分享此文章.

...