Вступ до Трансформацій CSS

Можна додати рух до веб-сторінок. Трансформації змінюють форму та положення елемента, не впливаючи на інші частини сторінки. У результаті можна створити такі ефекти:

Можна додати масштабування до елементів:

Можна додати обертання до елементів:

Можна додати трансляцію до елементів:

Можна додати нахил до елементів:

Примітка

Усі ці ефекти досягаються за допомогою однієї властивості — transform з різними значеннями. Також важливо зазначити, що animation та @keyframe додані лише для демонстрації різниці між початковим і кінцевим станом елемента. Це не означає, що transform використовується лише з анімаціями. У наступних розділах ми детально розглянемо всі ці ефекти.