transform

CSS-трансформації дозволяють зміщувати, повертати елементи та змінювати їх масштаб — тобто додавати декоративні ефекти. Трансформації змінюють форму та положення елемента, не впливаючи на інші елементи сторінки. За замовчуванням трансформація відбувається відносно центру елемента. Властивість transform відповідає за застосування однієї або більше трансформацій елемента. Функції scaleX(tx), scaleY(ty) і scale(tx, ty) масштабують блок по ширині та/або висоті, не впливаючи на геометрію навколишніх елементів. Якщо для scale() задано певне значення, друге буде таким самим.

.box {
transform: scale(1.15);
}

opacity

Прозорість

rotate

повертає елементи на задану кількість градусів (одиниця deg). Позитивні значення повертають елемент за годинниковою стрілкою, негативні — проти.

translateX(tx), translateY(ty) і translate(tx, ty)

переміщають елемент у горизонтальному (вісь X) та/або вертикальному (вісь Y) напрямках щодо початкового положення.

.box {
transform: translate(100px, 200px);
}