Funcția skewX
Funcția skewX definește înclinarea elementului
pe axa X, transformându-l astfel într-un paralelogram.
Este utilizată împreună cu proprietatea transform.
Valoarea proprietății este un unghi în orice unitate
de măsură pentru unghiuri. Unghiul poate fi atât pozitiv,
cât și negativ. O valoare pozitivă
face înclinarea spre stânga, iar una negativă - spre dreapta.
Înclinarea se realizează în jurul punctului definit de
proprietatea transform-origin.
Sintaxă
cssselector {
transform: skewX(unghi);
}
Exemplu
În acest exemplu, blocul este înclinat la 30
grade spre stânga:
html<div id="elem">lorem ipsum</div>css#elem {
transform: skewX(30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
Результат:
Exemplu
În acest exemplu, blocul este înclinat la 30
grade spre dreapta:
html<div id="elem">lorem ipsum</div>css#elem {
transform: skewX(-30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
Результат: