第2：相对定位(relative)
相对定位是依据设置定位属性的4个方向上的任意值来实现相对与其本来在文档中正常显示的位置的偏移；
当相对定位的元素偏移出其本来的文档流的位置：其他元素仍然认为那个位置为其的逻辑文档流区域.而不会去补上去，虽然我们感官上认为那里是没有东西的~
例子：
运行代码框
[Ctrl A 全部选择 提示：你可先修改部分代码，再按运行]
其中第2个色块就是相对于其本来的文档流中的位置依据left:10px;top:20px;的定位属性值进行偏移.
其后面的第3个色块依然认为前面的空白（就是第3的原本的文档流的位置）为第3个色块的文档流区域 则不会自动填充上去.
当相对定位的父元素出现滚动条时，IE浏览器的特殊情况
例子：
运行代码框