html中相对定位与绝对定位

html是整个文档空间，body是html中的文档空间， body与html相差9cm左右

postion中的相对定位：relative

postion中的绝对定位：absoute

相对定位：

当没有参照物的时候，相对定位是相对与body定位的

绝对定位：

当没有参照物额时候，绝对定位是相对与html定位的

使用margin的时候，是占用文档空间的，一般用在相对定位使用

使用top，left，right，button的时候，是不占用文档空间的，看情况使用

我们一般是在相对里面套用绝对来进行项目的开发

 #divAddress{
 position: relative;
 margin-top: 48px;//这就是刚才提的当使用margin的时候才能进行下面的相对
 width: 370px;
 height: 66px;
 border-bottom: 1px #c1c1c1 solid;
 }
 #img1{
 position: absolute;
 float: left;margin-top:2px;
 width: 24px; height: 24px;
 }
 .address{
 position: absolute;
 margin-left: 34px;
 font-size: 20px;
 color: #c1c1c1;
 }

 #peoplePost1{
 position: relative;
 margin-top: 12px;
 width: 370px;
 height: 40px;
 border-bottom: 1px #c1c1c1 solid;
 }
 #people1{
 position: absolute;
 float: left;margin-top:2px;
 width: 24px; height: 24px;
 }
 .people2{
 position: absolute;
 margin-left: 34px;
 font-size: 20px;
 color: #c1c1c1;
 }
 #post1{
 position: absolute;
 float: left;margin-top:2px;margin-left:192px;
 width: 24px; height: 24px;
 }
 .post2{
 position: absolute;
 margin-left: 222px;
 font-size: 20px;
 color: #c1c1c1;
 }

 <div id="divAddress">
 <img id="img1" alt="address" src="<%=request.getContextPath()%>/images/address.png">
 <div class="address">地址 ： <span style="font-weight: 600;color: black;">输入上海市卢湾区卢湾榜路758弄10号1011室</span></div>
 </div>

 <div id="peoplePost1">
 <img id="people1" alt="people" src="<%=request.getContextPath()%>/images/people.png">
 <div class="people2">联系人 : <span style="font-weight: 600;color: black;">张三</span></div>
 <img id="post1" alt="post" src="<%=request.getContextPath()%>/images/post.png">
 <div class="post2">职位 : <span style="font-weight: 600;color: black;">业务经理</span></div>
 </div>

上面也就是相对和绝对结合的html代码，