为什么 div 的默认位置值是静态的而不是相对的？

Question

就像标题一样，为什么 div （或 p 或 html 中的任何其他元素）将 'position: static' 作为默认值？为什么不是“位置：相对”？我没有看到在我的 CSS 中使用“position: static”有任何好处。使用“position:relative”定义 html 中的所有 div 元素是否安全？

编辑：我很清楚静态、相对、绝对和固定定位之间的区别。但主要问题是为什么 div 或任何其他 html 元素的默认定位是静态的？这个例子：

超文本标记语言

<div class="div1">
    <div class="div2">
        <div class="div3">
            <div class="div-last"></div>
        </div>
    </div>
</div>

CSS

.div1 {
    width: 700px;
    height: 700px;
    background-color: #000;
    position: relative;
}
.div2 {
    width: 600px;
    height: 600px;
    background-color: #333;
    position: relative;
    top: 20px;
    left: 20px;
}
.div3 {
    width: 500px;
    height: 500px;
    background-color: #777;
    position: absolute;
    right: 0;
    top: 30px;
}
.div-last {
    width: 400px;
    height: 400px;
    background-color: #AAA;
    position: absolute;
    bottom: 20px;
    left: 20px;
}

表明我不需要一个静态定位来按我想要的方式排列我的 div。这是上面代码的jsfiddle 。对不起我的土豆英语。：D

编辑＃2：相关问题的答案是：“是的，是的。如果您尝试绝对定位一个元素，它会相对于最近的祖先定位，该祖先的 CSS 位置不是静态的。

如果每个元素都有position:relative，那么这将是直接父元素。

但您可能希望将绝对元素相对于 DOM 树中更靠上的元素定位，或者绝对定位在页面主体上。”

所以，我不想/不需要“将绝对元素相对于 DOM 树中更靠前的元素定位，或者绝对定位在页面主体上。”，在进行所有操作之前，我需要了解其他技术预防措施吗？ div 相对？

Answer 1

如果position: relative是默认值，position: absolute;将不再按预期工作。也就是说，因为position: absolute使用层次结构中最近的非静态定位元素作为参考。如果没有静态定位的元素，则所有元素都将是非静态的，因此position: absolute将使用父元素作为参考，从而不再绝对定位，而是相对于父元素定位。