Функция scaleY

Функцията scaleY мащабира елемент по оста Y. Мащабирането се извършва около точката, зададена от свойството transform-origin. Стойността на функцията е цяло или дробно число. Ако е по-голямо от 1 - елементът се увеличава, ако е по-малко (например 0.5) - елементът се намалява. Ако се зададе 1 - нищо не се променя (това е стойността по подразбиране).

Синтаксис

cssселектор {
  transform: scaleY(число);
}

Пример

При посочване на блока ще увеличим мащаба с 1.5 пъти по оста Y:

html<div id="elem">lorem ipsum</div>

css#elem {
  border: 1px solid black;
  width: 100px;
  height: 50px;
}
#elem:hover {
  transform: scaleY(1.5);
}

Результат:

Пример

При посочване на блока ще намалим мащаба с 2 пъти по оста Y:

html<div id="elem">lorem ipsum</div>

css#elem {
  border: 1px solid black;
  width: 100px;
  height: 50px;
}
#elem:hover {
  transform: scaleY(0.5);
}

Результат:

Вижте също