3

我正在尝试通过在 div 上使用 z-index 创建这种类型的重叠：

嵌套的 DIV 和 z-index

但是，如果我将父元素的 z-index 设置为小于“非子”元素的 z-index 的数字，则子元素也会与它的父元素一起留在后面。我想知道是否有任何方法可以克服这个问题..

4

2 回答 2

5

你想做这样的事情吗？

http://codepen.io/mudittuli/full/rEgkw

于 2013-01-24T04:11:29.463 回答
1

没有看到你的代码很难判断，但我相信你使用一些 DIV 作为祖先；尝试单独使用它们。该示例可以满足您的要求：

<!DOCTYPE html>
<html>
    <head>
        <title>Positioning test</title>
        <style>
            div { position: absolute; width: 100px; height: 100px; color: #fff; text-align: center; }

            #parent { z-index: 1; background-color: red; left: 100px; top: 20px; }
            #not-child { z-index: 2; background-color: green; left: 140px; top: 40px; }
            #child { z-index: 3; background-color: blue;  left: 70px; top: 60px; }
        </style>
    </head>
    <body>
        <div id="parent">Parent</div>
        <div id="not-child">Not-child</div>
        <div id="child">Child</div>
    </body>
</html>
于 2013-01-24T03:59:21.907 回答