Recommandation de cours :

Fonction skewX() CSS

Définition et utilisation skewX() Dans CSS

skewX() La fonction est utilisée pour incliner un élément le long de l'axe x à un angle donné. transform Utilisé dans l'attribut.

Astuce :skewX(a) Équivaut à skew(a, 0)!

Exemple

Exemple 1

Utilisez skewX() Inclinez plusieurs éléments <div> le long de l'axe x à l'angle donné :

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

Essayez-le vous-même

Exemple 2

Utilisez skewX() Inclinez l'image le long de l'axe x à l'angle donné :

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

Essayez-le vous-même

Syntaxe CSS

skewX(a)

Détails techniques

Prise en charge du navigateur

Les nombres dans le tableau représentent la version du navigateur qui prend en charge cette fonction pour la première fois.

Pages associées

Tutoriel :Transformation 2D CSS

Référence :Attribut transform CSS

Référence :Fonction skew() CSS

Référence :Fonction skewY() CSS