1.让多个盒子水平排列成一行，使浮动成为布局的重要手段。
2.可以实现盒子的左右对齐等。
3.浮动最早用于控制图片，实现文字环绕图片的效果。
float属性值
none：默认值元素不浮动
left：元素向左浮动
right：元素向右浮动
1.2 浮动的盒子
1.把自己的原来的位置漏给下面的标准流的盒子，就是不占有原来的位置，脱离标准流
2.浮动的元素会生成一个块级框，而不论它本身是何种元素，生成的块级框和我们前面的行内块级极其相似
注意：
1.浮动的元素互相贴靠在一起，如果父级宽度装不下这些浮动的盒子，多出的盒子会另起一行对齐
2.浮动元素会改变display属性，类似转换为行内块，但是元素之间没有空白缝隙
1.3 浮动元素与父盒子的关系
1.子盒子的浮动参照父盒子对齐
2.不会与父盒子的边框重叠，也不会超过父盒子的内边距
1.4 浮动元素与兄弟盒子的关系
在一个父级盒子中，如果前一个兄弟盒子是
-
浮动的，那么当前盒子会与前一个盒子的顶部对齐；
-
普通流的，那么当前盒子会显示在前一个兄弟盒子的下方。
注意：
浮动只会影响当前的或者后面的标准流盒子，不会影响前边的标准流
建议：如果一个盒子里面有多个子盒子，如果其中一个盒子浮动了，其他兄弟也应该浮动。
**原因：**由于父级盒子很多情况下，不方便给高度，但是子盒子浮动就不占位置，最后父级盒子高度为0，就影响下面的标准流盒子
本质：
清除浮动主要是为了解决父级元素由于子级浮动引起的内部高度为0的问题，清除浮动之后，父级就会根据浮动的子盒子自动检测高度，父级有了高度就不会影响下面的标准流了
注意：
由于浮动元素不在占用原文档流的位置，所以他会对后面元素排版产生影响，清除浮动后造成的影响
2.1 四种清除浮动的方法
2.11 （01）额外标签法
W3C的做法是通过在浮动元素后面添加一个空白标签<div style="clear:both"><div/>
-
优点： 通俗易懂，书写方便
-
缺点： 添加许多无意义的标签，结构化较差。
2.12 （02）父级添加overflow属性的方法
可以给父级添加：overflow为hidden|auto|scroll 都可以
优点： 代码简洁
缺点： 内容增多时候容易造成不会自动换行导致内容被隐藏掉，无法显示需要溢出的元素。
2.13 （03） 使用after伪元素清除浮动
总结
-
框架原理真的深入某一部分具体的代码和实现方式时，要多注意到细节，不要只能写出一个框架。
-
算法方面很薄弱的，最好多刷一刷，不然影响你的工资和成功率😯
-
在投递简历之前，最好通过各种渠道找到公司内部的人，先提前了解业务，也可以帮助后期优秀 offer 的决策。
-
要勇于说不，对于某些 offer 待遇不满意、业务不喜欢，应该相信自己，不要因为当下没有更好的 offer 而投降，一份工作短则一年长则 N 年，为了幸福生活要慎重选择！！！
喜欢这篇文章文章的小伙伴们点赞+转发支持，你们的支持是我最大的动力！ 开源分享：docs.qq.com/doc/DSmRnRG…
