skewX funksiyası

skewX funksiyası elementi X oxu üzrə əyərək onu paraleloqrama çevirir. transform xassəsi ilə birlikdə istifadə olunur. Xassənin qiyməti istənilən bucaq vahidlərində olan bucaqdır. Bucaq müsbət və ya mənfi ola bilər. Müsbət qiymət sola, mənfi qiymət isə sağa əyilmə yaradır. Əyilmə transform-origin xassəsi ilə təyin olunan nöqtə ətrafında həyata keçirilir.

Sintaksis

cssselektor {
  transform: skewX(bucaq);
}

Nümunə

Bu nümunədə blok 30 dərəcə sola əyilib:

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

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

Результат:

Nümunə

Bu nümunədə blok 30 dərəcə sağa əyilib:

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

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

Результат:

Həmçinin bax