Fonction skewX
La fonction skewX définit l'inclinaison d'un élément
sur l'axe X, le transformant ainsi 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 la gauche, une valeur négative - vers la droite.
L'inclinaison est effectuée autour du point défini par
la propriété transform-origin.
Syntaxe
sélecteur {
transform: skewX(angle);
}
Exemple
Dans cet exemple, le bloc est incliné de 30
degrés vers la gauche :
<div id="elem">lorem ipsum</div>
#elem {
transform: skewX(30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Exemple
Dans cet exemple, le bloc est incliné de 30
degrés vers la droite :
<div id="elem">lorem ipsum</div>
#elem {
transform: skewX(-30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
: