为什么要清除浮动?

  1. 父盒子没有高度。
  2. 子盒子浮动了。
  3. 影响下面的布局,这时候我们就应该清除浮动了。

如何清除浮动?
推荐使用伪元素清除浮动,方法如下。

 <style>
    .clearfix:after {
        content: "";
        display: block;
        height: 0;
        clear: both;
        visibility: hidden;
    }
    
    .clearfix {
        /* IE6、7 专有 */
        *zoom: 1;
    }
</style>
<!-- 通过类名调用 -->
<div class="clearfix"></div>
如果觉得我的文章对你有用,请随意赞赏