CSS选择器问题。你知道怎么选这个吗？

我想在缩略图悬停上显示一个新图标

你可以在电脑上查看我的代码

这项工作：

 #main:hover  .whitewrapper {
  display: block;
}

.post-more a:first-child:hover ~ .whitewrapper, .whitewrapper:hover {
    display: block;
}

但它徘徊在主屏幕上

我已经试过了，但没有成功：

img.thumbnail:hover  .whitewrapper {
  display: block;
}

#main img.thumbnail:hover  .whitewrapper {
  display: block;
}

.thumbnail:hover  .whitewrapper {
  display: block;
}

img.thumbnail:hover  .whitewrapper {
  display: block;
}

img.thumbnail .alignleft:hover  .whitewrapper {
  display: block;
}

.thumbnail .alignleft:hover  .whitewrapper {
  display: block;
}

#main.thumbnail .alignleft:hover  .whitewrapper {
  display: block;
}

#main.thumbnail .alignleft img:hover  .whitewrapper {
  display: block;
}

.thumbnail .alignleft img:hover  .whitewrapper {
  display: block;
}

.thumbnail img:hover  .whitewrapper {
  display: block;

这项工作：

 #main:hover  .whitewrapper {
  display: block;
}

.post-more a:first-child:hover ~ .whitewrapper, .whitewrapper:hover {
    display: block;
}

IE7+和所有现代浏览器都支持和

您需要在每篇文章中修复第一个a：

<div class="post-more"> 
    <a href=".." onclick=".."<a title=".." href=".." >..</a></a>

---

这是坏掉的HTML，这会导致我提供的选择器在某些浏览器中失败。

您可以使用

如果div直接位于img之后，则应能：

img.thumbnail:hover + .whitewrapper {
   display: block;
}

---

更新：我测试了它，它对我有效。这是答案。

你确实试过很多东西@洛基：请修复我的所有代码在这个网站上通常是不可接受的问题-请参阅常见问题解答。请缩小范围并澄清。但是对于初学者来说——修复你的标签——他们都会给出404。古斯塔夫，你说的修复脚本标签是什么意思？看起来它们对我很管用……还有很多。此外，您需要在插件之前包含jQuery。而且你的页面中似乎有卷曲的引号，你的整个页面也缺少结尾和标签。我以前从未见过。。。毫无疑问，从� 符号有卷曲的引号吗？在第4行。注意，我已经更新了我的答案，因为我第一次发布它。获取最新版本的选择器，它解决了Firefox的一个问题。再次感谢！我希望将来能有这样的css技能。