Функцыя skewY

Функцыя skewY задае скажэнне элемента па восі Y, ператвараючы яго ў паралелаграм. Выкарыстоўваецца сумесна з уласцівасцю transform. Значэннем уласцівасці служыць кут у любых адзінках для вуглоў. Кут можа быць як дадатнымі, так і адмоўнымі. Дадатнае значэнне робіць скажэнне ўверх, адмоўнае - ўніз. Скажэнне ажыццяўляецца вакол кропкі, якая задаецца ўласцівасцю transform-origin.

Сінтаксіс

cssселектар {
  transform: skewY(вугал);
}

Прыклад

У гэтым прыкладзе блок скажоны на 30 градусаў уверх:

html<div id="elem">lorem ipsum</div>
css#elem {
  transform: skewY(30deg);
  border: 1px solid black;
  width: 100px;
  height: 50px;
}

Результат:

Прыклад

У гэтым прыкладзе блок скажоны на 30 градусаў уніз:

html<div id="elem">lorem ipsum</div>
css#elem {
  transform: skewY(-30deg);
  border: 1px solid black;
  width: 100px;
  height: 50px;
}

Результат:

Глядзіце таксама

  • функцыю skew,
    якая задае скажэнне па восях X і Y
  • функцыю skewX,
    якая задае скажэнне па восі X