overflow:auto;导致子元素定位随着滚动条滚动而向上滚动

最新推荐文章于 2023-07-30 11:54:07 发布

北墓南笙i

最新推荐文章于 2023-07-30 11:54:07 发布

阅读量2.4k

点赞数 1

文章标签： css html

本文链接：https://blog.csdn.net/a__person/article/details/104019011

版权

当CSS中设置`overflow:auto`时，子元素的相对定位会随滚动条变化。即使子元素定位超出父元素，父元素仍会出现滚动条。滚动时，子元素的位置会根据坐标系的变化而改变，保持相对定位的状态。

摘要由CSDN通过智能技术生成

相对定位的父元素;设置overflow:aotu;之后;相对定位的子元素会随着父元素滚动

<style>
        .box1 {
   
            width: 100px;
            height: 100px;
            overflow: auto;
            position: relative;
            margin: 100px auto;
            border: solid 1px blue;
        }
        .box4 {
   
            width: 100%;
            position: absolute;
            bottom: 0px;
            background-color: red;
        }
    </style>
</head>
<body>
    <div class="box1">
        <div class="box2">
            <div class=