Функция CSS rotate() искажает элемент на определенное количество градусов. Вы можете повернуть элемент по часовой стрелке, используя положительное число градусов. Или вы можете повернуть элемент против часовой стрелки, используя отрицательное число.
Сегодня мы узнаем, как вращать элементы с помощью CSS. Зачем вращать элемент? Вращающиеся элементы делают вашу веб-страницу более интерактивной. При правильном использовании вращающийся элемент добавит эстетики вашему сайту.
При чтении этой статьи обращайтесь к сопутствующий репозиторий , чтобы вы могли увидеть концепции в действии. Знание того, как поворачивать элемент, станет отличным дополнением к вашему набору инструментов CSS.
Поворот CSS ()
Функция поворота CSS () позволяет вам вращать элемент по 2D-оси. Функция rotate() принимает один аргумент: угол, на который вы хотите повернуть веб-элемент. Вы можете вращать элемент по часовой или против часовой стрелки.
Давайте посмотрим на синтаксис функции rotate():
Значение угла представляет собой число градусов, на которое должен повернуться элемент. Вы можете указать вращение по часовой стрелке, используя положительное число градусов (например, 45). Или вы можете повернуть в противоположном направлении, используя отрицательное значение градуса (например, -39).
Функция поворота () может быть применена к любому элементу HTML. Например, вы можете повернуть абзац текста. Или вы можете повернуть изображение.
Поворот HTML появляется, как только вы визуализируете страницу, поэтому поворот не виден. Чтобы увидеть поворот в действии, необходимо использовать переход CSS . Переходы изменяют состояние элемента при выполнении действия, например при наведении курсора на элемент.
