Funktion skewY
Die Funktion skewY bewirkt eine Schrägstellung des Elements
entlang der Y-Achse und verwandelt es in ein Parallelogramm.
Sie wird zusammen mit der Eigenschaft transform verwendet.
Als Wert dient ein Winkel in beliebigen Winkeleinheiten.
Der Winkel kann sowohl positiv als auch
negativ sein. Ein positiver Wert
bewirkt eine Schrägstellung nach oben, ein negativer - nach unten.
Die Schrägstellung erfolgt um den Punkt, der durch die
Eigenschaft transform-origin festgelegt ist.
Syntax
Selektor {
transform: skewY(Winkel);
}
Beispiel
In diesem Beispiel wird das Blockelement um 30
Grad nach oben geschrägt:
<div id="elem">lorem ipsum</div>
#elem {
transform: skewY(30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Beispiel
In diesem Beispiel wird das Blockelement um 30
Grad nach unten geschrägt:
<div id="elem">lorem ipsum</div>
#elem {
transform: skewY(-30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
