常见定位方案(三种文档流)

文档流与网页之间的关系,其实就是将一维节点映射到二维空间的关系。

定位方案(文档流)是控制元素的布局,有三种常见方案:

1.普通流 (normal flow)

在普通流中,元素按照其在 HTML 中的先后位置至上而下布局,在这个过程中,行内元素水平排列,直到当行被占满然后换行,块级元素则会被渲染为完整的一个新行,除非另外指定,否则所有元素默认都是普通流定位,也可以说,普通流中元素的位置由该元素在 HTML 文档中的位置决定。

普通流其实就是指BFC中的FC

2.浮动流 (float)

在浮动布局中,元素首先按照普通流的位置出现,然后根据浮动的方向尽可能的向左边或右边偏移,其效果与印刷排版中的文本环绕相似。

3.定位流(绝对定位) (absolute positioning)

在绝对定位布局中,元素会整体脱离普通流,因此绝对定位元素不会对其兄弟元素造成影响,而元素具体的位置由绝对定位的坐标决定

你可能感兴趣的:(CSS)