<box-edge>

<visual-box> = content-box | padding-box | border-box /* the three <box> values */
<layout-box> = <box> | margin-box /* the <shape-box> values */
<paint-box> = <box> | fill-box | stroke-box
<coord-box> = <box> | fill-box | stroke-box | view-box
<geometry-box> = <shape-box> | fill-box | stroke-box | view-box

Значение <box-edge> может быть типа <visual-box>, <layout-box>, <paint-box>, <coord-box>, или <geometry-box>.

<visual-box>

Относится к прямоугольной области, сгенерированной для элемента, как её видит пользователь на веб-странице. Она включает содержимое элемента, отступы и границу. Также называется <box>, это значение исключает область отступа. Этот тип значения используется для свойств background-clip и overflow-clip-margin.

<layout-box>

Относится к пространству, занимаемому элементом, включая его содержимое, отступы, границу и отступ. Этот тип значения используется для целей компоновки и позиционирования. Также называется <shape-box>, этот тип значения используется для свойства shape-outside.

<paint-box>

Относится к области внутри области компоновки, которая используется для визуального отображения содержимого. Это включает область, где отрисовываются фон и границы элемента. Поскольку область рисования элемента не включает отступы, это значение исключает margin-box.

<coord-box>

Относится к области координат, используемой для позиционирования и размера элемента внутри его родительского контейнера. Она используется для управления тем, как содержимое обтекает края области. Она исключает область отступа. Этот тип значения используется для свойства offset-path.

<geometry-box>

Определяет область отсчёта для базовой фигуры, или, если указана сама по себе, заставляет края указанной области, включая любое формирование углов (например, border-radius), быть обрезной траекторией. Этот тип значения используется для свойств clip-path, mask-clip и mask-origin, и атрибута SVG clip-path.

Ключевые слова <box-edge> определяются следующим образом:

content-box

Относится к внешнему краю области содержимого области. Область содержимого — это самая внутренняя область. Область содержимого содержит фактическое содержимое, такое как текст, изображения или другие HTML-элементы. В SVG это значение обрабатывается как fill-box.

padding-box

Относится к внешнему краю отступа области. Если отступ отсутствует на стороне, то значение такое же, как content-box. В SVG padding-box обрабатывается как fill-box. Область отступа окружает область содержимого, начиная с внешнего края области содержимого.

border-box

Относится к внешнему краю границы области. Если границы нет на стороне, то значение такое же, как padding-box. В SVG border-box обрабатывается как stroke-box. Область границы окружает область отступа, начиная с внешнего края области отступа.

margin-box

Относится к внешнему краю отступа области. Если отступа нет на стороне, то значение такое же, как border-box. В SVG margin-box обрабатывается как stroke-box.

fill-box

Относится к области ограничивающей рамке в SVG. В CSS fill-box обрабатывается как content-box. Она используется для обтекания содержимого по краям, определённым значениями coord-box.

stroke-box

Относится к области ограничивающей рамке обводки в SVG. В CSS stroke-box обрабатывается как border-box. Она используется для определения формы элемента при применении линий.

view-box

Относится к области начала ближайшего элемента-видопорта SVG. Область начала — это прямоугольник с шириной и высотой начальной системы координат пользователя SVG, установленной атрибутом viewBox для этого элемента. Область начала расположена таким образом, что её верхний левый угол привязан к системе координат начала координат. В CSS view-box обрабатывается как border-box.

Примечание: Когда видопорт SVG не привязан к началу координат, область начала не соответствует видопорту SVG.

• Модуль CSS box model