CSS中相对定位怎么理解？

1、相对定位，是当前元素相对父容器的定位，如果父容器不存在，那就是window对象，你可以理解成浏览器就和了。那么怎么定义呢？先第一步，给定两个DIV,一父一子，代码如下：

<div class="father">

<div class="son">son</div>

</div>

此时没有任何效果。

2、我们给father类加上样式，代码如下： 

.father{

margin-left: 300px;

background: pink;

width: 400px;

height: 400px;

border: 1px solid red;

}

3、给son元素加上样式，这里要设置相对定位，就是相对father类的定位。

.son {

position: relative;

left: 40px;

top: 50px;

border: 1px solid white;

width: 200px;

}

此时看到son元素并没有相对浏览器设置了距离，而是在father容器内。