• 日常搜索
  • 百度一下
  • Google
  • 在线工具
  • 搜转载

如何在WordPress中更改字体颜色

更改wordpress网站中的字体颜色是您可以轻松地为一小部分文本或一个块做的事情。或者,您可以更改整个站点中特定元素或css类的颜色。

在本快速教程中,我将向您展示如何快速更改 WordPress 网站中的字体颜色。

我将向您展示两种方法:

  • 更改单个块的字体颜色。

  • 将 CSS 类添加到颜色块中,然后设置该类的样式。

我还将概述如何使用样式表更改整个站点的字体颜色。

如何更改一段文本的字体颜色

您可以选择使您的一个帖子或页面中的一段文本或整个文本块与其余的颜色不同。您可以使用它来突出显示某些文本并使其脱颖而出,或增强您网站的设计。

一个警告:太多的颜色会让你的网站看起来凌乱和不专业。确保使用不冲突的颜色。

首先找到要更改其颜色的文本部分。

如何在WordPress中更改字体颜色  第1张通过双击选择要更改颜色的文本。单击块上方的箭头图标并选择文本颜色。

如何在WordPress中更改字体颜色  第2张

选择您希望文本具有的颜色。颜色将在编辑屏幕中为您改变。

如何在WordPress中更改字体颜色  第3张

或者,您可以使用十六进制代码来选择特定颜色。如果您想使用网站其他地方使用的颜色,这是一个好主意。

单击自定义颜色链接,然后从选择器中选择一种颜色或输入十六进制代码。

如何在WordPress中更改字体颜色  第4张

对要更改颜色的任何其他文本块或文本部分重复此操作。您不必更改整个块的颜色 - 如果您愿意,只需更改一个单词。

最后,单击更新日期以更新您的帖子或发布以发布它。这将保存您的更改。

现在你的文本将是你给它的任何颜色:

如何在WordPress中更改字体颜色  第5张

如何使用 CSS 类更改字体颜色

如果您想更改一堆文本块以使它们都具有相同的颜色,那么最好的方法是使用 CSS 类。这样,您就知道它们都将是相同的颜色,并且您不必记住您使用的颜色。

再次找到您的文本块,然后在“块”窗格中打开“高级”选项卡

在Additional CSS class(es)字段中,输入 CSS 类。我要使用highlight-color. 我故意不命名颜色,以防我稍后决定更改它。

如何在WordPress中更改字体颜色  第6张现在单击更新或发布以保存您的帖子。

您现在有两个选项可以使用该类编辑块的颜色:

  • 在定制器中添加样式

  • 将样式添加到主题的样式表

在定制器中为类设置样式是最简单的方法,并且在更新主题时不会给您带来任何问题。

在 WordPress 管理员中转到外观 > 自定义,然后单击附加 CSS。

如何在WordPress中更改字体颜色  第7张

在Additional CSS窗格中,输入 CSS 以更改字体颜色:

.highlight-color {
 color: #e76d16;
}

使用十六进制代码将该代码中的颜色更改为您想要使用的任何颜色。最好使用主题中其他地方使用的颜色,或者在使文本突出的同时与主题看起来不错的颜色。


如何在WordPress中更改字体颜色  第8张

单击发布按钮以保存您的更改。

现在转到您的实时站点中的帖子,您会看到带有highlight-color类的块与其周围的文本颜色不同:

如何在WordPress中更改字体颜色  第9张

现在,您可以将此类用于您想要制作该颜色的任何块。

更改主题样式表中的字体颜色

使用我向您展示的两种方法,您无需编辑主题中的文件或深入了解 CSS。它们为您提供了一种快速更改 WordPress 中字体颜色的方法。

但是,如果您想编辑站点中现有元素的颜色(例如所有段落或链接),或者您想在样式表中而不是在定制器中添加 CSS,则需要编辑主题的样式表。

结论

更改 WordPress 网站中文本的字体颜色只需几分钟。您可以直接编辑字体颜色或给它一个类,然后为您的类编写 CSS。

但是,无论您选择这样做,都不要过度。并确保您使用的颜色可以很好地协同工作,以避免网站看起来凌乱和不专业。


文章目录
  • 如何更改一段文本的字体颜色
  • 如何使用 CSS 类更改字体颜色
  • 更改主题样式表中的字体颜色
  • 结论