HTML5文档流是什么概念？

本文共计2157个文字，预计阅读时间需要9分钟。

在HTML5中，文档流又称为普通流，指的是元素按照从左到右、从上到下的顺序排列。在元素排版布局过程中，元素会默认从左往右、从上往下流动；并且在每一行中，元素会按照从左至右的顺序排列。

html5中，文档流又称“普通流”，指的是元素排版布局过程中，元素会默认自动从左往右，从上往下的流式排列方式；并且最终窗体自上而下分成一行行，并在每行中从左至右的顺序排放元素。脱离文档流的方法：1、float浮动；2、position定位。

本教程操作环境：windows7系统、HTML5版、DELL G3电脑

一、什么是文档流？

“流”，我们在生活中经常听到这个词，比如水流，电流。就像水流从高处往低处流一样，我们可以把文档流想象成html元素在浏览器上“流动”。浏览器的顶端就是河流的源头，浏览器的底部就是河流的尽头。

那么所谓的文档流（normal flow，也被称为“普通流”），指的是就是元素排版布局过程中，元素会自动从左往右，从上往下地遵守这种流式排列方式。

当浏览器渲染html文档时，从顶部开始开始渲染，为元素分配所需要的空间，每一个块级元素单独占一行，行内元素则按照顺序被水平渲染直到在当前行遇到了边界，然后换到下一行的起点继续渲染。那么此时就不得不说一下块级元素和行内元素。

二、块级元素与行内元素

块级元素：顾名思义，这个元素是“一块”，那么作为一个块，它就应该有自己的宽度和高度。