Transform-origin в CSS это свойство, которое устанавливает точку, вокруг которой происходит трансформация элемента при использовании свойства transform.
Transform-origin устанавливает точку с помощью двух значений: горизонтальной и вертикальной координаты, которые определяются в процентах или значениях пикселей. Значения могут быть положительными, отрицательными или равными нулю.
Синтаксис выглядит следующим образом:
transform-origin: x-axis y-axis;
Значения для x-axis и y-axis могут быть заданы в процентах, пикселях или других единицах измерения CSS.
Например, чтобы установить точку трансформации в центр элемента, используйте следующие значения:
transform-origin: 50% 50%;
Если нужно установить точку трансформации в левый верхний угол элемента, используйте следующий код:
transform-origin: 0% 0%;
Чтобы установить точку трансформации справа и сверху от элемента, которая находится на расстоянии 20 пикселей, используйте следующий код:
transform-origin: right top 20px;
Transform-origin применяется только к элементам, которые используют свойство transform. Если свойство transform не используется для элемента, то свойство transform-origin не будет иметь никакого эффекта.
