如何清除浮动?

213 阅读1分钟

浮动元素不占用源文档流的位置,所以子元素设置浮动后会对后面或者父级元素的排版产生影响,父级元素因为子元素浮动而高度变为0,为解决这个问题,需要在元素中清除浮动,解决浮动元素造成的影响

  1. 给父元素加上.clearfix
/* 利用after和zoom添加一个空div */

/* 利用clear:both让父div自动获取高度 */

.clearfix:after{
    content:'';
    dispaly:block; /* 或者table */
    clear:both;
}
.clearfix{
    zoom:1; /* IE兼容 */
}
  1. 给父元素加上overflow:hidden