Функција skewX

Функцијата skewX задава искосување на елементот по оската X, претворајќи го со тоа во паралелограм. Се користи заедно со својството transform. Вредноста на својството е агол во какви било единици за агли. Аголот може да биде и позитивен, и негативен. Позитивната вредност го прави искосувањето налево, негативната - надесно. Искосувањето се врши околу точката, зададена со својството transform-origin.

Синтакса

cssселектор {
  transform: skewX(агол);
}

Пример

Во овој пример блокот е искосен за 30 степени налево:

html<div id="elem">lorem ipsum</div>

css#elem {
  transform: skewX(30deg);
  border: 1px solid black;
  width: 100px;
  height: 50px;
}

Результат:

Пример

Во овој пример блокот е искосен за 30 степени надесно:

html<div id="elem">lorem ipsum</div>

css#elem {
  transform: skewX(-30deg);
  border: 1px solid black;
  width: 100px;
  height: 50px;
}

Результат:

Погледнете ги и