浮动

浮动的作用就是为了脱离文档流，不再占据原来的位置。元素无法感知到浮动元素的存在；但是，浮动的元素之间是可以互相感知的。
浮动对于文字的影响和对于普通块级元素的影响不同。

• 两个浮动元素之间，会紧挨着；并且浮动后，块级元素不再占据一行，只再占据自身的宽度。

1
2

另外，需要注意的是，渲染顺序还是按照 html 文本顺序，从上至下。即

1
2
3

• 浮动元素和文字之间。文字会包围浮动元素，但是浮动元素会遮挡背景。

2
123456789123456789123456789123456789123456789123456789123456789123456789123456789123456789123456789123456789123456789123456789123456789123456789123456789123456789123456789123456789123456789123456789123456789123456789123456789123456789