这个问题在这里已有答案:
我知道如何在悬停时更改元素的样式,但我想在第一个元素聚焦或悬停时更改另一个元素的样式。
这完全取决于您的HTML结构。
如果受影响的元素是触发器元素的子元素,则可以使用该模式
.[TRIGGER_PARENT_CLASS]:hover .[AFFECTED_CHILD_CLASS]
这种模式可以根据您的需要进行深度嵌套。值得注意的是,您可能希望使用Child combinator来选择直接子元素。
如果受影响的元素是触发元素的兄弟元素,并且触发元素直接位于受影响的元素之前,则可以使用模式:
.[TRIGGER_CLASS]:hover ~ .[AFFECTED_SIBLING_CLASS]
您可以了解更多有关Child and Sibling Selectors in this CSS-Tricks article的信息