html – 影响div:悬停与另一个div

参见英文答案 > How to affect other elements when a div is hovered6个
我正在制作一个画廊,当你将鼠标悬停在主图像上时,缩略图应该变得透明.我想用纯CSS实现这一点,但我不确定这是否可行.

CSS:

/* should affect thumbs but not main */
/* obvIoUsly this code wouldn't work */
#main:hover,#thumbs {
  opacity: .5;
}

HTML:

<div id="main">
  Hover over me to change #thumbs
</div>
<div id="thumbs">
  I change when you hover over #main
</div>

这可能使用纯CSS吗?

解决方法

当然,只需使用相邻的兄弟选择器:
#div1:hover + #div2 {
    ...
}

这里有一个例子:http://jsfiddle.net/6BfR6/94/

相关文章

vue阻止冒泡事件 阻止点击事件的执行 &lt;div @click=&a...
尝试过使用网友说的API接口获取 找到的都是失效了 暂时就使用...
后台我拿的数据是这样的格式: [ {id:1 , parentId: 0, name:...
JAVA下载文件防重复点击,防止多次下载请求,Cookie方式快速简...
Mip是什么意思以及作用有哪些