gpt4 book ai didi

css - 使用 CSS 更改 Wordpress 中图标的颜色

转载 作者:行者123 更新时间:2023-11-28 13:54:24 25 4
gpt4 key购买 nike

我正在使用 Dustrial 构建一个 Wordpress 网站主题,我在更改标题前栏中 Font Awesome 图标的颜色时遇到了一些问题。

正如您从屏幕截图中看到的那样,我已将图标的颜色 (.h1-single-top-block i.fa) 更改为 #ffffff,但它被上面的代码覆盖了(颜色:# 92d050 !important;).

See linked image 1

现在我知道 !important 优先,但我找不到此代码所在的文件,因为它告诉我的只是 (index)。

See linked image 2

如果我为此禁用代码,图标会根据需要变为白色,但我很难找到导致问题的位的 .css 文件。

See linked image 3

有人可以帮忙吗?

编辑:正如您从下面的链接中看到的,Wordpress 后端的主题编辑器将图标显示为白色,但它不起作用。

See linked image 4

此外,引用它的 (index):237 - 这个文件到底在哪里?后端没有 index.html 文件或类似文件。

最佳答案

这并不是一个特别的 CSS 问题,因为您了解级联的工作方式以及较新的声明会覆盖以前的声明。

您似乎也知道需要删除该 (color: #92d050 !important;) 声明。

为了找到声明是在哪里进行的;在 Chrome 开发工具中打开页面(其他开发工具可能类似,但我使用 chrome)并关注相关元素。

enter image description here

在右侧,您将看到负责将样式应用于每个元素的样式表。如果单击它,您将看到它的完整 URL,然后就可以访问声明。

如果负责 color: #92d050 !important; 声明的文件是 index.html 则该文件被内联。它可以直接在您的 header.php 中,也可以从单独的 CSS 文件内联。您必须查看 header.php 才能看到这一点。

解决此问题的另一种方法是使用像 atom 这样的程序并在整个站点中搜索 color: #92d050 !important; 声明。这将使你找到它。

这是一个很好的例子,说明了为什么您应该尽可能少地使用 !important 声明。

我刚刚看到该网站的链接

覆盖声明在您的索引文件中,很可能在 header.php 中。如果您没有直接看到它,那么应该在 header.php 中引用一些 .css 文件。覆盖声明将位于这些 CSS 文件之一中。

关于css - 使用 CSS 更改 Wordpress 中图标的颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58994559/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com