1 额外标签法
在浮动元素后添加一个空的div,并设置属性clear:both;
弊端:添加了空的div,没有意义。
2 父元素添加overflow的方法
为浮动的父元素,示例中 ul 标签设置属性 overflow:hidden;
弊端:在父级元素内存在定位时,超出父级元素范围的定位元素会被隐藏。
3 利用伪对象after方法
为浮动的父元素利用伪对象 after 来在末尾设置一个隐藏的元素,并添加 clear:both; 属性。
.clearFix:after{ clear:both; display:block; visibility:hidden; height:0; line-height:0; content:"";}
此方法就其根本类似于方法1,直接在末尾添加一个空的div,但是实现方式变成了伪对象 after 而已。
目前较为普遍清除浮动的设置方式。