clear:both用来
清除浮动这是一直来的印象，但是自己很少会用这个，理解其实也不太正确，今天查查了资料，记录一下float的脱离文档流
float的原始作用是为了实现文字环绕的作用，可以理解为部分脱离文档流。
CSS中说脱离文档流是指盒子从普通的布局排版中拿出来，其他盒子进行放置时，会当其不存在而进行布局。而脱离文档流分为两种
完全脱离文档流：例如
position:absolute，使用绝对定位的盒子，其他盒子无论是其本身还是里面的任何元素都会无视这个绝对定位的盒子进行布局。部分脱离文档流：即
float盒子，使用
float属性后，其他block盒子会无视
float盒子进行布局，但是其他盒子内的inline元素和inline-block元素依旧会为这个浮动的盒子让出位置。clear:both
是作用于添加属性的盒子本身的clear:both在一个盒子上添加
意味着这个盒子的顶边框将会clear:both在它低于的任何浮动盒子的之前。底外边距
所以
clear:both并不是清除浮动，而是清除浮动所造成的影响，浮动的盒子依旧是部分脱离文档流的。而clear的取值是left还是right,在我看来是取决于
想要低于的那个浮动盒子的浮动方向。而
both的取值，则会低于所有在在它之前的任何浮动盒子清除影响的例子
我们设置三个盒子A、B、C
当三个盒子都左浮动是时：
C设置不浮动时：
给B添加clear:both/clear:left：
可以看到，B本身造成的浮动影响被清除了，他的顶边框在
任何在他之前的浮动盒子的底部之下,但是没有浮动的盒子C仍然在AB的下边，其中的字体为浮动的盒子让出了位置。给父盒子添加伪元素::after
现在，我们用一个
div（class:box）包裹住ABC三个盒子，在
