css - 浏览器布局逻辑概述

Question

我试图理解非常基本的浏览器布局逻辑，但我无法将一些准确的东西放在一起，即使是在非常高的层次上，只是描述内联元素、 block 元素和 float 元素。我看到几篇文章中使用的短语，如“正常流程”，但没有定义这些术语。所以我尝试了一个非常简短、不完整的布局逻辑说明。有人可以确认它是否正确，或者即使在这么高的水平上也有错误吗？感谢您的帮助!

1. 获取下一个 html 元素。
2. 如果是行内元素，转3，如果是 block 元素，转4。
3. 将内联元素添加到当前内联元素堆栈。如果堆栈溢出可用的水平空间，则写出一行。转到 1。
4. 如果元素是 float 的，则转5，否则转6。
5. 如果向左浮动，则添加到左侧 float 堆栈。如果向右浮动，则添加到右侧 float 堆栈。转到 1。
6. 写出左浮点栈、内联元素栈和右浮点栈并另起一行。在末尾换行写出 block 元素。转到 1。

Answer 1

您没有在列表中提及 position，这很重要。

我认为这part of the w3 specification应该帮助你。但您可能想从 beginning 开始.