浮动元素特性:
为文字环绕效果而生、仅影响其后元素、能感知其后同胞兄弟、脱离文档流、具有行内块特性。
应用:
流式布局、自适应宽度、清除多余空隙。
(对于很多插件而言,浮动是个好特性)
缺点:脱离文档流,使其父元素高度塌陷
影响到其后元素布局及其包裹层高度。
(可能出现的结果是布局乱、元素高度获取不准确和重叠现象)
清除浮动:
1.浮层加宽度和overflow属性
(缺点是限制了子层元素的扩展,即你不处理人家是默认的 visible ,你这么一弄变 hidden 了,但是用起来真的很爽。。)
200px;
overflow:hidden;
2.父层加伪类处理
(用一个对大局无影响的点处理受浮动影响的部分)
.wrap{
zoom:1
}
.wrap:after{
clear:both;
display:block;
content:"";
visibility:hidden;
height:0
}
3.浮动元素其后加 br 标签 或者文档内位于浮动元素之后的标签,加样式:
clear:both;(left/right)