我正在制作一个模式视图，使用bootstrap框架，如图所示，这是两个按钮，我想要悬停效果时，鼠标指向，使用CSS，但它不工作，
null
#yesbut,#nobut {
width: auto;
height: auto;
display: inline-block;
padding: 10px 35px;
text-align: center;
background: #2e6c96;
color: #fff;
font-size: 16px;
text-decoration: none;
border: 1px solid #2e6c96;
outline: none;
text-transform: uppercase;
}
#yesbut :hover{
background: #fff;
border: 1px solid #fff;
}
#nobut :hover{
background: #fff;
color: #2e6c96;
border: 1px solid #fff;
}<div id="yesbut" >YES</div>
<div id="nobut">NO</div>null
在此处输入图像说明
已更正的选择器错误为:
#yesbut:hover{
background: #fff;
border: 1px solid #fff;
}
空格意味着您的目标是特定元素中的元素，例如
null
#yesbut :hover{ /*Remove the space*/
background: #fff;
border: 1px solid #fff;
}
你需要删除空格。如果您在伪类前面放一个空格，这意味着您想要选择一个子元素，例如
null
#yesbut,#nobut {
width: auto;
height: auto;
display: inline-block;
padding: 10px 35px;
text-align: center;
background: #2e6c96;
color: #fff;
font-size: 16px;
text-decoration: none;
border: 1px solid #2e6c96;
outline: none;
text-transform: uppercase;
}
#yesbut:hover{
background: #fff;
border: 1px solid #fff;
}
#nobut:hover{
background: #fff;
color: #2e6c96;
border: 1px solid #fff;
}<div id="yesbut" >YES</div>
<div id="nobut">NO</div>