Question

我希望有人可以提供帮助。我现在尝试了很多修复，不知道我做错了什么。

我的网站是Clintonholmes.com

我的代码“我想了解更多？”我的主页上的按钮如下。

.button1 {
    background-color: white;
    border: none;
    color: white;
    padding: 16px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    cursor: pointer;
}

.button1 {
    background-color: white; 
    color: #663366; 
    border: 2px solid #663366;
}

.button1:hover {
    background-color: #663366;
    color: white;
    a.color: white;

}

出于某种原因，在悬停时，字体是灰色而不是白色。我究竟做错了什么？

谢谢！克林顿

Answer 1

这是一个CSS特异性问题。 https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity

您可以使用具有更高特异性的选择器以任意多种方式修复它。这有几种方法。

将.button1:hover更改为body.gppro-custom a:hover

或者您可以在color: white;

中将color: white!important;更改为.button1:hover

按钮字体悬停颜色默认为站点悬停颜色

1 个答案: