清除浮动的方式有哪些?请说出各自的优点
发布网友
共1个回答
热心网友
高度塌陷是当所有子元素都进行浮动，而父元素未设定高度时，父元素会失去高度的问题。针对这个问题，有以下几种清除浮动的方式：
方式一：给父元素单独定义高度。此方法简单快速，代码量少，但不适用于响应式布局。
方式二：使用父级定义overflow：hidden，zoom：1（针对ie6的兼容处理）。优点是操作简单，代码量少，兼容性较好，但可能需要留意超出部分的隐藏问题。
方式三：在浮动元素之后添加一个空标签，然后给该空标签设置clear：both；height：0；overflow：hidden。此方法同样简单快速，代码量少，兼容性较高，但缺点在于增加空标签，可能不利于页面优化。
方式四：父级定义overflow：auto。此方法操作简单，代码量少，兼容性好，但在内部宽高超过父级div时，会出现滚动条。
方式五：采用万能清除法，即给塌陷的元素添加伪对象。此方法写法固定，兼容性高，但缺点是代码量相对较多。
