WordPress divi主题

如何为令人惊叹的 Divi 标题创建敲除文本图像

| 5月 14, 2022 | Divi主题使用教程 | 0 条评论

5分钟生成10篇英文软文article forge软件试用

剔除文本图像可以为在 Divi 中设计独特的标题打开很多机会。 使用照片编辑器(如 Photoshop)使用内置的剔除混合选项可以轻松创建剔除文本效果。 基本上,这允许您创建带有透明文本的图像(似乎被从图像中剔除)。

google广告开户

在 Divi 中使用淘汰文本图像真的很有趣。 由于图像文本是透明的,您可以在文本后面添加任何类型的背景以实现独特的设计。

在本教程中,我将向您展示如何使用 Photoshop 创建具有剔除文本效果的图像。 然后我还将介绍如何使用 Divi 中的图像在几分钟内创建一个漂亮的标题。

这个设计的灵感来自我们最喜欢的 Divi 网站之一,在马克思创意。

抢先看

这是我们将在本教程中创建的设计的先睹为快。

此处为图像模块背景图像设置了 CSS 视差效果的最终设计。

淘汰赛文本

这是它在移动设备上的样子。

淘汰赛文本

如何使用 Photoshop 创建挖空文本图像

WordPress divi主题

订阅我们的 Youtube 频道

要在 Photoshop 中创建挖空文本图像,首先创建一个新文档并将尺寸设置为 700 像素宽和 300 像素高。

淘汰赛文本

接下来,单击前景色(或吸管工具)并将前景色设置为#121212。

淘汰赛文本

使用油漆桶工具为整个图层着色。 这将作为图像的背景颜色。

淘汰赛文本

现在是时候将我们的文本添加到图像中了。 使用水平文字工具在背景层上添加一个新的文本层。 您可以使用顶部的文本选项来设计您想要的文本。 对于此示例,我使用以下内容:

字体:Poppins
字体粗细:半粗体
颜色:#ffffff(可以是任何颜色,因为文本会变得透明)
文字大小:260px
文字对齐:居中

然后输入你想要的文本(我用的是“Divi”)并将文本框居中放置在背景层上。

fiverr建站WordPress程序员

淘汰赛文本

右键单击带有文本的图层,然后从右键菜单中选择“混合选项”。

淘汰赛文本

在“高级混合”部分下,找到剔除选项并从下拉菜单中选择“浅”。

然后将填充不透明度选项设置为 0%。

独立站选品工具

淘汰赛文本

淘汰赛文本

通过选择导出文件 文件 > 导出 > 保存为 Web(旧版).

淘汰赛文本

确保将文件另存为 png 以保持图像的透明度。

高质量外链购买

淘汰赛文本

使用敲除文本图像在 Divi 中创建标题

现在您的图像已准备就绪,您可以开始在 Divi 中设计您的标题。

创建一个新页面

首先,创建一个新页面。 给您的页面一个标题,然后单击以使用 Divi Builder。

淘汰赛文本

选择“从头开始构建”选项。

JasperAI 10000字免费额度试用

淘汰赛文本

创建页眉设计

然后,创建一个具有一列行的常规部分。

淘汰赛文本

之后,将图像模块添加到该行。

淘汰赛文本

WordPress备份工具updrafplus

将刚刚创建的淘汰图像上传到图像模块。

淘汰赛文本

接下来,将具有视差效果(True Parallax 或 CSS)的背景图像添加到图像模块。

淘汰赛文本

使图像中心对齐,并为图像提供与实际图像宽度相匹配的自定义宽度。

  • 图像对齐:居中
  • 宽度:700 像素

淘汰赛文本

更新行设置如下:

  • 自定义填充:0px 顶部,0px 底部

淘汰赛文本

为该部分提供与创建剔除图像时相同的背景颜色。 打开部分设置并更新以下内容:

  • 背景颜色:#121212

淘汰赛文本

要添加一些额外的标题文本,首先添加一个新的两列行。

淘汰赛文本

然后,将文本模块添加到 column2。

淘汰赛文本

更新文本模块内容如下:

<h1>divi web design</h1>
Your content goes here. Edit or remove this text inline or in the module Content settings.

淘汰赛文本

然后更新设计设置如下:

  • 文字字体:Poppins
  • 文字文字大小:16px
  • 标题字体:Poppins
  • 标题文字颜色:#9b89f4

文本字体与用于剔除文本图像的字体相匹配。

淘汰赛文本

就是这样! 现在你有了一个独特的标题设计,带有剔除文本效果。

最后结果

此处为图像模块背景图像设置了真正的视差效果的最终设计。

淘汰赛文本

此处为图像模块背景图像设置了 CSS 视差效果的最终设计。

淘汰赛文本

这是它在移动设备上的样子。

淘汰赛文本

在 Photoshop 中创建 Knockout 徽标图像

剔除效果也可以应用于图像。 例如,您可以创建一个淘汰标志图像。 为此,请在 Photoshop 中创建一个新文档。 为您的基础层提供您选择的颜色。 然后将您的徽标拖到文档中以创建一个新图层。 确保您的徽标是具有透明背景的 png。 然后在文档中将徽标居中。

淘汰赛文本

选择魔棒工具。 然后按住 shift 并单击构成徽标的不同元素。

淘汰赛文本

选择元素后,右键单击徽标图像层并​​选择“混合选项”。

淘汰赛文本

在“高级混合”部分下,找到剔除选项并从下拉菜单中选择“浅”。

然后将填充不透明度选项设置为 0%。

淘汰赛文本

将文件导出为 png。 然后按照相同的步骤使用 Divi Builder 将淘汰标志图像添加到页面标题。

这是一个淘汰标志的外观示例。

淘汰赛文本

最后的想法

使用 Photoshop 之类的照片编辑器创建一个剔除文本或徽标图像真的不难。 而且,一旦你有了那个淘汰图像,你就可以用它来为你的 Divi 网站创建一个独特的标题。 Divi 有很多内置选项可用于添加自定义背景,这些背景将通过您的剔除图像透明度显示。 我希望这将有助于激发您为下一个项目创建一些漂亮的设计。

我期待在评论中收到您的来信。

干杯!

5分钟生成10篇英文软文article forge软件试用
tiktok
WordPress divi主题