欢迎加入前端技术营！如果你也是前端学习者或者对前端有学习的想法，那就跟着我一起从零开始进击前端。
致力于尽可能详细且简洁的介绍前端知识、自己的捷径，也是学习路上的记录。欢迎探讨

目录

一、什么是浮动、为什么需要浮动

二、怎么添加浮动

三、清除浮动带来的影响

一、什么是浮动、为什么需要浮动

说浮动之前先来说说常用的 页布局准则， 页布局第一准则：多个块级元素纵向排列找标准流，多个块级元素横向排列找浮动。

浮动：简而言之就是让盒子飘起来了
为什么需要浮动：完成标准流不能完成的布局

就这么简单

给第一个盒子添加浮动

效果如下：

我们想要两个小盒子在一行显示，就可以加浮动

效果如下：

清除浮动带来的影响：
语法：clear：left/right/both
使用方法：
1、给 父级 设置高度

2、额外标签法： 在浮动元素末尾添加一个空的标签，例如

3、父级添加overflow属性： 给父级添加overflow属性，属性值设置为hidden,auto或scroll

4、父级添加after伪元素

5、父级添加双伪元素： 给父级添加

本期到这里就结束了，感谢阅读！有问题留言，及时回复

• 下期：还没有想好HHHHHH
• 点赞加关注，持续更新实用技巧、热门资源、软件教程等
• 有任何 软件 影视 教程资源 考证资料等需求留言即可
• 回复20210803获得源码下载链接 （CSDN下载要积分或收费，所以放在下面了）