css - CSS 框定位的形式语义

Question

我是一名(理论)计算机科学专业的学生，​​因此对编程语言语义的研究是我研究的主题之一 (wikipedia)。

我经常使用 CSS，对框定位规则有一定的了解。 (如果你告诉我创建一个具有特定布局的页面，我通常能想到正确的框方法和适用的 CSS 规则。)

如果 CSS 框定位规则有某种正式的语义会很酷，但在网上搜索了一段时间后，我找不到任何有用的东西。

我大多只是简单地以 CSS 规范结束，这些规范被格式化为带有伪算法的长文本(不是最好的阅读 Material --- 我还没有花很多精力阅读这些规范中的任何一个)。

没有人尝试将这种“理论”形式化为某种数学模型，比规范所提供的更严格吗？我不是在寻找完整或确定的东西，但它肯定会很整洁(而且有用!)，如果至少盒子的放置方式可以以正式的方式建模。

有人知道这样的研究吗？

Answer 1

不是答案! 这是一个非常简化的案例的可能形式化示例(请参阅我上面的评论)。

例如，我们在一个具有 (1) 已知屏幕宽度 的世界中工作, (2) 的有序列表盒子没有嵌套，没有边距/填充/边框，向左浮动，我们通过数学函数知道它们的 (2.1) 高度和 (2.2) 宽度 和 .

我们将定义函数 和 , 表示每个框左上角的坐标。

我们将定义/使用关系“ 起始行 ”和“ 的高度为 ”。

首先，从第 0 行开始。

然后，如果开始行 ，此外如果对于某些

...我们的结论是:

1. >
2. >
3. > 高度
4. > 开始行 +1 当即当

这些规则以正式的方式定义给定框的位置。当然，这只是这样做的一种方法，而且可能不是最聪明的方法(只是很快想出来)，但它确实正确地形式化了 float 的工作方式(模错别字，我还没有仔细检查)。

在处理编程语言时，可以选择多种形式主义，每种形式主义都是为特定目的而发明的(参见 wikipedia)。

我只是想知道是否有人曾尝试为 CSS 框定位提出一些形式化。当然，规范还有很长的路要走，但它们并不像数学方法强制您那样严格。