html - 如何在 Wordpress Amadeus 主题中为超链接设置不同的颜色？

Question

使用 Wordpress Amadeus 主题(免费版)，我尝试使超链接可见。在 Wordpress 定制器的“颜色”部分中没有更改超链接颜色的选项。

我将 CSS 代码修改为不同的颜色，但更改没有生效。

然后我将代码添加到主题的 style.css 文件中(按照 YouTube 视频中的说明)并将修改后的文件上传回网站。

我添加的代码是:

    /* unvisited link */
a:link {
color: blue;
}

/* visited link */
a:visited {
color: green;
}

/* mouse over link */
a:hover {
color: orange;
}

/* selected link */
a:active {
color: red;
}

右键单击页面上的链接并选择“检查元素”后，我发现 a:link 标记的 CSS 代码被划掉了，使其处于非事件状态。

CSS code for hyperlink colour change

我还尝试将代码添加到 Wordpress Customizer 的“Additional CSS”部分，但更改仍然没有应用。

如何在此 Wordpress Amadeus 主题中为超链接设置不同颜色？

Answer 1

听起来你可能遇到过CSS specificity .基本上，越具体的 CSS 规则就越优先于其他不太具体的规则。例如:

a { ... }
a.primary { ... } // This rule takes precedence!

如果您有一个 a 标签，其类为 primary，则第二条规则将适用(无论它在文件中的什么位置)

您可以编辑主题以更改违规规则。

另一个不太可取的选择是在分号前添加 !important。这很可能会在未来的版本中再次困扰您，因此您应该避免这种情况。

如果您想了解有关管理 CSS 的更多信息，请尝试阅读 ITCSS和 BEM .