相对定位是相对于该块元素在文档流中的位置的，比如，我们可以使用相对定位把div2放到div1的右侧，CSS代码如下： 
#div1 {
  border: 1px solid #000099;
  height: 60px;
  width: 200px;
  margin:2px;
}

#div2 {
  border: 1px solid #000099;
  height: 60px;
  width: 200px;
  margin:2px;
  position: relative;
  top: -64px;
  left: 204px;
}

#div3 {
  border: 1px solid #000099;
  height: 60px;
  width: 200px;
  margin:2px;
}

下面是效果：

  可以看到一个有趣的现象，那就是虽然我们把div2移走了，但是div1和div3中间还是有一个空间，说明相对定位的元素是会占据文档流空间的，这里的div2就是典型的“站着茅坑不拉屎”。

使用绝对定位也是可以把div2摆到div1的右边的，而且绝对定位是不会占据文档流空间的，如下图，div1和div3之间没有空白：


div2的CSS代码： 
#div2 {
  border: 1px solid #000099;
  height: 60px;
  width: 200px;
  margin:2px;
  position: absolute;
  top: 15px;
  left: 214px;
}

你自己可以根据这个编写代码，就可以看出他们的效果。总的来说，绝对定位可以把内容显示在页面的任何位置。但是相对位置却做不到这一点。