CSS li包含类但不禁用类

Question

我试图让我的悬停选择正常工作。

我在li元素中有两个类。它可能有一个名为disabled的类，或者它可能有一个名为wait的类，或者它可能同时包含disabled和wait

我希望这个悬停仅适用于名为wait的类的li元素，但仅限于disabled类不在其上。

我怎样才能实现这一目标？

目前的尝试：

.group li:.wait:not(.disabled):hover {
// do something

}

Answer 1

在:之后你有一个li，这表示你的查询中的以下元素将是pseudo-class。但是，您只需要一个简单的类选择器：.wait。

.group li.wait:not(.disabled):hover {
  color: red;
}

<ul class="group">
  <li>None</li>
  <li class="wait">Wait</li>
  <li class="disabled">Disabled</li>
  <li class="wait disabled">Wait and Disabled</li>
</ul>