这几天才开始好好学css，学到div的float浮动属性这儿就有点懵了，始终理解不到其含义，看了很多文章视频也半知半解。好在坚持，让我慢慢理解到了这个知识点，其中下面这篇文章对我帮助很大，
在了解浮动float这个概念之前，我们来看看块级元素、行内元素以及文档标准流的相关概念。
1.块级元素
块级元素（block），顾名思义就是一块块的（感觉像是废话），它的一个重要特性就是一个块级元素单独占一行。例如：
如图所示，每一个div都是独占一行，像这种元素还有<h1>~<h6> <p>...等标签。
2.行内元素
跟块级元素相对比，就很好理解了，行内元素可以多个元素在一行 ，如<span> <a>...等
3.文档标准流
便于理解，标准流可以理解成上面块级元素的排列方式，自上而下，像水流一样。
那么，现在问题来了，当你随便打开一个网页时，你会发现很多网页布局都超越了标准流，实现块级元素共享一行，要实现这种效果，就要使用大家都很常用的float浮动，那float是什么了，其实可以这样理解。浮动，为什么要称之为浮动呢，就是因为他是被置于标准流之上的一层，当你设置了float后，元素就不会被限制在标准流中，如下例：
通过上面两个例子，可以很好的理解浮动的含义了，不如将图二中son_1想象成父级div之上的一层，其中第二个例子为父级塌陷问题，后面再解释。
之前我们说道，要实现块级元素同行，需要用到float，这里我们可以想象成将div设置float属性后他就会漂浮起来，将div都漂浮起来，就可实现在同一行的效果：
结合之前的理解，这里的div_2相当于浮了起来，处于标准流之上，div_3向上移动就靠近div_1，所以图中div_3的一部分被div_2所遮住了。
如图6所示，div_2和div_3设置了float：left属性两者都浮动了了起来，此时div_4就移到div_1的后面，所以我们很容易得出结论，当块级元素都浮动起来的话，他们就可实现同行效果，同时同行的前后位置跟之前的排列顺序位置相同，块级元素在上的，浮动在前面，如：
注意：浮动的前后具体看是怎样浮动，如果是左浮动的话，顺序从左向右，其它类推。看到这里，想必浮动的知识差不多就明白了，下面我们看看如何清除浮动。
二、清除浮动
清除浮动我们常用到clear属性，其对应了both、inherit、left、right以及none，注意，清除浮动的对象是某个块级元素自身，如：
其中div_2中的clear：right表示div_2的右边不能有浮动元素，因此，块级元素全部下移。（此外，清除的浮动只对你定义过的浮动有效，如div_2中写clear:left就无作用）。
补充内容
其实实现块级元素同行还可以用display属性，我们都知道。块级元素如果不设置宽的话，默认的是100%，意思就是块级元素可以定义宽高，而行内元素却不行，他们的宽高是适应内容的。如：
当我们将元素的dispalay:inline-book时候，便可实现同行操作，同时行内元素可以设置宽高。
三、父级塌陷问题
前面提到过这个问题，当子级都浮动起来时，父级会出现塌陷问题，如下图：
如何解决这个问题呢？比较常用的主要由四种方式：
1.增加父级块元素宽高
这种方式不是很常用
2.新增加一个子级块级元素
3.父级增加overflow属性
overflow属性来解决子级内容超过父级而溢出的问题。
4.父级伪类
这种方式是目前最常用的。
