如何使用CSS访问不同包装器中的div？

Question

我正在尝试与一个不在同一个包装器中的div进行交谈，而不是我正在盘旋的div。我正在使用以下代码来更改div主页悬停的div图片的背景颜色，并且它们都在div navBar中：

.navBar .home:hover ~ div.picture {
    background:#900; }

如果我将家或照片放在另一个div中，我将无法访问它们。

有谁知道怎么解决这个问题？

Answer 1

您将无法从仅使用CSS3选择器的元素中获取不是后代或后续兄弟元素的元素。您必须采用JavaScript路由才能以不同的结构执行您想要的操作。

Answer 2

这是C在样式表中的用武之地。级联意味着，你只能在你正在工作的树的下方和下方。

要操纵树外的div，你需要上面的JS路线或者只是一个非常简单的jquery，例如

$(.navBar .home).hover(function () {
  $(div.picture).css("background-color","#900");
  }, 
  function () {
  $(div.picture).css("background-color","#FFF");
});