清除浮动的几种方法详解

  发布时间:2017-01-09 15:15:11   作者:小码农雯   我要评论
本文主要介绍了清除浮动的几种方法。具有一定的参考价值,下面跟着小编一起来看下吧

GPT4.0+Midjourney绘画+国内大模型 会员永久免费使用!
如果你想靠AI翻身,你先需要一个靠谱的工具!

html

1
2
3
4
<div>
    <div class='box-left'></div>
    <div class='box-right'></div>
</div>

css

1
2
3
4
5
6
7
.box-left,.box-right{
        width:200px;
        height:200px;
        float: left;
        background: red;
        border:1px solid #333;
    }

第一种方法:.box{clear:box}

第二种方法:.box{overflow:hidden}

第三种方法:.box{overflow:auto}

第四种方法:.box:after{ content:""; height:0; visibility:hidden; display:block; clear:both;}.box{ zoom:1;}

第五种方法:.box{height:200px}设置高度

第六种方法:.box{display:table}

还有什么方法欢迎补充,加油,共同进步

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持脚本之家!

蓄力AI

相关文章

  • 概述页面中浮动与清除浮动

    本文主要对页面中浮动与清除浮动进行了概述,并举例说明,具有一定的参考价值,下面跟着小编一起来看下吧
    2016-12-25
  • 详解CSS中zoom属性或overflow:auto属性清除浮动的作用

    这篇文章主要为大家介绍了CSS中zoom属性或overflow:auto属性清除浮动的作用,文中通过实例代码介绍的很详细,相信会对大家的理解和学习具有一定的参考借鉴价值,有需要的朋
    2016-11-26
  • 关于清除浮动塌陷的几种方法总结

    在大家在使用css的过程中,多多少少会遇到清除浮动这个问题。所以这篇文章给大家总结了div+css中关于清除浮动塌陷的4种方法,相信会对大家学习或者使用div+css能有所帮助,
    2016-10-17
  • 清除浮动的几种方法(推荐)

    下面小编就为大家带来一篇清除浮动的几种方法(推荐)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-07-12
  • CSS的clear属性清除浮动的基本用法示例

    清除浮动就是指解决浮动元素溢出容器的操作,其方法多种多样,这里我们来看最基本的一种:CSS的clear属性清除浮动的基本用法示例
    2016-07-07
  • 清除浮动(float)的影响介绍

    下面小编就为大家带来一篇清除浮动(float)的影响介绍。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-06-07
  • 浅谈css清除浮动(clearfix和clear)的用法

    下面小编就为大家带来一篇浅谈css清除浮动(clearfix 和clear)的用法,小编觉得挺不错的,现在就分享给大家,也给大家做个参考,一起跟随小编过来看看吧
    2023-05-12
  • 浅谈CSS中的clear清除浮动

    下面小编就为大家带来一篇浅谈CSS中的clear清除浮动。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-06-06
  • CSS清除浮动的方法详解

    这篇文章主要介绍了CSS清除浮动的方法详解,值得注意的是并不是每次单纯把浮动清除掉就可以解决相关问题,文中最后谈到的闭合浮动的方案也非常值得一试,需要的朋友可以参考下
    2016-05-30
  • CSS浮动所产生的内容溢出问题及清除浮动的方法小结

    CSS的float浮动效果在一些情况下非常不稳定,控制不好的时候一般还是清除浮动为妙,这里我们就来看一下CSS浮动所差生的内容溢出问题及清除浮动的方法小结
    2016-05-30

最新评论