Funktsiya skewY

Funktsiya skewY elementni Y o‘qi bo‘yicha qiyshaytiradi, uni parallelogrammga aylantiradi. transform xususiyati bilan birgalikda ishlatiladi. Xususiyat qiymati burchak birliklarida ifodalanadi. Burchak ijobiy ham, manfiy ham bo‘lishi mumkin. Ijobiy qiymat yuqoriga qiyshaytiradi, manfiy qiymat - pastga. Qiyshaytirish transform-origin xususiyati bilan belgilanadigan nuqta atrofida amalga oshiriladi.

Sintaksis

cssselektor {
  transform: skewY(burchak);
}

Misol

Ushbu misolda blok 30 darajaga yuqoriga qiyshaytirilgan:

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

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

Результат:

Misol

Ushbu misolda blok 30 darajaga pastga qiyshaytirilgan:

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

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

Результат:

Shuningdek qarang