欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

CSS清除浮动(float)的六种方法

程序员文章站 2022-04-14 17:38:36
...
html
    <p>
        <p class='box-left'></p>
        <p class='box-right'></p>
    </p>

css

    .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}

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

以上就是CSS清除浮动(float)的六种方法 的详细内容,更多请关注其它相关文章!

相关标签: 清除浮动