CSS定位：
position：relative(相对)/absolute(绝对)/ static(无定位)/ fixed(固定)
文档流：从上往下，从左到右
相对定位：
relative：相对于自己以前所在的位置进行定位，效果如下图（本来在左上角，设置相对定位和top，left属性后，红色方块进行了移动）
如果设置了相对定位以后，不输入具体的top/left值，这样相对定位可以做为一种容器父元素存在。
<html>
<head>
<style type="text/css">
.main{
background-color: yellow;
}
.div1{
height: 100px;
width: 100px;
position: relative;
top: 10px;
left: 20px;
background-color: red;
}
</style>
</head>
<body>
<div class="main">