将一个div提高到另一个div

时间:2017-09-30 08:55:49

标签: html css css-position

我有两个html div

<div style="height:100px;width:100px;position:fixed;left:0;top:0;background-color:red;" id="1">
<div style="height:200px;width:200px;position:fixed;left:0;top:0;background-color:yellow;" id="2">
</div>
</div>

这两个div位于同一个地方。因此,第二个div会超过第一个div。我想先提出div而不是第二个。

我可以通过将两个div的位置更改为其他位置来实现:

    <div style="height:200px;width:200px;position:fixed;left:0;top:0;background-color:yellow;" id="1">

<div style="height:100px;width:100px;position:fixed;left:0;top:0;background-color:red;" id="2">
    </div>
    </div>

但我不能这样做。因为我想制作#1的#2兄弟姐妹。 怎么做而不改变#1和#2的位置?

1 个答案:

答案 0 :(得分:2)

你把黄色的那个作为红色的孩子,在这种情况下,没有办法让红色(父母)在孩子面前。

我所做的就是让两个div成为兄弟姐妹。通过这种方式,您可以控制z-index属性,将其中一个属性放在前面。

&#13;
&#13;
<div style="height:100px;width:100px;position:fixed;left:0;top:0;background-color:red; z-index:10;" id="1"></div>
<div style="height:200px;width:200px;position:fixed;left:0;top:0;background-color:yellow;z-index:0;" id="2">
</div>
&#13;
&#13;
&#13;