特性：
float的设计初衷仅仅是文字环绕效果
浮动具有破坏性,会使父容器高度塌陷
清除浮动方法: 1.脚底插入cleart:both 2.父元素BFC(IE8+)/haslayout(IE6/7)
两者差异: 1.与外部链接,会发生margin重叠 2.封闭式,不会外部发生冲突
两者不足: 1.多余空标签 2.兼容性无法一方通行
权衡后的策略: .clearfix需作用在父元素上
; overflow: hidden;}
; };
优化: .clearfix::after{ content: ''; display: table; clear: both;}
注意项
容错性糟糕,容易出问题
需要元素固定尺寸,无重用性
在IE低版本下,会引发很多问题
兼容性问题
IE6: 浮动有双倍边距,跟随浮动元素3px,后面文字会下沉
IE7: 浮动元素与文本不在同一行,最后一个字符重叠....