scaleY Fonksiyonu

scaleY fonksiyonu, bir öğeyi Y ekseni boyunca ölçeklendirir. Ölçeklendirme, transform-origin özelliği ile belirlenen nokta etrafında gerçekleşir. Fonksiyonun değeri tam sayı veya ondalıklı sayı olabilir. Sayı 1'den büyükse - öğe büyür, küçükse (örneğin, 0.5) - öğe küçülür. 1 değeri verilirse - hiçbir şey değişmez (bu, varsayılan değerdir).

Sözdizimi

cssseçici {
  transform: scaleY(sayı);
}

Örnek

Blok üzerine gelindiğinde Y ekseni boyunca ölçeği 1.5 katına çıkaralım:

html<div id="elem">lorem ipsum</div>
css#elem {
  border: 1px solid black;
  width: 100px;
  height: 50px;
}
#elem:hover {
  transform: scaleY(1.5);
}

Результат:

Örnek

Blok üzerine gelindiğinde Y ekseni boyunca ölçeği 2 katına küçültelim:

html<div id="elem">lorem ipsum</div>
css#elem {
  border: 1px solid black;
  width: 100px;
  height: 50px;
}
#elem:hover {
  transform: scaleY(0.5);
}

Результат:

Ayrıca Bakınız

  • X ve Y eksenleri boyunca ölçeklendirme ayarlayan scale fonksiyonu
  • X ekseni boyunca ölçeklendirme ayarlayan scaleX fonksiyonu