Web前端面试题--清除浮动

 

为什么要清除浮动？

        在使用浮动的时候，元素会脱离标准流，会对页面的造成影响，破坏页面的原始结构。那么这个时候就可以清除浮动让元素能能够正常显示。

 

清除浮动的几种方式：

           1、使用伪元素来清除浮动（推荐使用）

        /*
        使用伪元素来清除浮动(固定写法)
        */
        .clearfix:after {
            content:"";
            height: 0;
            line-height: 0;
            display: block;
            /*表示可见性设置为隐藏*/
            visibility:hidden;
            clear:both;
        }

        .clearfix {
            /*用来兼容ie浏览器，因为ie版本的不同，有些浏览器可能并不兼容.clearfix:after{} 中的属性。为了使ie浏览器也可以正常显示需要加此属性*/
            zoom: 1;
        }

           2、使用额外标签法（不推荐）

                       在需要清除浮动的地方加入一个额外的标签，然后使用clear:both 来清除