关于绝对定位以前一直存在的误解
我们知道绝对定位是依据定位元素的包含块进行定位，比如祖先元素相对定位，那么他的子级元素设为绝对定位时的参考元素就是这个祖先元素，但是考虑到下面这种情况：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
body {
height: 1200px;
}
.box {
width: 100px;
height: 100px;
background-color: red;
position: absolute;
bottom: 100px;
left: 20px;
}
</style>
</head>
<body>
<div class="box"></div>
</body>
</html>
这种情况按我以前的理解可能.box就会定位到整个页面底部100px处。然而真实情况是他会定位到距离浏览器首屏对应的页面的位置。看示意图：
这一点确实是以前从没有注意到的。只能说，活到老，学到老。
