Funkcia skewY

Funkcia skewY nastavuje skosenie prvku podľa osi Y, čím ho mení na rovnobežník. Používa sa spolu s vlastnosťou transform. Hodnotou vlastnosti je uhol v ľubovoľných jednotkách pre uhly. Uhol môže byť kladný aj záporný. Kladná hodnota spôsobuje skosenie nahor, záporná - nadol. Skosenie sa vykonáva okolo bodu, ktorý je definovaný vlastnosťou transform-origin.

Syntax

cssselektor {
  transform: skewY(uhol);
}

Príklad

V tomto príklade je blok skosený o 30 stupňov nahor:

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

Результат:

Príklad

V tomto príklade je blok skosený o 30 stupňov nadol:

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

Результат:

Pozri tiež

  • funkciu skew,
    ktorá nastavuje skosenie podľa osí X a Y
  • funkciu skewX,
    ktorá nastavuje skosenie podľa osi X