- 浮动的实现
- 浮动的副作用
# 1. 针对父元素：
注意：如果一个元素里只有浮动元素，那它的高度会是0.如果你想要的它自适应即包含所有浮动元素，那你需要清除它的子元素。
一种方法叫做clearfix，即clear一个不浮动的::after伪元素。（问题是：简言之父元素有浮动的子元素，父元素的高度没设置，那么父元素的高度就为0）
方法一：
#container::after{
content: '';
display: block;
clear: both;
}
方法二：
#container::after{
overflow: hidden;(可以撑开父元素的高度，但如果父元素没有设置宽度，那么父元素就会独占一行，因此须设置父元素宽度)
}
# 2. 针对同级元素
clear 属性清除浮动的元素对下个兄弟元素定位的影响(打破元素的横向排列)。
clear: left;表示应用该属性该元素左侧不允许有元素。
clear: right;表示应用该属性的元素右侧不允许有元素。
- 清除浮动
# 一：css为什么要清除浮动
1.很多情况下，如果我们使用了float特效，出现margin，padding设置不能正确显示，浮动会导致父级子级之间设置了padding，导致了属性不能正常传达，导致margin不能正常显示，所以我们要清除浮动。
2.导致背景不能显示，如果对父级设置了背景属性，导致父级不能撑开，会影响到背景图片不能正常打开。
3.边框不能撑开，由于子级使用了浮动效果，并且已经产生了浮动，父级不能撑开，所以影响边框不会随着内容的变化而变化。
# 二：浮动如何清除？清除浮动流程
1.首先对父级进行设置css高度进行清除，一般情况下，我们对高度设置一个高度，把内容高度设置成100px，上下框为2px，这样一来，父级的总体高度就是102px。我们使用高度样式，但是前提我们要计算好内容的高度。
2.利用clear:both属性，进行清除浮动，我们可以在div中放入一个class="clear样式，就可以清除浮动。
3.对父级div进行定义属性，我们对父级css选择器定义一个overflow:hidden样式，就可以清除父级产生的浮动。