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
sélecteur {
transform: skewY(angle);
}
Exemple
Dans cet exemple, le bloc est incliné de 30
degrés vers le haut :
<div id="elem">lorem ipsum</div>
#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 :
<div id="elem">lorem ipsum</div>
#elem {
transform: skewY(-30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
: