欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

body有无position:relative对相对于其定位的元素的影响

程序员文章站 2022-04-25 11:37:45
...

给设置了postion:absolute的元素相对于 static 定位以外的第一个父元素进行定位,如果找不到这样的一个父元素,则相对于body定位。但是这是body设置了position了没有设置position是有区别的。
如:

<style>
    body {
        height: 3000px;
        /* position: relative; */
    }
    .son {
        positon: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background-color: red;
    }
</style>
<body>
    <div class="son"></div>
</body>

如果body没有设置除position之外的其他值,则设置了position:absolute;的元素占据的位置由当前窗口大小决定。
如果body设置了position:relative;(或其他非static的值),则设置了position:absolute;的元素则是整个body的范围。

相关标签: position:absolute