当我像下面的示例中那样浮动了一些简单元素时：http://jsfiddle.net/2zpqyLt0/
div {
width: 100px;
height: 100px;
}
.element1 {
background: rgb(211, 206, 61);
float: left;
}
.element2 {
background: rgb(85, 66, 54);
float: left;
}
.element3 {
background: rgb(247, 120, 37);
float: left;
}<div class="element1"></div>
<div class="element2"></div>
<div class="element3"></div>它们彼此相邻堆叠。据我了解，当您“浮动”一个元素时，它超出了文档的正常流程。在文档正常流程中（仍然）的元素不知道该元素存在，因此它们可以与之重叠。但是其他浮动元素呢？似乎他们彼此了解并且处于某种“浮动的状态”，否则，如果他们不了解，它们将全部重叠并最终出现在左边缘。对于“浮动类型的流”是否有一个术语，其中的浮动元素出于某种原因知道它们存在？
最佳答案
在文档正常流程中（仍然）的元素不知道该元素存在，因此它们可以与之重叠。但是其他浮动元素呢？
此行为在visual formatting model documentation中定义。
更具体地说，第9.5节和9.5.1节对此进行了讨论：
9 Visual formatting model - 9.5 Floats
浮点数是一个在当前行上向左或向右移动的框。浮动框（或“浮动框”或“浮动框”）最有趣的特征是内容可能沿其侧面流动（或由于“透明”属性而被禁止这样做）。内容从左浮动框的右侧向下流动，而从右浮动框的左侧向下流动。以下是浮动定位和内容流的介绍；精确的rules控制浮点行为在'float'属性的描述中给出。
浮动框向左或向右移动，直到其外边缘接触包含块的边缘或另一个浮动的外边缘。如果有一个线框，则浮动框的外部顶部与当前线框的顶部对齐。
由于没有浮子，因此在浮子盒之前和之后创建的未定位块盒将垂直流动，就好像该浮子不存在一样。但是，根据需要缩短在浮点数旁边创建的当前和后续行框，以便为浮点数的边距框腾出空间。
换句话说，即使文档流中没有浮动元素，浮动元素仍将位于其他浮动元素的外边缘。
请参阅section 9.5.1中控制浮点行为的确切规则。
关于html - 是否有“ float 流动”？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/34245467/