CSS在班级

Question

如何在CSS中选择同一类的更多范围？我需要它专门用于悬停。

我试过span.classname:hover 和.classname span:hover 第一个不起作用的地方，第二个一次仅适用于一个跨度。

这就是html的外观：

Answer 1

:hover选择器会在悬停时应用于范围。

如果要悬停在元素上时突出显示元素中的所有跨距，则需要向左移动:hover选择器：

    div.special:hover span {
        color: red;
    }

<div class="special">
    <span>Span</span> and another <span>Span</span>
</div>

当您将鼠标悬停在特殊div上时，这将适用于特殊div中的所有范围。

如果你希望在一个跨度悬停时激活其他跨度，你将不得不编写脚本...你可以在CSS中获得的最接近的是一般的兄弟选择器，它适用于跨度和其他跨度在同一个父母中跟随它。我想你也希望它能够向后工作，在这种情况下它不会。

span:hover, span:hover ~ span {
  color: red;
}

<div>
    <span>Span</span> and another <span>Span</span>
</div>