CSS 流式布局

常规流,或称流式布局,是指在未对其布局进行任何更改之前,块级和行内元素在页面上的显示方式。流本质上是一组在布局中协同工作并相互了解的事物。一旦某个事物被移出流,它就会独立工作。

在常规流中,行内元素按行内方向显示,即根据文档的书写模式,按句子中单词显示的LTR(左到右)、RTL(右到左)或TTB(从上到下)的方向显示。块级元素则一个接一个地显示,就像文档的书写模式中的段落一样。因此,在英语中,行内元素从左侧开始一个接一个地显示,而块级元素则从页面顶部开始向下移动。

基本示例

以下示例演示了块级和行内框。两个带有绿色边框的段落元素是块级元素,它们一个在另一个下方显示。

第一句话还包含一个带有蓝色背景的 span 元素。这是一个行内级元素,因此它在句子中原位显示。

另见