Функција skew
Функција skew задаје искосивање елемента,
претварајући га из правоугаоника
у паралелограм. Користи се заједно
са својством transform.
Вредност својства је угао у било којој јединици
за углове. Искосивање се врши око
тачке која се задаје својством transform-origin.
Може прихватити један или два параметра, који се наводе раздвојени зарезима. Ако су параметра два - први параметар задаје искосивање по хоризонтали, а други - по вертикали. Ако је параметар један - онда он задаје искосивање по хоризонтали (а не по обе осе). Параметри могу бити и позитивни, и негативни.
Синтакса
селектор {
transform: skew(један или два угла);
}
Пример
У овом примеру блок је искосен за 30
степени улево:
<div id="elem">lorem ipsum</div>
#elem {
transform: skew(30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Пример
У овом примеру блок је искосен за 30
степени удесно:
<div id="elem">lorem ipsum</div>
#elem {
transform: skew(-30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Пример
У овом примеру блок је искосен за 30
степени по вертикали (позитивна вредност):
<div id="elem">lorem ipsum</div>
#elem {
transform: skew(0deg, 30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Пример
У овом примеру блок је искосен за 30
степени по вертикали (негативна вредност):
<div id="elem">lorem ipsum</div>
#elem {
transform: skew(0deg, -30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Пример
Задајемо искосивање истовремено по X и Y оси:
<div id="elem">lorem ipsum</div>
#elem {
transform: skew(30deg, 30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
