通过悬停另一个来更改元素样式

Question

目标

通过使用CSS悬停另一个元素来更改元素。

问题

我不知道语法。有什么想法吗？

代码聚光灯

我希望通过悬停.frame来更改.app > a。 CSS语法如下所示：

.app a:hover ->¹ .frame {
    background-color: yellow;
}

.frame {
    background-color: blue;
    width: 300px;
    height: 300px;
}

¹只是插图。

(Also available in jsFiddle)

Answer 1

尝试使用此尺寸：

.app:hover ~ .frame {
    background-color: yellow;
}

.frame {
    background-color: blue;
    width: 300px;
    height: 300px;
}

演示：http://jsfiddle.net/maniator/jWA3s/1/

---

参考：What does the "~" (tilde/squiggle/twiddle) CSS selector mean?