原始代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<style>
.parent{
width:400px;
height:400px;
background:red;
overflow: auto;
position: relative;;
border:1px solid purple
}
.content{
width:600px;
height:800px;
}
.child{
position:absolute;
bottom:0;
right:0;
width:40px;
height:40px;
background:blue;
}
</style>
<section class="parent">
<div class="content"></div>
<div class="child"></div>
</section>
</body>
</html>
疑惑为什么带滚动条的时候绝对定位元素不会再移动了？
CSS 秘籍再说一遍：知道每个元素的边界。
你得高度是不是 400，那么浏览器就把 child 放到 400 咯。
你滚动的时候，不会再去更新 child 的位置了。
相对位置不管滚动
只有 sticky 才会去更新，不过 sticky 还没实现 position: sticky
容器的宽高并没有变，所以里面的绝对定位元素不会更新的
如果宽高变了 会更新
