深度剖析 position: absolute 属性

1、如果父级不是默认的static属性，例如设置了relative, fixed, 那么就会根据父元素定位

2、如果父级都没有设置定位属性，则会相对于当前屏幕大小的高度，根据左上角定位，即浏览器窗口的第一屏

那么在第二种情况下它和固定定位fixed的区别是什么：

假如body产生了滚动条，那么fixed定位无论滚动条如何滚动都会在屏幕的固定位置不变
而absolute, 它会停留在屏幕高度的body的某个位置，随着滚动条滚动而滚动
例如，body高1000px, 屏幕高200px, position:absolute, bottom: 0;那么它就会在body上200px处，随滚动条滚动而滚动

补充知识点

如果给body设置一个颜色，并且高度设置100px, (假如当前屏幕是500px)
那么就会发现，整个屏幕都是这个body色，而不仅仅只有body的100px有颜色，
原因是：
如果浏览器没有设置背景颜色，那么它会自动把body的背景色当成自己的背景色，从而导致body背景色占据整个窗口。也就是说，我们要想为body设置背景色，那么只需要给浏览器设置一个背景色即可
所以只要给html设置一个颜色，那么body的背景色就只有那100px有了，屏幕其他部分填充的则是html色