Função skewX
A função skewX define a inclinação de um elemento
no eixo X, transformando-o assim em um paralelogramo.
É usada em conjunto com a propriedade transform.
O valor da propriedade é um ângulo em qualquer unidade
de ângulo. O ângulo pode ser positivo
ou negativo. Um valor positivo
faz a inclinação para a esquerda, um negativo - para a direita.
A inclinação é feita em torno do ponto definido pela
propriedade transform-origin.
Sintaxe
seletor {
transform: skewX(ângulo);
}
Exemplo
Neste exemplo, o bloco é inclinado em 30
graus para a esquerda:
<div id="elem">lorem ipsum</div>
#elem {
transform: skewX(30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Exemplo
Neste exemplo, o bloco é inclinado em 30
graus para a direita:
<div id="elem">lorem ipsum</div>
#elem {
transform: skewX(-30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
