Стартовая точка поворота: transform-origin

transform-origin

Поддержка браузерами
Настольные браузеры Chrome Firefox (Gecko) Internet Explorer Opera Safari
Базовая поддержка, версии браузеров 4 -webkit- 3.5 (1.9.1) -moz- 9.0 -ms- 10.5 -o- 3.1 -webkit-
Мобильные браузеры Android IE Phone Opera Mobile Safari Mobile
Базовая поддержка, версии браузеров 2.1 -webkit- 10 12 3.2 -webkit
Свойство
transform-origin — это свойство задает стартовую точку поворота
Описание
Свойство позволяет задать стартовую точку относительно которой будет выполняться поворот. Стартовая точка определяется двумя значениями (первое значение задает смещение по горизонтали, второе значение задает смещение по вертикали). Если задано только одно значение, то второе значение по умолчанию будет таким же.
Наследование
Не наследуется. Это значит что стили применённые к родительскому элементу не передадутся потомкам
Применяется
К преобразуемым элементам
Может принимать значения
значение в абсолютных единицах | значение в относительных единицах | left | center | right | top | bottom | inherit
Значение по умолчанию
50% 50%
Правила записи
свойство: значение
Примеры

Начальная точка, относительно которой будет произведен поворот, смещена на 13px по горизонтали и на 47px по вертикали

Начальная точка, относительно которой будет произведен поворот, смещена на 13% по горизонтали и на 24% по вертикали

Начальная точка, относительно которой будет произведен поворот, смещена в правый нижний угол

Поделиться