position属性有四个值：
static（静态定位）：是默认值，不会被特殊的定位，遵循正常的文档流对象，对象占用文档空间，该方式下，top、right、bottom、left、z-index等属性无效。
relative(相对定位)：不添加额外属性的情况下，和static表现一样，当使用top、bottom、left、right的的时候，会使其偏离正常位置。而其他的元素不会调整位置来弥补它偏离后剩下的空隙。当元素设置了marginpadding属性后，会占据文档空间，影响其他元素。
.div1{
position:relative;
top:20px;
100px;
height:100px;
margin-bottom:20px;
}
.div2{
100px;
height:100px;
}
在div1增加了top属性后，div1向下移动20px，对div2不产生影响。当div1增加margin-bottom属性后，div2向下移动20px。
absolute（绝对定位）：
绝对定位是相对于最近的"positioner"祖先元素。如果绝对定位的元素没有"positioned"祖先元素，那么它是相对于html元素，并且会随着页面滚动而移动。"static"和"relative"是相对于"body"标签为定位原点。body和html元素相差9px左右。"positioned"元素是指position不是"static"的元素。
absolute定位的元素脱离了文档流。
在设置了absolute定位后，需要设置至少一个left ight opottom中的一个值，不然会默认为relative。在同时设置top和bottom的时候，top有效。同时设置left和right的时候，left有效。
绝对定位元素是根据祖先元素的border来进行定位，即绝对定位元素是相对祖先元素的margin位置来进行定位。
fixed(固定定位)：
固定定位是相对于视窗来定位，即使页面滚动，它仍会停留在相同的位置。top、bottom、left、right属性都有效。固定定位元素不保留它原在页面应有的空隙。
文档流的定义即按照从左到右从上到下的顺序排放元素。