清除浮动的多种方法

Posted 2020-08-26

1：给父类添加浮动   /* 浮动元素太多时有局限性 */

2：给父类添加display：inline-block   /* 会把元素直接的空格间隙也会应用上去 */

3:在浮动元素后面添加一个空元素，并设置清除浮动 clear:both;

4:在浮动元素后面<br clear:"all"> /* 不符合W3C标准 */

5:浮动元素的父类添加   /* 推荐这种方法 */

.box-set:before,

.box-set:after {

  content: "";

  display: table;

}

.box-set:after {

  clear: both;

}

.box-set {

  *zoom: 1;

/* 兼容IE6*/

}

6：父类添加overflow  

/* IE6下无效必须添加 zoom：1 */

/* IE6下浮动元素父类有宽度的话就不用清除浮动*/

本文出自 “烟雨平生” 博客，请务必保留此出处http://1095221645.blog.51cto.com/6507311/1889975