[英]CSS Hover Text Changing Color With Button
So, it's pretty easy to set a hover over effect for an element. 因此,为元素设置悬停效果非常简单。 But what I want is when the user hovers over a button that has text in it, to make the button turn from black to white and the text from white black at the same time. 但我想要的是当用户将鼠标悬停在其中包含文本的按钮上时,使按钮从黑色变为白色,同时将文本从白色变为黑色。 Instead of two separate elements. 而不是两个单独的元素。 How should I do this? 我该怎么做?
Thanks! 谢谢!
#signUpBox {
width: 150px;
height: 47px;
border-style: solid;
border-width: 1px;
margin: auto;
margin-top: 25px;
border-radius: 2px;
}
#signUpBox:hover {
background-color: #ffffff;
}
h3 {
text-align: center;
margin-top: -35px;
letter-spacing: 1px;
font-size: 17px;
}
I'm not sure how you have the code set up but this would work on a div with an onclick
function attached as a button: 我不确定你是如何设置代码的,但这可以在一个带有onclick
功能的div上作为按钮:
#signUpBox {
width: 150px;
height: 47px;
border: solid 1px #000;
margin: auto;
margin-top: 25px;
border-radius: 2px;
color:#000;
background:#fff;
}
#signUpBox:hover {
background: #000;
color:#fff;
}
HTML: HTML:
<div id="signUpBox">This is a test</div>
#signUpBox:hover {
background-color: #ffffff;
color:#000000;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.