Funkcija skewY

Funkcija skewY nustato elemento iškraipymą išilgai Y ašies, paverčiant jį į lygiagretainį. Naudojama kartu su savybe transform. Savybės reikšmė yra kampas bet kokiame kampo matavimo vienete. Kampas gali būti ir teigiamas, ir neigiamas. Teigiama reikšmė sukelia iškraipymą aukštyn, neigiama - žemyn. Iškraipymas atliekamas aplink tašką, nurodytą savybės transform-origin.

Sintaksė

cssselektorius {
  transform: skewY(kampas);
}

Pavyzdys

Šiame pavyzdyje blokas iškraipytas 30 laipsnių kampu aukštyn:

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

Результат:

Pavyzdys

Šiame pavyzdyje blokas iškraipytas 30 laipsnių kampu žemyn:

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

Результат:

Taip pat žiūrėkite

  • funkciją skew,
    kuri nustato iškraipymą išilgai X ir Y ašių
  • funkciją skewX,
    kuri nustato iškraipymą išilgai X ašies