本篇文章主要介绍了"CSS学习笔记——CSS中定位的浮动float"，主要涉及到方面的内容，对于HTMLjrs看球网直播吧_低调看直播体育app软件下载_低调看体育直播感兴趣的同学可以参考一下：
昨天在解决了盒模型的问题之后又出现了新的知识模糊点：浮动和绝对定位？今天先解决浮动相关的问题，首先列举出想要解决的问题：1.浮动到底是怎么样的？2.浮动对元素的...
昨天在解决了盒模型的问题之后又出现了新的知识模糊点：浮动和绝对定位？今天先解决浮动相关的问题，首先列举出想要解决的问题：
1.浮动到底是怎么样的？
2.浮动对元素的影响有什么？
3.浮动主要用来干什么？
第一个问题：浮动到底是怎么样的？
W3CSCHOOL对浮动属性的解释：浮动的框可以向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。所以浮动也有left、right、none三种。
我个人的理解是：HTML
文件就像是一个方形的水槽，它在浏览器中加载的过程就好比是向水槽中放水，而这些水就代表的是页面中的各个元素，他们都是有顺序的进入水槽（文档流的顺序
和我们写字一样，从上到下从左到右）。当出现了一个具有浮动属性（float）的元素时，就好像是水流中多了一块泡沫，它会浮在水面上（也就是说明元素脱
离了文档流）。在水流停止后（页面加载完毕），这个元素会停靠在水槽的边缘或者停靠在别的泡沫边缘（浮动元素会处于包含框的边缘或者另一个浮动元素的边
缘）。
对于浮动元素是否脱离了文档流，这个我刚开始也很迷糊，因为在看教学视频的时候一个老师说没有，另一个老师说有。于是就自己敲了代码做了点实验：
Title
div1div1d
1234567890
1234567890
上面代码的效果如下：
红色背景的Div是设置了左浮动的元素，根据浮动的定义它应该是脱离文档流的，具体表现如下图：
当我们审查第二个p标签时发现这个标签其实是覆盖了DIV块的，还是独自占据一行，并不是从DIV块的边缘开始的。这就说明：
设置的浮动的元素其实是脱离的文档流的，但是这个元素的内容还是会在视觉上占据空间，不会覆盖其他元素或者被其他元素覆盖。
2.浮动的元素对其他元素的影响有什么？
浮动元素对其他元素的影响就如同上面的例子显示的，浮动的元素会根据自己内容的大小把他之后的元素的内容挤到后面（特别注意，这里说的是内容！是内容！是内容！）。
这里特别说明一下：有些视频教学里说浮动的影响只会作用在紧邻在它后面的元素，这个说法还是有问题的，我上面举得那个例子就说明了红色的DIV块浮动影响的是它后面的两个p元素，而浮动的元素到底会影响多大范围是根据浮动的元素它的内容的大小决定的。
清除浮动带来的影响主要是通过两种方式：
第一种：给不想受到影响的元素增加属性clear：both/right/left. 这个属性的意思并不是清除什么，而是应该理解为拥有这个属性的元素左边或者右边不允许存在浮动元素的内容。
