为什么绝对定位相对于父元素而非浏览器窗口？

哈喽！大家好，很高兴又见面了，我是golang学习网的一名作者，今天由我给大家带来一篇《为什么绝对定位相对于父元素而非浏览器窗口？》，本文主要会讲到等等知识点，希望大家一起学习进步，也欢迎大家关注、点赞、收藏、转发! 下面就一起来看看吧！

绝对定位问题困扰

遇到一个令人费解的问题，试图对 div 应用绝对定位，但它仍然相对于其父元素进行定位。据了解，父元素需要设置绝对或相对定位，才会出现这种行为，但我的父元素并没有进行任何此类设置。

经过调查，发现导致问题的原因不在于代码中，而在于 html 节点的结构。如果不想让这个块基于当前父元素进行定位，最有效的解决方案是将其移至合适父元素之下。

代码中出现的等效结构：

<div>
    <div>
        <div>定位异常块</div>
    </div>
</div>

建议的结构：

<div>
    <div>要定位的块</div>
    <div></div>
</div>

如果要定位的块是在组件内定义的，无法将其移至父元素，则只有两种可能：

1. 纯浮动框，本质上应该是一个独立组件，需要修改组件声明。
2. 浮动框应用的是 position: fixed 定位，而不是 absolute。

值得注意的是，这个疑惑已经困扰了许多开发者，如果你也遇到了类似的问题，不妨检查一下 html 结构并尝试以上建议的解决方案。

文中关于的知识介绍，希望对你的学习有所帮助！若是受益匪浅，那就动动鼠标收藏这篇《为什么绝对定位相对于父元素而非浏览器窗口？》文章吧，也可关注golang学习网公众号了解相关技术文章。