home chevron_right
Масштабирование (transform-scale)

Масштабирование (transform-scale)link

transform-scale изменяет размер элемента по обеим осям или отдельно по x/y.

Классыlink

Класс Значение
.scale-0 transform: scale(0)
.scale-1/4 transform: scale(.8)
.scale-1/3 transform: scale(.9)
.scale-1/2 transform: scale(.95)
.scale-1 transform: scale(1)
.scale-2 transform: scale(1.05)
.scale-3 transform: scale(1.1)
.scale-4 transform: scale(1.2)
.scale-x-* масштаб только по оси X
.scale-y-* масштаб только по оси Y

Синтаксисlink

  • scale-{value}
  • scale-x-{value}
  • scale-y-{value}
  • hover:scale-{value}

Где value: 0, 1/4, 1/3, 1/2, 1, 2, 3, 4.

Playgroundlink