Sémantique formelle du positionnement de la boîte CSS

Question

Je suis un étudiant (théorique) en informatique, et en tant que tel l'étude de la sémantique des langages de programmation est l'un des sujets de mon étude (wikipedia).

J'ai beaucoup joué avec CSS et j'ai une compréhension raisonnable des règles de positionnement de la boîte. (Si vous me dites de créer une page avec une certaine mise en page, je peux souvent penser à la bonne approche et aux règles CSS applicables.)

Il serait cool d'avoir une sorte de sémantique formelle pour les règles de positionnement de la boîte CSS, mais après avoir cherché sur le net pendant un moment, je ne pouvais pas vraiment trouver quelque chose d'utile. Je finis simplement simplement aux spécifications CSS, qui sont formatées en tant que longs textes avec des pseudo-algorithmes (pas le plus grand sujet de lecture --- je n'ai pas lu toutes ces spécifications avec beaucoup d'effort pour le moment).

Est-ce que personne n'a essayé de formaliser cette théorie “ ” dans un modèle mathématique, plus rigoureux que ce que les spécifications ont à offrir? Je ne cherche pas quelque chose de complet ou définitif, mais il serait sûr (et utile!) Si, au moins, la façon dont les boîtes devraient être positionnées pourrait être modélisée de façon formelle.

Quelqu'un connaît-il une telle recherche?

Answer 1

Ce n'est pas une réponse!Ceci est un exemple d'une formalisation possible d'un cas très simplifié (voir mon commentaire ci-dessus).

Disons, par exemple, nous travaillons dans un monde avec (1) une largeur de l'écran connu , (2) une liste ordonnée de boîtes qui ne sont pas imbriquées, ont des frontières de pas de marges/remplissage/, sont flottantes à gauche et dont on connaît la hauteur (2.1) et la largeur (2.2) via les fonctions mathématiques et .

Nous allons définir les fonctions et , qui indiquent les coordonnées du coin supérieur gauche de chaque boîte.

Nous définirons/en utilisant les relations " Starts " et " a une hauteur ".

Tout d'abord, la ligne 0. commence

Ensuite, si Starts , et en outre, si pour certains

...nous concluons que:

1. 
2. 
3. a une hauteur
4. Starts +1 ssi

Ces règles définissent les positions des boîtes données dans un formel manière. Ce n'est qu'une façon de le faire, bien sûr, et probablement pas la plus intelligente (juste pensée rapidement), mais elle formalise correctement le fonctionnement des flotteurs (modulo typos, je ne l'ai pas vérifié assez bien). En ce qui concerne les langages de programmation, on peut choisir plusieurs de ces formalismes, chacun inventé à des fins particulières (voir wikipedia).

Je suis simplement intéressé si quelqu'un a déjà essayé de trouver une formalisation pour le positionnement des boîtes CSS. Bien sûr, les spécifications vont un long chemin, mais ils ne sont tout simplement pas aussi rigoureux que la façon mathématique vous oblige à être.