Question

我们在wordpress网站上使用Avada主题：http://skybox.wearetechnology.com/

我们想要更改我们网站上链接的悬停状态，现在他们转到白色，客户端请求了白色背景。

我尝试更改CSS以反映这一点，但在主题设置的某处，他们将a：hover状态编码为嵌入式样式表，最后使用！important代码。

我无法在主题设置中找到允许更改为悬停状态颜色的任何位置（即使您可以更改任何其他颜色）。

有没有办法覆盖代码，以便我可以将颜色更改回更明显的颜色？

现在我正在使用文字阴影和笔划，但看起来不太好。

Answer 1

如果您使CSS选择器比具有!important注释的CSS选择器更具体，只要您包含自己的!important注释，就应该能够覆盖悬停颜色。

例如，这个：

.featured-post a:hover {
    background-color: pink !important;
}

将覆盖此：

a:hover {
    background-color: #ffffff !important;
}

这是a simple JSFiddle demo。在演示中，由于具有更具体的选择器，第二个链接的样式会覆盖第一个链接上的!important注释。

Answer 2

没关系，我发现在Avada主题中，主题选项下的后端有一个位置可以添加自定义代码，覆盖任何主题的CSS。

Answer 3

这是我必须在Avada自定义css中添加的CSS，以删除Avada 4.0.1中的悬停状态颜色：

/* Undoes very specific css with an important clause from the author of the   theme */
.fusion-content-boxes-1 .fusion-content-box-hover .link-area-link-icon-hover     .heading h2, body .fusion-content-boxes-1 .fusion-content-box-hover .link-area-  link-icon-hover .heading .heading-link h2, body .fusion-content-boxes-1 .fusion-   content-box-hover .link-area-box-hover .heading h2, body .fusion-content-boxes-1 .fusion-content-box-hover .link-area-box-hover .heading .heading-link h2, body .fusion-content-boxes-1 .fusion-content-box-hover .link-area-link-icon-hover.link-area-box .fusion-read-more, body .fusion-content-boxes-1 .fusion-content-box-hover .link-area-link-icon-hover.link-area-box .fusion-read-more::after, body .fusion-content-boxes-1 .fusion-content-box-hover .link-area-link-icon-hover.link-area-box .fusion-read-more::before, body .fusion-content-boxes-1 .fusion-content-box-hover .fusion-read-more:hover:after, body .fusion-content-boxes-1 .fusion-content-box-hover .fusion-read-more:hover:before, body .fusion-content-boxes-1 .fusion-content-box-hover .fusion-read-more:hover, body .fusion-content-boxes-1 .fusion-content-box-hover .link-area-box-hover.link-area-box .fusion-read-more, body .fusion-content-boxes-1 .fusion-content-box-hover .link-area-box-hover.link-area-box .fusion-read-more::after, body .fusion-content-boxes-1 .fusion-content-box-hover .link-area-box-hover.link-area-box .fusion-read-more::before, body .fusion-content-boxes-1 .fusion-content-box-hover .link-area-link-icon-hover .icon .circle-no, body .fusion-content-boxes-1 .fusion-content-box-hover .link-area-box-  hover .icon .circle-no {
    color: black !important;
}

悬停状态颜色变化，Avada主题，Wordpress

3 个答案: