在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問(wèn)答/HTML/ 父元素相對(duì)定位 高度auto,子元素position:absolute定位之后脫

父元素相對(duì)定位 高度auto,子元素position:absolute定位之后脫離文檔流,怎么使子元素?fù)伍_父元素

脫離文檔流的兩種方法:float 和 position:absolute/fixed

前提:父元素高度自動(dòng),需要子元素?fù)伍_父元素

當(dāng)子元素使用 float 時(shí),脫離文檔流,父元素高度塌陷,但是可以使用 zoom:1 + 偽元素 使其清除浮動(dòng),從而使得父元素高度被子元素?fù)伍_。

但是當(dāng)使用 position:absolute 時(shí),給父元素添加 position:relative 父元素高度塌陷,此時(shí)如何使得父元素的高度被子元素?fù)伍_?

回答
編輯回答
敢試

css 貌似無(wú)法直接實(shí)現(xiàn)這個(gè)需求??梢杂蒙蟡s來(lái)獲取子元素的高度然后再對(duì)父元素進(jìn)行修改。
html
<div class="a"><div class="b">sss</div></div>

css
.a{ width: 200px; position: relative; background-color: red;}
.b{position: absolute;height: 50px;}

js
var one = document.querySelector(".b").offsetHeight;
document.querySelector(".a").style.height = one+'px';

2017年7月22日 13:21
編輯回答
清夢(mèng)

css無(wú)法直接實(shí)現(xiàn)這個(gè)需求 本身absolute就是脫離文檔流的 然后非得再讓它包含在文檔流計(jì)算當(dāng)中 未免有點(diǎn)不太合適。還是結(jié)合具體場(chǎng)景換一下思路去解決吧

2017年4月16日 15:28
編輯回答
咕嚕嚕

如其他所答 基本css現(xiàn)在沒(méi)有什么解決方案 用jQuery或者js吧~如下代碼

    <script>
        (function(){
            $('.baba').css({ 
                'width':$('.erzi').css('width'),//獲取子元素的寬度
                'height':$('.erzi').css('height') //獲取子元素的高度
            });
        })()
    </script>
2018年5月24日 03:19
編輯回答
離魂曲

如果子元素是float浮動(dòng)的話倒是有辦法,float屬性只是浮動(dòng),沒(méi)有完全脫離標(biāo)準(zhǔn)文檔流(文檔流+文本流),脫離了文檔流,沒(méi)有脫離文本流(在其他博客看到的解釋),可以通過(guò)給父元素添加overflow屬性等方法解決。position的話是完全脫離了標(biāo)準(zhǔn)文檔流了,所以必然導(dǎo)致父元素的塌陷,所以應(yīng)該是沒(méi)有直接的css方法阻止。

2018年8月14日 08:55
編輯回答
舊時(shí)光

純粹的CSS無(wú)法實(shí)現(xiàn)。因?yàn)閜osition:absolute就是脫離文檔流,怎么能讓父元素不塌陷呢? 樓上的JS也許是個(gè)辦法。

2018年7月4日 09:12