CSS中hover效果未生效问题咨询：我的设置哪里出错了？

哈哈，一眼就揪出问题啦！你把CSS里实现悬停效果的语法写错了～

• 你现在写的是 .button_link#hover，这是在选择ID为hover且类为button_link的元素，但我们要实现鼠标悬停效果，得用CSS的伪类选择器:hover，正确语法是 .button_link:hover。

来看看修正后的完整代码：

.button_link { 
  display: inline-block; 
  border: solid black 2px; 
  border-radius: 15px; 
  background-color: #ddf; 
  padding: 10px; 
  text-decoration: none; 
}
/* 把#hover改成:hover就生效啦 */
.button_link:hover { 
  color: orange; 
  background-color: #fff; 
}

<div><a class="button_link" href="http://example.com">Return to example.com</a></div>
<div class="button_link">aa</div>

再给你补个小知识点：

• # 是CSS里匹配元素ID的符号，而:hover是专门用来匹配元素被鼠标悬停状态的伪类，必须用冒号开头。
• 修正后不管是带链接的<a>还是普通的<div>，只要类是button_link，鼠标放上去就会触发颜色和背景的变化啦～

内容的提问来源于stack exchange，提问作者kojow7