Question

我不知道如何妥善解决我遇到的问题所以标题几乎没有说什么，但无论如何我遇到的问题是这段代码：

div {
width: 100%;
}

#wrapper {
    width: 500px;
    height: 500px;
    position: relative;
}

#one {
    height: 200px;
    background-color: red;
    position: absolute;
    z-index: -1;
}

#sub {
    height: 50px;
    background-color: green;
    position: absolute;
    z-index: 3;
}

#two {
    height: 200px;
    width: 300px;
    background-color: blue;
    margin: 0px auto;
}

因此，绿色div可能位于蓝色div之前，因此它保留红色div的子元素。我知道这个z-index：3不起作用但是没有任何想法如何使洗脱起作用;

Answer 1

不，因为只有2个元素是兄弟姐妹而不是父母和孩子，$config->addCustomNumericFunction('COS', 'DoctrineExtensions\Query\Mysql\Cos'); $config->addCustomNumericFunction('SIN', 'DoctrineExtensions\Query\Mysql\Sin');才有效。

基本上z-index在整个#two容器之前排队：

#one

且0 #two -1 #one包含的#one不在#sub之外且#one仍在#one之后，因此#two也是，在#sub之后。

想象#two这样：

z-index

Answer 2

HTML / CSS的简单答案是否。

z-index有几条规则：

您必须使用position

z-index

如果设置了父z-index，则子项无法显示在父项上方。例如。父级的z-index为2，子级div的z-index为3，子级仍然不会显示在父级之上（除非使用减值）。

您需要更改HTML结构，以便div成为兄弟姐妹。

Answer 3

This article提供了关于z-index如何工作的解释。简而言之，z-index适用于所有子对象。

只有解决方案才能删除＆＃34; sub＆＃34;将它放在＆＃34;一个＆＃34;

之外

不同的z指数值

3 个答案: