Função skewY
A função skewY define a inclinação de um elemento
no eixo Y, transformando-o 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 inclina o elemento
para cima, um valor negativo - para baixo.
A inclinação é realizada em torno do ponto definido
pela propriedade transform-origin.
Sintaxe
seletor {
transform: skewY(ângulo);
}
Exemplo
Neste exemplo, o bloco é inclinado em 30
graus para cima:
<div id="elem">lorem ipsum</div>
#elem {
transform: skewY(30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Exemplo
Neste exemplo, o bloco é inclinado em 30
graus para baixo:
<div id="elem">lorem ipsum</div>
#elem {
transform: skewY(-30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
: