Funzione skewX
La funzione skewX imposta l'inclinazione di un elemento
lungo l'asse X, trasformandolo così in un parallelogramma.
Viene utilizzata insieme alla proprietà transform.
Il valore della proprietà è un angolo in qualsiasi unità
di misura per angoli. L'angolo può essere sia positivo
che negativo. Un valore positivo
inclina l'elemento a sinistra, uno negativo - a destra.
L'inclinazione avviene attorno al punto specificato dalla
proprietà transform-origin.
Sintassi
selettore {
transform: skewX(angolo);
}
Esempio
In questo esempio, il blocco è inclinato di 30
gradi a sinistra:
<div id="elem">lorem ipsum</div>
#elem {
transform: skewX(30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Esempio
In questo esempio, il blocco è inclinato di 30
gradi a destra:
<div id="elem">lorem ipsum</div>
#elem {
transform: skewX(-30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
: