Question

对不起，如果问题有点模糊，我发现标题很难。无论如何，我目前正在创建一个新的设计，我遇到了一个问题，我基本上想要一个div从另一个下面开始，因为我之前在div上使用圆形边缘并且想要掩盖空白。

我能够将div设置为底层，但是当我设置z-index时，它将成为底层元素，并且无法与链接等进行交互。（例如链接无法点击，无法突出显示文字）

为了更好地解释，我创建了这个JSFiddle链接，它显示了我正在尝试做的事情。尝试点击该链接，它将无法正常工作。

JSFiddle上的代码如下：

#div-1, #div-2 {
width: 350px;
border-radius: 0 0 16px 16px;
}

#div-1 {
background-color: grey;
}

#div-2 {
background-color: black;
position: relative;
z-index: -1;
margin-top:-25px;
}

感谢任何帮助，如果您希望我澄清一切，请询问。

谢谢，

杰克

Answer 1

演示 http://jsfiddle.net/Amn7S/

请勿使用z-index:-1;使用z-index:1;和z-index:2;然后才能运作。

#div-1 {
    background-color: grey;
    z-index:2;
    position:relative;
}

#div-2 {
    background-color: black;
    position: relative;
    margin-top:-25px;
z-index:1;    
}

Answer 2

改为使用z-index-1;你应该使用正z-index 并告诉每个div在哪里。

http://jsfiddle.net/wdQWu/3/

#div-1, #div-2 {
    width: 350px;
    border-radius: 0 0 16px 16px;
    position:relative;
    z-index:1;
}
#div-1 {
    background-color: grey;
}
#div-2 {
    background-color: black;
    position: relative;
    z-index: 0;
    margin-top:-26px;
}

oups，迟到了，已经在那里回答：）

Answer 3

您可以将链接的z-index更改为高于第二个div

Answer 4

这样的事可能吗？

http://jsfiddle.net/wdQWu/1/

我已经在代码中看到了一个带有类包装器的div。

.wrapper {
    width: 350px;
    border-radius: 0 0 16px 16px;
    background-color: black;
}

希望它有用..

CSS支持前一个div

4 个答案: