html是整個文檔空間，body是html中的文檔空間， body與html相差9cm左右

postion中的相對定位：relative

postion中的絕對定位：absoute

相對定位：

當(dāng)沒有參照物的時候，相對定位是相對與body定位的

絕對定位：

當(dāng)沒有參照物額時候，絕對定位是相對與html定位的

使用margin的時候，是占用文檔空間的，一般用在相對定位使用

使用top，left，right，button的時候，是不占用文檔空間的，看情況使用

我們一般是在相對里面套用絕對來進(jìn)行項目的開發(fā)

               #divAddress{                    position: relative;                    margin-top: 48px;//這就是剛才提的當(dāng)使用margin的時候才能進(jìn)行下面的相對                    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;">輸入上海市盧灣區(qū)盧灣榜路758弄10號1011室</span></div>                </div>               <div id="peoplePost1">                    <img id="people1" alt="people" src="<%=request.getContextPath()%>/images/people.png">                    <div class="people2">聯(lián)系人 : <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;">業(yè)務(wù)經(jīng)理</span></div>                </div>

上面也就是相對和絕對結(jié)合的html代碼，以上就是本文的所有內(nèi)容了，希望可以給大家?guī)韼椭?/p>

相關(guān)推薦：

html的絕對路徑和相對路徑怎么使用

相對定位或絕對定位的適用條件

css絕對定位實現(xiàn)居中的八種方式代碼詳解

以上就是html中相對定位與絕對定位的詳細(xì)內(nèi)容，更多請關(guān)注 其它相關(guān)文章！

鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請第一時間聯(lián)系我們修改或刪除，多謝。