transform-style

Baseline 2022

Newly available

Since March 2022, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

Экспериментальная возможность: Это экспериментальная технология
Так как спецификация этой технологии ещё не стабилизировалась, смотрите таблицу совместимости по поводу использования в различных браузерах. Также заметьте, что синтаксис и поведение экспериментальной технологии может измениться в будущих версиях браузеров, вслед за изменениями спецификации.

Свойство transform-style CSS определяет положение дочернего элемента в 3D-пространстве или в той же плоскости, что и родительский элемент.

Если flat, то дочерний элемент не будет существовать в своём собственном 3D-пространстве.

Поскольку это свойство не наследуется, его следует устанавливать для всех не прямых потомков элемента.

Начальное значениеflat
Применяется ктрансформируемые элементы
Наследуетсянет
Обработка значениякак указано
Animation typediscrete
Создаёт контекст наложенияда

Syntax

css
/* Keyword values */
transform-style: preserve-3d;
transform-style: flat;

/* Global values */
transform-style: inherit;
transform-style: initial;
transform-style: unset;

Values

preserve-3d

Показывает, что дочерний элемент должен быть спозиционирован в 3D-пространстве.

flat

Показывает, что дочерний элемент лежит в той же плоскости, что и родительский.

Formal syntax

transform-style = 
  flat         | (en-US)
  preserve-3d

Specifications

Specification
CSS Transforms Module Level 2
# transform-style-property

Совместимость с браузерами

BCD tables only load in the browser

See also