1、浮动的缺陷
影响它的兄弟元素的位置和父元素产生高度塌陷（父元素不被撑开）。
（1）影响它的兄弟元素的位置
未设置float
给box1设置float后,box2的位置发生了变化。
（2）父元素产生高度塌陷
给子元素box1设置了float,父元素container高度不被撑开（视觉上高度产生了塌陷）。
2、浮动的清除方法
（1）使用 :after伪元素（常用）
修改：height：0px;visibility:hidden;省略即可
（2）在浮动元素后加空div
（3）父元素设置overflow：hidden
只是 overflow 并不是为了闭合浮动而设计的，因此当元素内包含会超出父元素边界的子元素时，可能会覆盖掉有用的子元素，或是产生了多余的滚动条。这也是在 overflow 方法诞生后依然需要寻找更佳方法的原因。
（4）......
3、清除浮动各种方法的实质
（1）利用 clear 属性，包括在浮动元素末尾添加一个带有 clear: both 属性的空 div 来闭合元素，其实利用 :after 伪元素的方法也是在元素末尾添加一个内容为一个点并带有 clear: both 属性的元素实现的。
（2）触发浮动元素父元素的 BFC (Block Formatting Contexts, 块级格式化上下文)，使到该父元素可以包含浮动元素
网友评论