Funktionen skewX

Funktionen skewX angiver skævheden af et element langs X-aksen, hvilket omdanner det til et parallelogram. Den bruges sammen med egenskaben transform. Værdien af egenskaben er en vinkel i enhver enhed for vinkler. Vinklen kan være både positiv og negativ. En positiv værdi laver en skævhed til venstre, en negativ - til højre. Skævheden udføres omkring punktet angivet af egenskaben transform-origin.

Syntaks

cssselektor {
  transform: skewX(vinkel);
}

Eksempel

I dette eksempel er blokken skævet med 30 grader til venstre:

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

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

Результат:

Eksempel

I dette eksempel er blokken skævet med 30 grader til højre:

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

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

Результат:

Se også