清除浮动的方法

清除浮动的方法

1.伪元素清除法（推荐）

after伪元素清除法

.clearfix::after {
            content: "";
            display: block;
            height: 0;
            clear: both;
            visibility: hidden;
        }
        
        .clearfix {
            zoom: 1;
        }

双伪元素清除法

.clearfix::before,
        .clearfix::after {
            content: "";
            display: table;
        }
        
        .clearfix::after {
            clear: both;
        }
        
        .clearfix {
            zoom: 1;
        }

2.额外标签法  

.clear {
            clear: both;
        }
<div class="clear"></div>

3.给父级添加overflow：hidden；（不推荐）

4.给父级添加overflow：auto；（不推荐）

5.给父级添加高度（不推荐）

6.给父级定义为表格display：table；（不推荐）