我希望有人可以提供帮助。 我现在尝试了很多修复,不知道我做错了什么。
我的网站是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; }出于某种原因,在悬停时,字体是灰色而不是白色。 我究竟做错了什么?
谢谢! 克林顿
I'm hoping someone can help. I've tried a number of fixes now and don't know what I'm doing wrong.
My site is Clintonholmes.com
The code I have for my "Want to know more?" Button on my home page is as follows.
.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; }For some reason, on hover, the font is grey instead of white. What am I doing wrong?
Thanks! Clinton
最满意答案
这是一个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
It's a CSS specificity issue. https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity
You can fix it any number of ways by using a selector with higher specificity. Here are a couple of ways.
Change .button1:hover to body.gppro-custom a:hover
Or you can change color: white; to color: white!important; in .button1:hover
更多推荐
发布评论