美文网首页
css之清除浮动

css之清除浮动

作者: 沐雨芝录 | 来源:发表于2019-03-14 17:00 被阅读0次

1、给下一个元素加clear:both;
缺点:导致下一个元素,margin失效。

2、给空元素加clear:both;
缺点:增加无意义标签,后期维护不利。

3、给父级加高度;
缺点:只能用在固定高度的情况下,动态的用不了。

4、父级div定义overflow:hidden;
缺点:用position:absolute,超过父级就被隐藏了。

5、父级div定义伪类:after和zoom;
代码多,但是最好用,推荐。

    .clearfix:after {
          content: "";
          display: block;
          height: 0;
          clear: both;
          visibility: hidden;
      }
      /* 为兼容IE6,IE7,因为ie6,ie7不能用after伪类 */
      .clearfix{            
          zoom:1;
      }

相关文章

  • CSS浮动续

    CSS清除浮动案例 CSS版心居中显示案例 清除浮动的四种用法: 1. 使用空标记清除浮动,隔墙法,增加标签 2....

  • CSS clear both清除浮动

    原文地址:CSS clear both清除浮动 DIV+CSS clear both清除产生浮动我们知道有时使用了...

  • 清除浮动

    一、清除浮动 or 闭合浮动 ? 清除浮动:清除对应的单词是 clear,对应CSS中的属性是 clear:lef...

  • css之浮动清除

    浮动的清除 浮动的性质: 脱标 贴边 字围 收缩 给浮动的元素的祖先元素加高度(不常用)如果一个元素要浮动,那么它...

  • CSS之清除浮动

    三个浮动的元素 当外层DIV.outer 没有设置高度,如果它里面的元素不浮动的话,那么这个外层的高是会自动被撑开...

  • css之清除浮动

    1、给下一个元素加clear:both;缺点:导致下一个元素,margin失效。 2、给空元素加clear:bot...

  • 一篇文章带你了解CSS clear both清除浮动

    一、前言 CSS clear both清除产生浮动 ,使用了css float浮动会产生css浮动,这个时候就需要...

  • 浮动和清除(闭合)浮动

    CSS之float and clear float 浮动和清除(闭合)浮动 目录 1.背景介绍 2.知识剖析 3....

  • CSS 中的浮动

    浮动的定义: 元素脱离文档流 举栗子: 修改 CSS 代码,清除浮动: 浮动的影响: 父元素高度塌陷 清除浮动: ...

  • CSS浮动.清除浮动

    给父级元素设置高度 在底部添加一个空元素,清除浮动 父级div定义 overflow:hidden或者auto 为...

网友评论

      本文标题:css之清除浮动

      本文链接:https://www.haomeiwen.com/subject/wnjcmqtx.html