Fungsi skew
Fungsi skew menetapkan condongan elemen,
dengan itu mengubahnya daripada segi empat tepat
kepada segi empat selari. Digunakan bersama-sama
dengan sifat transform.
Nilai bagi sifat ialah sudut dalam mana-mana unit
untuk sudut. Condongan dilakukan di sekitar
titik, yang ditetapkan oleh sifat transform-origin.
Boleh menerima satu atau dua parameter, disenaraikan secara berturutan. Jika terdapat dua parameter - parameter pertama menetapkan condongan mengufuk, dan parameter kedua - menegak. Jika hanya satu parameter - ia menetapkan condongan mengufuk (bukan pada kedua-dua arah). Parameter boleh menjadi positif atau negatif.
Sintaks
selector {
transform: skew(satu atau dua sudut);
}
Contoh
Dalam contoh ini, blok dicondongkan 30
darjah ke kiri:
<div id="elem">lorem ipsum</div>
#elem {
transform: skew(30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Contoh
Dalam contoh ini, blok dicondongkan 30
darjah ke kanan:
<div id="elem">lorem ipsum</div>
#elem {
transform: skew(-30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Contoh
Dalam contoh ini, blok dicondongkan 30
darjah menegak (nilai positif):
<div id="elem">lorem ipsum</div>
#elem {
transform: skew(0deg, 30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Contoh
Dalam contoh ini, blok dicondongkan 30
darjah menegak (nilai negatif):
<div id="elem">lorem ipsum</div>
#elem {
transform: skew(0deg, -30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Contoh
Menetapkan condongan serentak pada paksi X dan Y:
<div id="elem">lorem ipsum</div>
#elem {
transform: skew(30deg, 30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
