html - z-index 会影响元素超过 "hovered"吗？

Question

如果我有一个 div，它下面有另一个 div，底层 div 的 hover 是否会当光标位于 div 上方时状态被激活？假设顶部 div 的 z-index 为 5，而另一个 div 的 z-index 为1.

Answer 1

简短的回答是否定的。

以如下代码为例:

HTML:

<div id="one">one</div>
<div id="two">two</div>

CSS:

div {
    position: absolute;
    height: 300px;
    width: 300px;
}
div:hover {
    background-color: yellow !important;
}
div#one {
    top: 0;
    left: 0;
    background-color: red;
    z-index: 10;
}
div#two {
    top: 150px;
    left: 150px;
    background-color: green;
    z-index: 1;
}

当 div#two 悬停在重叠区域时，悬停永远不会在 div#one 上激活。

http://jsfiddle.net/Yff7Q/