CSS中position属性值relative与absolute区别

背景：
??? 在做网页设计时，需要定位HTML元素位置时，势必要使用到CSS样式position值relative、absolute。

样例：

注：position值为absolute的HTML元素其位置是以position样式值为relative最近祖先元素为参照.如果没有则以浏览器左上角(或者BODY元素)为参照

最佳实践：
最好时父relative元素中所有子元素采用absolute元素，这样嵌套