有什么方法可以将鼠标悬停在一个元素上并影响另一个元素？[重复]

使用CSS的唯一方法是，要影响的元素是后代还是相邻的同级元素。

对于后代：

#parent_element:hover #child_element, #parent_element:hover > #child_element {    opacity: 0.3;}

这将适用于以下元素：

<div id="parent_element">    <div id="child_element">Content</div></div>

对于相邻的兄弟姐妹：

#first_sibling:hover + #second_sibling {    opacity: 0.3;}

哪个适用于标记，例如：

<div id="first_sibling">Some content in the first sibling</div> <div id="second_sibling">and now in the second</div>

在这两种情况下，选择器中的后一个元素都是所选元素。

给定您的伪代码示例，您可能想要类似以下内容：

img:hover + img {    opacity: 0.3;    color: red;}

JS小提琴演示。