清除浮动的方式有哪些？请说出各自的优点

Answer 1

高度塌陷是当所有子元素都进行浮动，而父元素未设定高度时，父元素会失去高度的问题。针对这个问题，有以下几种清除浮动的方式：

方式一：给父元素单独定义高度。此方法简单快速，代码量少，但不适用于响应式布局。

方式二：使用父级定义overflow：hidden，zoom：1（针对ie6的兼容处理）。优点是操作简单，代码量少，兼容性较好，但可能需要留意超出部分的隐藏问题。

方式三：在浮动元素之后添加一个空标签，然后给该空标签设置clear：both；height：0；overflow：hidden。此方法同样简单快速，代码量少，兼容性较高，但缺点在于增加空标签，可能不利于页面优化。

方式四：父级定义overflow：auto。此方法操作简单，代码量少，兼容性好，但在内部宽高超过父级div时，会出现滚动条。

方式五：采用万能清除法，即给塌陷的元素添加伪对象。此方法写法固定，兼容性高，但缺点是代码量相对较多。