浮动和清除浮动

只想躺平的小勺子

于 2022-03-06 17:23:47 发布

阅读量172

点赞数

分类专栏：前端文章标签： css css3 前端

本文链接：https://blog.youkuaiyun.com/m0_47354330/article/details/123313618

版权

前端专栏收录该内容

7 篇文章

订阅专栏

请将类为"left"的div元素和类为"right"的div元素在同一行上向左浮动，且清除类为"wrap"的父级div元素内部的浮动。

<html>
    <head>
        <meta charset=utf-8>
        <style type="text/css">
            .wrap {
                /*补全代码*/
                 height: 100px;
                clear: both;
            }
             .left {
                width: 100px;
                height: 100px;
                /*补全代码*/
                float: left;
            }
             .right {
                width: 100px;
                height: 100px;
                /*补全代码*/
                float: left;
            }
        </style>
    </head>
    <body>
        <div class='wrap'>
            <div class='left'></div>
            <div class='right'></div>
        </div>
    </body>
</html>

清除wrap的浮动可以设置器成为BFC

float不设置成none;
position设置成absolute或者fixed;
overflow不设置成visible;
display设置成inline-block