                        課程
                    
                        /前端開(kāi)發(fā)
                        
                            /HTML/CSS
                        
                        /初識(shí)HTML(5)+CSS(3)-升級(jí)版

relative與absolute

還是不明白為什么父元素加relative,子元素加absolute會(huì)變成圖一；而父元素加absolute，子元素加relative會(huì)變成圖二？

weixin_慕虎8024491

2019-11-30

源自：初識(shí)HTML(5)+CSS(3)-升級(jí)版 13-9

關(guān)注問(wèn)題我要回答

925

操作

收起

2 回答

Fidd 回答被采納 +2 積分
2019-12-01

1.默認(rèn)情況由于div元素是塊級(jí)元素，另起一行，因此div子元素出現(xiàn)在圖片下方，如第二幅圖所示；

2.第一種情況是給子元素設(shè)置absolute，改變了默認(rèn)的流模型，更改了子元素相對(duì)于父元素的位置，使子元素底部相距父元素為0，表現(xiàn)為第一幅圖情況；

3.給子元素設(shè)置relative，那么子元素只是相對(duì)于自己原來(lái)的位置移動(dòng)，然后設(shè)置距離自己原來(lái)的位置底部為0，相當(dāng)于沒(méi)有改變位置，所以和第一種默認(rèn)情況沒(méi)什么兩樣。

1 回復(fù) 有任何疑惑可以回復(fù)我~

收起回答

#1

weixin_慕虎8024491 提問(wèn)者

非常感謝！

2019-12-01 回復(fù) 有任何疑惑可以回復(fù)我~

慕的地8138683
2020-02-11

求問(wèn)那為什么要涉及父元素，relative與absolute組合使用，直接子元素absolute不可以嗎

0 回復(fù) 有任何疑惑可以回復(fù)我~

收起回答

#1

xinghuo72

同樣初學(xué)，我說(shuō)下我的想法，當(dāng)默認(rèn)flow流模型時(shí)，父元素與子元素?zé)o法重疊，只有父元素與子元素同時(shí)設(shè)置為layer層模型時(shí)才能實(shí)現(xiàn)嵌套，absolute是本元素相對(duì)父元素的設(shè)置，對(duì)子元素使用，relative是本元素相對(duì)本元素在flow流模型下位置的設(shè)定，對(duì)父元素使用后只改變模型類(lèi)別，不設(shè)置參數(shù)不影響父元素位置。不知道對(duì)不對(duì)，希望能幫助到你。

2020-02-16 回復(fù) 有任何疑惑可以回復(fù)我~