有时候项目中有这样的需求,是:
对一个div或者其他元素而言,hover之后需要触发另外一个元素的某个css事件,这里拿hover事件做效果。
以下方法来自stackoverflow, 例子中用的是id,当然也可以用class
例如
<div id="container">
</div>
<div id="cube">
</div>
如果cube直接在container的里面:
#container:hover > #cube { background-color: yellow; }
如果cube在container的外面,其紧挨着container:
#container:hover + #cube { background-color: yellow; }
如果cube在container里面的任何地方:
#container:hover #cube { background-color: yellow; }
如果cube是container的兄弟节点:
#container:hover ~ #cube { background-color: yellow; }