首頁猿問求大佬指點(diǎn)哈！為什么絕對(duì)定位的元素...

求大佬指點(diǎn)哈！為什么絕對(duì)定位的元素脫離了文檔流，還能撐出滾動(dòng)條萬分感謝

JavaScript

收到一只叮咚 2019-07-27 00:31:49

Test.abs-par{position:absolute;width:100%;left:0;top:0;}.abs-son{position:absolute;right:0;top:0;width:200px;height:1000px;border:3pxsolidgold;}父元素顯示的高度已經(jīng)是零了，為什么還能撐出滾動(dòng)條。問題一：可以實(shí)現(xiàn)父元素高度被子元素?fù)伍_嗎？問題二：瀏覽器這種被絕對(duì)定位的元素?fù)纬霈F(xiàn)滾動(dòng)條的效果怎么實(shí)現(xiàn)的？

查看完整描述

2 回答

UYOU

TA貢獻(xiàn)1878條經(jīng)驗(yàn) 獲得超4個(gè)贊

滾動(dòng)一般來說可以表示為窗口滾動(dòng)window，全局文檔滾動(dòng)documentElement，局部元素滾動(dòng)Element。你雖然脫離了文檔流，但是你還在窗口內(nèi)啊，還是會(huì)引起滾動(dòng)。還有，個(gè)人覺得文檔流是解釋盒子模型元素布局排列的，跟滾動(dòng)其實(shí)沒有強(qiáng)關(guān)聯(lián)關(guān)系。

反對(duì) 回復(fù) 2019-07-27

Smart貓小萌

TA貢獻(xiàn)1911條經(jīng)驗(yàn) 獲得超7個(gè)贊

雖然概念上講脫離文檔流脫離文檔流，但實(shí)際上，并不是說他就不在瀏覽器里了，他在，只是位置嘛，看你怎么寫。簡(jiǎn)單來說，可以理解成用一個(gè)全景模式拍清明上河圖，absolute元素相當(dāng)于在畫上貼貼紙。你用一個(gè)375x812的屏幕去看一個(gè)實(shí)際長(zhǎng)度6000x812的圖，可不得拉鏡頭嘛。現(xiàn)在你說，哎呀我想在橋那里再貼個(gè)電視機(jī)，電視機(jī)的右上角再貼個(gè)超大的鄧倫瀏覽器說，行，你要貼多大的貼紙？你說，電視機(jī)高么100%，寬嘛，隨便啦，鄧倫要貼個(gè)大的，1000x200好啦。瀏覽器心想，咿呀嘿那我咋知道你要多大的電視機(jī)啊，算了，做個(gè)標(biāo)記吧。然后瀏覽器順手把鄧倫貼在了標(biāo)記的右上角。這時(shí)候你還是在拍，拍到鄧倫貼紙了，但是你取景框就只有375啊，所以你看不全鄧倫，只能再往右邊拉才能把鄧倫看全

反對(duì) 回復(fù) 2019-07-27