Kursrekommendation:

CSS skewX() funktion

Definition och användning skewX() CSS:

skewX() Funktionen används för att skråna element längs x-axeln med den givna vinkeln. transform Används i egenskapsförklaringen.

Tips:skewX(a) Ekvivalent med skew(a, 0)!

Exempel

Exempel 1

Använd skewX() Skråna flera <div>-element längs x-axeln med den givna vinkeln:

#myDiv1 {
  transform: skewX(15deg);
}
#myDiv2 {
  transform: skewX(30deg);
}
#myDiv3 {
  transform: skewX(-25deg);
}

Prova själv

Exempel 2

Använd skewX() Skråna bilden längs x-axeln med den givna vinkeln:

#img1 {
  transform: skewX(25deg);
}
#img2 {
  transform: skewX(-25deg);
}
#img3 {
  transform: skewX(10deg);
}

Prova själv

CSS-syntaks

skewX(a)

Tekniska detaljer

Webbläsarstöd

Tabellennummern anger den första version av webbläsaren som helt stöder denna funktion.

Relaterade sidor

Lärarlektion:CSS 2D-transformering

Referens:CSS transform egenskap

Referens:CSS skew() funktion

Referens:CSS skewY() funktion