解决浮动造成的高度塌陷

最新推荐文章于 2025-05-20 10:04:41 发布

旧梦如烟

最新推荐文章于 2025-05-20 10:04:41 发布

阅读量471

点赞数

CC 4.0 BY-SA版权

分类专栏： JS网页特效

本文链接：https://blog.youkuaiyun.com/wang263334857/article/details/80215218

JS网页特效专栏收录该内容

4 篇文章

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>CSS练习</title>


    <style>

.parent{
    border: 10px solid yellow;
}
.w100{
    width:100px;
    height:100px;
}

        .one{
            background: red;
            float: left;

        }
        .tow{
            background: skyblue;

            float: right;

        }

        .clearfix::after{
            content:'';
            display: block;
            clear: both;

        }
    </style>
</head>
<body>
<div class="parent  clearfix">
<div class="w100 one"></div>
<div class="w100 tow"></div>
</div>

<div style="height:200px;background:black"></div>


</body>
</html>