Fonction skewY

La fonction skewY définit l'inclinaison d'un élément sur l'axe Y, le transformant en un parallélogramme. Elle est utilisée conjointement avec la propriété transform. La valeur de la propriété est un angle dans n'importe quelle unité d'angle. L'angle peut être positif ou négatif. Une valeur positive effectue une inclinaison vers le haut, une valeur négative - vers le bas. L'inclinaison est effectuée autour du point défini par la propriété transform-origin.

Syntaxe

csssélecteur {
  transform: skewY(angle);
}

Exemple

Dans cet exemple, le bloc est incliné de 30 degrés vers le haut :

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

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

Результат:

Exemple

Dans cet exemple, le bloc est incliné de 30 degrés vers le bas :

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

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

Результат:

Voir aussi