Funktsioon skewY

Funktsioon skewY määrab elemendi kaldenurga Y-telje suunas, muutes selle rööpkülikuks. Seda kasutatakse koos omadusega transform. Omaduse väärtuseks on nurk mis tahes nurgaühikutes. Nurk võib olla nii positiivne kui ka negatiivne. Positiivne väärtus kallutab elementi ülespoole, negatiivne - allapoole. Kallutamine toimub punkti suhtes, mis on määratud omadusega transform-origin.

Süntaks

cssselektor {
  transform: skewY(nurk);
}

Näide

Selles näites on plokk kallutatud 30 kraadi võrra ülespoole:

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

css#elem {
  transform: skewY(30deg);
  border: 1px solid black;
  width: 100px;
  height: 50px;
}

Результат:

Näide

Selles näites on plokk kallutatud 30 kraadi võrra allapoole:

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

css#elem {
  transform: skewY(-30deg);
  border: 1px solid black;
  width: 100px;
  height: 50px;
}

Результат:

Vaata ka