CSS-hover不生效

<div class='ho'>
    <a>hover測試</a>
</div>

 

當鼠標經過鏈接時，變化鏈接字體顏色，如果a標簽使用類選擇器+后代選擇器，而a:hover不用后代選擇器，hover不生效，如：

.ho a {
  color:black;    
}

a:hover {
  color:red;
}

原因：a:hover 表示的時當鼠標懸停在a標簽上時，改變a標簽的樣式，其本質就只是改變a標簽的樣式，而.ho a選擇器也改變了a的樣式，其權重大於a:hover選擇器權重，導致a:hover失效，更改a:hover權重后即可生效

.ho a {
  color:black;    
}

a:hover {
  color:red !important;
}