Funkce skewX

Funkce skewX nastavuje zkosení prvku podél osy X, čímž jej přeměňuje na rovnoběžník. Používá se společně s vlastností transform. Hodnotou vlastnosti je úhel v libovolných jednotkách pro úhly. Úhel může být kladný i záporný. Kladná hodnota způsobí zkosení doleva, záporná - doprava. Zkosení se provádí kolem bodu určeného vlastností transform-origin.

Syntaxe

cssselektor {
  transform: skewX(úhel);
}

Příklad

V tomto příkladu je blok zkosen o 30 stupňů doleva:

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

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

Результат:

Příklad

V tomto příkladu je blok zkosen o 30 stupňů doprava:

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

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

Результат:

Viz také