定位、图片Z-index覆盖详解

CSS最重要的三个技术:浮动、盒模型、定位，这里主要介绍一下定位方面的知识：
我们都知道定位通常可以分为三种:固定定位、绝对定位、相对定位。

 **相对定位:**
    position:relative;
    left:
    right:
    top:
    bottom:
    正值的话分别表示向右、向左、向下、向上移动;
    负值的话分别表示向左、向右、向上、向下移动;
    相对定位表示元素相对自己当前的位置移动，一般左右任选一个，上下任选一个，进行定位。

****参见代码:****

div{
        width: 200px;
        height: 200px;
    }
    .box1{
        background-color: #f00;
    }
    .box2{
        background-color: #0f0;
    }
    <div class=