css - 如何在将鼠标悬停在另一个元素上时更改元素？

标签 css

我想知道是否可以将鼠标悬停在一个元素上，并更改另一个元素的悬停状态。问题是我想要应用悬停状态的元素位于 dom 的上方，而不是下方。

这是我的标记...

<figure>
  <img src="http://placekitten.com/200/300">
  <figcaption>
    <a>View image</a>
  </figcaption>
</figure>

以及我拥有的CSS(显然目前不起作用)......

a:hover figure img {opacity:0.3}

如您所见，我尝试将鼠标悬停在 A 标记上，然后更改图像上的悬停状态。

如果您想测试的话，这里有一个代码笔......

很想知道是否有解决方案。

最佳答案

我不知道你是否要求严格的CSS解决方案，但总有jQuery.hover()

关于css - 如何在将鼠标悬停在另一个元素上时更改元素？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18817904/