css中流的概念介绍

文档流是浏览器按HTML顺序排列元素的默认布局方式，块级元素从上到下、行内元素从左到右排列；float、absolute、fixed等属性会使元素脱离文档流，影响布局结构；理解流有助于掌握定位与现代布局机制。

在CSS中，“流”（Flow）指的是页面元素在文档中默认的排列方式，也就是浏览器按照HTML结构顺序对元素进行布局的过程。理解“流”有助于掌握网页排版的基本逻辑，尤其是在处理定位、浮动和弹性布局时。

什么是文档流

文档流是浏览器渲染HTML元素时遵循的正常顺序。块级元素从上到下依次排列，行内元素从左到右在一行内排列，直到空间不足才换行。这种自然的排列方式就是“处于文档流中”。

大多数元素默认都处在文档流中，它们的位置由其在HTML中的顺序和盒模型属性（如margin、padding、width等）决定。

脱离文档流的情况

有些CSS属性会让元素脱离正常的文档流，从而影响其他元素的布局位置：

标签： css 流 html 浏览器 弹性布局 排列 html元素 css属性 绝对定位 清除浮动 固定定位 为什么