Чтобы использовать CSS-свойство rotate для поворота элементов на странице, нужно указать угол поворота в единицах измерения углов. 1 Например, чтобы повернуть элемент на 30 градусов вправо, нужно написать: div { rotate: 30deg; }. 1

Есть несколько вариантов использования:

• Одно значение. 1 Элемент будет вращаться вдоль оси z. 1 Пример: .element { rotate: 90deg; }. 1
• Уточнение по оси. 1 Можно указать, по какой из трёх осей (x, y, z) применится значение. 1 Пример: .element { rotate: x 90deg; }. 1
• Собственный вектор и угол вращения. 1 Нужно указать три числа и угол вращения. 1 Каждое из трёх чисел отвечает за соответствующую ось (x, y, z). 1 0 значит, что вращения по этой оси не будет. 1 Всё, что больше нуля, устанавливает точку на этой оси. 1 В итоге элемент будет повёрнут вокруг точки на пересечении всех трёх осей. 1 Пример: .element { rotate: 0 0 1 45deg; }. 1

По умолчанию rotate вращает элемент вокруг его центра, но точку вращения можно изменить с помощью свойства transform-origin. 5