Эта диаграмма изображает четыре области бокса CSS: содержимое, заполнение, рамку и поля.
Здесь четыре вложенных бокса: внутренний - содержимое, после этого - заполнение, рамка и поля. Всякая область имеет свой жанр обрамления: край содержимого - тонкий и сплошной; край заполнения - тонкий и идёт точками; рамка - толстая сплошная; поля - толстые и точками.
Под боксами предание перечисляет 4 жанра обрамления, используемые тут.