今天真是倒了巨霉了。这篇文章写了两次，都是快写完的时候给误撤销了。DB啊，你还能再二点吗？
好了，言归正传。今天做了一系列的position试验。原本是贴了代码的，被搞了两次，无语了，贴上心得罢了。
1：需要绝对定位的元素，会从其父元素开始向上寻找，一直找到有relative或者absolute定位的元素，然后相对其进行定位。
2：如果需要绝对定位的元素，其父元素或者祖元素都没有定位属性，那么该元素会相对与浏览器可视窗口的第一屏进行定位。
3：需要相对定位的元素，只根据自身原有的位置进行定位。并保留自身原有的空间。
以下代码说明第三点：可以看到蓝色DIV并没有紧靠其父元素，而是紧接着targetDiv原有的位置。
<DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>ABSOLUTE的定位</title>
<style>
#wrapper{width:800px; height:800px; border:1px solid grey; margin-left:-400px; position:relative; left:50%;top:20%;}
#innerContainer{width:500px; height:500px; margin-left:250px; background:grey;}
#targetDiv{width:200px; height:200px; background:red; position:relative; right:50px; top:50px;}
#nextTag{width:100px; height:100px; background:blue;}
</style>
</head>
<body>
<p>如果元素有position属性为absolute，那么该元素会向上父级寻找</p>
<div id="wrapper">
<div id="innerContainer">
<div id="targetDiv">
</div>
<div id="nextTag"></div>
</div>
</div>
</body>
</html>
![CSS的伪元素和伪类的区别[图]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)