css - 如果它属于两个类，则将悬停应用到无序列表项

Question

我试图在悬停时突出显示除第一个之外的列表项。

这是html：

  ...
  <ul class="topmenulist">
  <li><a href="#" class="active" >Home</a></li>
  <li><a href="#" class="notactive" >What we do</a></li>
  <li><a href="#" class="notactive" >Projects</a></li>
  <li><a href="#" class="notactive" >Contact</a></li>
  </ul>
  ...

这不起作用：

  .notactive.topmenulist li:hover{ 
  background-color: #EAEAEA;
  }

这有效，但它也适用于我不想要的第一个：

  .topmenulist li:hover{ 
  background-color: #EAEAEA;
   }

谢谢

Answer 1

.topmenulist li:hover a:not(.active) {
    background-color: #EAEAEA;
}

jsFiddle

或更简单：

.topmenulist li:hover a.notactive {
    background-color: #EAEAEA;
}

jsFiddle

编辑：如果你想突出所有li你.noactive应该申请:hover的ul（.topmenulist）：

.topmenulist:hover li a.notactive {
    background-color: #EAEAEA;
}

jsFiddle