Функция skewX
La función skewX define el sesgado de un elemento
a lo largo del eje X, transformándolo así en un paralelogramo.
Se utiliza junto con la propiedad transform.
El valor de la propiedad es un ángulo en cualquier unidad
de medida de ángulos. El ángulo puede ser positivo
o negativo. Un valor positivo realiza un sesgado hacia la izquierda,
y uno negativo, hacia la derecha.
El sesgado se realiza alrededor del punto definido por
la propiedad transform-origin.
Sintaxis
selector {
transform: skewX(ángulo);
}
Ejemplo
En este ejemplo, el bloque está sesgado 30
grados hacia la izquierda:
<div id="elem">lorem ipsum</div>
#elem {
transform: skewX(30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Ejemplo
En este ejemplo, el bloque está sesgado 30
grados hacia la derecha:
<div id="elem">lorem ipsum</div>
#elem {
transform: skewX(-30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
