CSS skewX() Funktion

Definition und Verwendung

CSS skewX() Funktion wird verwendet, um Elemente entlang der angegebenen Winkel entlang der x-Achse zu neigen.

skewX() Die Funktion wird in transform im Attribut verwendet.

Hinweis:skewX(a) Äquivalent zu skew(a, 0)!

Beispiel

Beispiel 1

Verwenden Sie skewX() Bilden Sie mehrere <div>-Elemente entlang der angegebenen Winkel entlang der x-Achse ab:

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

Versuchen Sie es selbst

Beispiel 2

Verwenden Sie skewX() Bilden Sie ein Bild entlang der angegebenen Winkel entlang der x-Achse ab:

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

Versuchen Sie es selbst

CSS-Syntax

skewX(a)

Technische Details

Browser-Unterstützung

Die Zahlen in der Tabelle geben die Versionsnummer des ersten Browsers an, der diese Funktion vollständig unterstützt.

Verwandte Seiten

Tutorium:CSS 2D-Transformation

Referenz:CSS transform Eigenschaft

Referenz:CSS skew() Funktion

Referenz:CSS skewY() Funktion