html - 具有绝对位置的 div 不会与相对位置的 div 重叠

Question

HTML:

<div class="absolute">
</div>
<div class="relative">
</div>

CSS:

* {
    margin: 0;
    padding: 0;
}
html, body {
    height: 100%;
    width: 100%;
}
.relative {
    position: relative;
    background-color: #eee;
    height: 200px;
    width: 100%;
}
.absolute {
    background-color: #000;
    position: absolute;
    top: 0;
    left: 0;
    width: 100px;
    height: 100%;
}

jsfiddle:http://jsfiddle.net/Lv96zy10/

如何使用相对位置做 div 的位置在 div 之上？

提前致谢。

Answer 1

使用z-index 控制堆叠顺序。

给你想要的 div 一个更高的 z-index 数字。