关于悬停另一个元素的问题

Question

我正试图对其产生影响：

  

将图片悬停在＆gt;更改以下链接的颜色

但我无法使其正常运作。如果我定位整个第一个容器.clearfix，我只能使这个效果起作用，但是我怎样才能让它以只有我悬停img而不是整个.clearfix的方式工作元素，会改变链接的颜色吗？

.clearfix:hover > b a {
    color:red;
}

<li class="clearfix">
    <div class="zitem"><a href="#"><img class="recent_thumb" src="http://lorempixel.com/270/142/sports"/></a></div>
    <b><a href="#">Random Title text</a></b>
<br>
</li>

我也试过这些：

.clearfix:hover + b a { ... }
.clearfix:hover ~ b a { ... }

但它似乎没有用或做任何事情......也许我做错了。

Answer 1

试试这个

.zitem:hover + b a {
    color:red;
}

带有div类和zitem元素的

<b>是兄弟姐妹，所以兄弟选择器（相邻+或一般〜）将适用于这些。

Answer 2

这会找到你的问题---

.zitem:hover + b a {
    color:#ff0000;
}