• 技术文章 >web前端 >css教程

    css父类清除浮动的原因详解

    黄舟黄舟2017-10-25 10:06:29原创808
    浮动因素在静态网页制作中经常被应用到,比如要让块级元素不独占一行,常常应用设置float的方式来实现。但是应用的时候会发现,设置了子类浮动后,未给父类清除浮动,这样就会造成一下问题:

            1.浮动的元素会相对于父容器或者是前面已经定位的元素进行浮动,浮动的元素脱离文档流,也就是不再占有原有的位置,会影响后面的元素或者是父容器

            2.父容器正常情况下会自动扩高,但是子元素加了浮动后位置不保留,父容器就感觉它不存在了,所以不会扩高。

    所以,在编写静态网页时,一定要注意浮动的清除问题,一段清除浮动代码可以方便调用:   

     .clearFloat:after{
                    content:' ';
                    display:block;
                    height:0;
                    visibility:hidden;
    }
              .clearFloat{
                    zoom:1;
    }

    以上就是css父类清除浮动的原因详解的详细内容,更多请关注php中文网其它相关文章!

    声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理
    专题推荐:css 样式表 详解
    上一篇:css实现侧栏动态显示隐藏的案例 下一篇:关于css的建议和性能优化总结
    大前端线上培训班

    相关文章推荐

    • CSS+JS实现爱心点赞按钮(代码示例)• 聊聊css为什么需要模块化?怎么进行模块化?• css调用方法是什么• css怎么去除表格边框• uniapp开发饿了么微信小程序首页sticky粘性定位布局

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网