Question

据我了解，如果我们执行以下操作：

<div id="Outer">
    <div id="Inner"></div>
</div>

外部div的位置是相对的，而内部div的位置是绝对的，那么我们基本上可以在“外部div”（顶部/左侧/底部等）内将内部的位置定位。

在试图弄清position元素如何工作时，我尝试设置以下构建：

外部分区
外部div内的内部div。
内部div内的内部div。

我所做的更改是将内部div的位置更改为绝对，即使您内部的内部div是绝对的并且其父对象是绝对的，我仍然能够将内部内部div定位。我试图了解如何以及为什么能够做到这一点。我的意思是，父div（div number 2）=>不是位置：相对；但这是位置：绝对；但是，我已经成功定位了内部内部div，就像当父级为“相对”时要定位的那样。

很高兴听到有关此特定设置为何起作用的解释。这是完整的代码：

<html>
<head>
<style type="text/css">
.OuterDiv {
    padding: 0px;
    margin: 0px auto 0px auto;
    width: 500px;
    height: 300px;
    background-color: #E6E6E6;
    overflow: hidden;
    position: relative;
}
.InnerDiv {
    position: absolute;
    left: 50px;
    top: 50px;
    width: 200px;
    height: 200px;
    background-color: #D3DEEF;
    overflow: hidden;
}
.InnerInner {
    position: absolute;
    top: 20px;
    right: 20px;
    overflow: hidden;
}
</style>
</head>
<body>
<div class="OuterDiv">
    <div class="InnerDiv">
        <div class="InnerInner">Inner Inner</div>
    </div>
</div>
</body>
</html>

Answer 1

如果父元素的位置不是静态，则<div> <div class="inner-box">  </div> <div class="wrapper">  </div> </div>元素将相对于其父元素定位。（可以是绝对的，相对的，但不能是静态的）

绝对位置div内的绝对位置div。如果外部div不在相对位置，它如何工作？

1 个答案: