(1)设置overflow
overflow:auto 或 overflow:hidden(移除隐藏) 或 overflow:scroll
(只有overflow:visible(默认值)不可以),只要产生BFC都可以做到清除浮动的效果。
(2)推荐方法
.parent { *zoom:1; //触发旧版IE重新布局 }
.parent::after{
content:".";
display:block; //after添加的元素是行内元素
clear:both; .//清除浮动,只对块元素生效
font-size:0;
height:0;
line-height:0;
visibility:hidden;
}
浮动 float 诞生之初,是被用来做图文混排的,任何元素都可以浮动。在没有设置宽高的情况下,浮动由内容撑开大小。
注意:
普通流元素对后面的兄弟浮动元素有限制
浮动元素不占据父元素的高度,使元素脱离标准流
文字和图片会产生坏绕效果,不会被遮蔽
clear:both
使该元素前的浮动效果不对后面的元素产生影响
clear:left
使该元素前的左浮动不对后面的元素产生影响
clear:right
使该元素前的左浮动不对后面的元素产生影响