流浪のwolf

卷帝

导航

30. 清除浮动的方法

清除浮动是为了解决父元素因为子元素设置了浮动导致的高度塌陷问题:

此时父元素的高度没有被撑开 ;

 

父元素的高度已经被撑开 ;

 

 

 1. 添加额外标签设置clearfix类为clear:both;

2. 父元素添加overflow:hidden

3. 使用before和after双伪元素清除浮动

4. 设置父元素为浮动元素

5. 设置position:absolute

 

清除浮动的说法是不准确的。应该是为清除浮动的影响。

 

延申问题:OVERFLOW:HIDDEN怎么清除浮动的 ;

overflow:hidden 会形成一个 BFC 块级格式化上下文 ,BFC 会把浮动元素的高度计算在内 ;BFC的内部元素不受外部元素的影响 ;

 

延申问题:清除浮动最常用的方法是哪个

使用额外添加类 clearfix { clear:both }  ;代码简洁,易懂 ;

posted on 2022-11-13 16:29  流浪のwolf  阅读(39)  评论(0编辑  收藏  举报