CSS文档流

CSS文档流（document flow）和普通流（normal flow）实际上指的是同一个概念。

文档流指的是元素按照其在 HTML 中的位置顺序决定排布的过程，或者说在排布过程中将窗体自上而下分成一行行, 并在每行中按从左至右的顺序排放元素。

非浮动的块级元素独占一行，行内元素不会独占一行。float，position: absolute,position: fixed都会使元素脱离文档流。脱离文档流的元素不会占据空间。其他文档流的元素会占据其原来位置。表现在视觉上就是——重叠。

position: relative不会使元素脱离文档流。position: relative元素会基于原来的位置进行偏移。但是其他文档流中的元素不会占据其原来的空间。