Fungsi skewX

Fungsi skewX menetapkan pencongkan elemen pada paksi X, dengan itu mengubahnya kepada segi empat selari. Digunakan bersama dengan sifat transform. Nilai sifat adalah sudut dalam sebarang unit untuk sudut. Sudut boleh menjadi positif, atau negatif. Nilai positif membuat pencongkan ke kiri, nilai negatif - ke kanan. Pencongkan dilakukan di sekitar titik, yang ditetapkan oleh sifat transform-origin.

Sintaks

csspemilih {
  transform: skewX(sudut);
}

Contoh

Dalam contoh ini, blok dicongkan 30 darjah ke kiri:

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

Результат:

Contoh

Dalam contoh ini, blok dicongkan 30 darjah ke kanan:

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

Результат:

Lihat juga

  • fungsi skew,
    yang menetapkan pencongkan pada paksi X dan Y
  • fungsi skewY,
    yang menetapkan pencongkan pada paksi Y