给元素添加一个hover样式，很简单，我们来看一个透明度的例子吧：
1 2 3 4 5 6 |
div {
opacity: 1.0;
}
div:hover {
opacity: 0.5;
}
|
但是如果我们只是想让当前真正hover了的div显示，而让其他的div模糊呢？
假设我们的HTML结构如下：
1 2 3 4 5 |
<section> <div></div> <div></div> <div></div> </section> |
我们可以给所有的div元素添加下面的透明度降低的属性：
1 2 3 |
.parent:hover > div {
opacity: 0.5;
}
|
然后我们再特别处理那个真正hover了的div：
1 2 3 |
.parent:hover > div:hover {
opacity: 1.0;
}
|
谁在用呢？
某敏感推在他们For Mac的程序中使用了相关的技术，效果还是不错的：
实例
这个想法可以扩展到很多地方，这里是一个列表的例子，当你鼠标进入列表的时候，其余列的透明度降低，