relative那么為什么會遮蓋住2222222的半部分
<!DOCTYPE>
<html>
<head>
<meta?http-equiv="Content-Type"?content="text/html;?charset=utf-8">
<title>定位</title>
<style>
*{margin:0;padding:0;color:#FFF;background-color:?#666;}
#wrap{width:960px;margin:0?auto;}
#header{height:500px;}
#mainbody,#footer{height:200px}
#header{background-color:?#75936C;position:relative;left:10px;top:10px;}
#mainbody{background-color:?blueviolet;}
#footer{background-color:?yellowgreen;}
</style>
</head>
<body>
<div?id="wrap">
0000000000000000000000000</br>
0000000000000000000000000000
<div?id="header">?
1111111111111111111111111111
</div>?
222222222222222222?</br>
3333333333333333333
<div?id="mainbody">
</div>
<div?id="footer">
</div>
</div>
</body>
</html>
我通過增加最上面一個塊的高度，證實了它模式還在文檔流中。
因為222……和333……這兩行會被不斷的往下擠
那么relative既然沒有z-index屬性，為何它會遮擋住222……的上半部分呢，這讓我感到非常奇怪。
2016-07-09
設置了relative，還是在標準文檔流里的，原來模塊占據的位置會保留，然后相對這個保留的位置進行偏移，并且具有z-index屬性，會有層疊的效果，所以覆蓋到了2222
2016-01-15
應用relative 屬性后具有空間層堆疊的性質，且原來占據的空間保留，相當于原位置留空并在上面一層相對于自身偏移
2016-01-15
relative有z-index屬性
http://www.xianlaiwan.cn/video/1327
視頻里57s的地方
2016-01-15
由于header模塊relative偏移后還保留著原來的空間，所以22222222是緊跟在原來的空間上，所以header新的位置會覆蓋到22222222這個內容。