根据W3Schools（http://www.w3schools.com/css/css_positioning.asp）：
相对定位的元素通常用作容器块 绝对定位的元素。
这是为什么？有一个很好的例子吗？
答案 0 :(得分：19)
一个很好的例子就是当你想要将某些东西放在页面上或“相对”容器/ div时。
这是我的小提琴http://jsfiddle.net/doitlikejustin/RdWQ7/2/
这表明如果没有绝对div在“relative”div中，则内容将与文档正文对齐。
请注意绿色div（#box1），其中position: relative，div（#inner1）内的div在#box1的内部/右上方对齐。
蓝色框（#box2）与绿色框（#box1）具有完全相同的HTML布局，不包含position: relative并注意到其中的div（{ {1}}）与#inner2
body以下是来自Chris Coyier的一篇很好的文章......
具有相对定位的页面元素使您可以控制 绝对将儿童元素放在其中。
来源：http://css-tricks.com/absolute-positioning-inside-relative-positioning/
答案 1 :(得分：9)
其他答案没有明确说明：
绝对定位是在最近的没有静态定位的祖先中测量的。赋予祖先相对定位只是达到目的的一种手段。它不必是相对的，它不能是静态的。
具有绝对位置和
的元素顶部：10px的;
距离最近的祖先顶部10个像素，其位置不是静态的。
答案 2 :(得分：1)
如果绝对定位元素不在相对元素中，那么当您使用值设置top，left，right或bot时，它会将绝对位置元素从主体移动该值。 这是什么意思？例如，如果将绝对位置元素的属性top设置为10px，则会将元素从屏幕顶部推出10个像素。
如果绝对位置元素位于相对元素中，那么当您使用值设置top，left，right或bot时，它将使该值从该相对元素移动绝对位置元素。 这是什么意思？例如，如果将绝对位置元素的属性top设置为10px，则会将元素从相对元素的顶部推出10个像素。在那里你可以移动相对元素，它内部的绝对定位元素总是距相对元素顶部10个像素。