transform

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

Примеры

transform: rotate(20deg);
font-style: oblique;
transform: scaleY(1.5);

Значения

Значение	Описание
none	Убирает трансформацию.
matrix(n,n,n,n,n,n)	Определяет 2D-преобразование, используя матрицу из шести значений.
matrix3d (n,n,n,n,n,n,n,n,n,n,n,n,n,n,n,n)	Определяет трехмерное преобразование, используя матрицу 4×4 из 16 значений.
translate(x,y)	Сдвигает элемент на заданное значение по горизонтали и вертикали.
translate3d(x,y,z)	Сдвигает элемент на заданное значение в трёхмерном пространстве.
translateX(x)	Сдвигает элемент по горизонтали. Положительное значение сдвигает вправо, отрицательное – влево.
translateY(y)	Сдвигает элемент по вертикали. Положительное значение сдвигает вниз, отрицательное – вверх.
translateZ(z)	Сдвигает элемент по оси Z. Положительное значение сдвигает вперёд, отрицательное – назад.
scale(x,y)	Масштабирует элемент по горизонтали и вертикали.
scale3d(x,y,z)	Масштабирует элемент в трехмерном пространстве.
scaleX(x)	Масштабирует по горизонтали.
scaleY(y)	Масштабирует по вертикали.
scaleZ(z)	Масштабирует по оси Z.
rotate(<угол>)	Поворачивает элемент в 2D-пространстве на заданный угол относительно точки трансформации, задаваемой свойством transform-origin.
rotate3d(x,y,z,<угол>)	Поворачивает элемент в 3D-пространстве.
rotateX(<угол>)	Поворачивает элемент на заданный угол относительно оси X.
rotateY(<угол>)	Поворачивает элемент на заданный угол относительно оси Y.
rotateZ(<угол>)	Поворачивает элемент на заданный угол относительно оси Z.
skew(,)	Наклоняет элемент на заданный угол по горизонтали и вертикали.
skewX(<угол>)	Наклоняет элемент на заданный угол по горизонтали.
skewY(<угол>)	Наклоняет элемент на заданный угол по вертикали.
perspective(n)	Задает перспективу.
inherit	Наследует значение родительского блока.
initial	Устанавливает значение по умолчанию.