下面我们来看看神奇的position
原始状态
<div class="father">
父div
<div class="son1">div1</div>
<div class="son2">div2</div>
</div>
1、absolute（绝对定位）
absolute熟悉是绝对定位，脱离了文本流（即在文档中已经不占据位置），相对浏览器左上角设置top,right,bottom,left 进行定位。
设置
son1{
position: relative;
left: 30px;
top: -20px;;}
2、relative（相对定位）
relative属性是相对定位，就是相对于元素本身的位置对这个元素进偏移，可以通过设置top,right,bottom,left 进行定位。
设置
.son1{
position: relative;
left: 30px;
top: -20px;;
}
3、relative与absolute的结合使用
在二者同时使用的时候父元素如果设置了相对定位，那么子元素的绝对定位是相对父元素定位的：
设置
.father{
position: relative;
}
.son2{
position: absolute;
left:0;
top :0;
color: #ff917f;
}