СSS Свойство transform-style
Пример
Пусть преобразованные дочерние элементы сохраняют 3D преобразования:
div
{
transform: rotateY(60deg);
transform-style: preserve-3d;
}
Редактор кода »
Определение и использование
Свойство transform-style определяет способ отображения вложенных элементов в 3D пространство.
Примечание: Это свойство должно использоваться вместе с свойством transform.
Чтобы лучше понять свойство transform-style, просмотр демо-версии.
| Значение по умолчанию: | flat |
|---|---|
| Унаследованный: | нет |
| Анимируемый: | нет Прочитайте о animatable |
| Версия: | CSS3 |
| JavaScript синтаксис: | object.style.transformStyle="preserve-3d" Попробовать |
Поддержка браузеров
Числа в таблице указывают первую версию браузера, которая полностью поддерживает свойство.
Числа, за которыми следует -webkit- или -moz- указывают первую версию, которая работала с префиксом.
| Свойство | |||||
|---|---|---|---|---|---|
| transform-style | 36.0 12.0 -webkit- |
11.0 | 16.0 10.0 -moz- |
9.0 4.0 -webkit- |
23.0 15.0 -webkit- |
CSS Синтаксис
transform-style: flat|preserve-3d|initial|inherit;
Значение свойств
| Значение | Описание |
|---|---|
| flat | Указывает, что дочерние элементы не будут сохранять свою трехмерную позицию. Это значение по умолчанию |
| preserve-3d | Указывает, что дочерние элементы сохранят свое 3D положение |
| initial | Устанавливает для этого свойства значение по умолчанию. Прочитайте о initial |
| inherit | Наследует это свойство от родительского элемента. Прочитайте о inherit |
Связанные страницы
CSS Учебник: CSS 2D Трансформация
CSS Учебник: CSS 3D Трансформация
HTML DOM Справочник: Свойство transformStyle
