Rekomendasi pelajaran:

Fungsi scale3d() CSS

Definisi dan penggunaan CSS scale3d() Fungsi menentukan skala 3D elemen.

scale3d() Fungsi menentukan nilai skala elemen di arah x, y, dan z.

scale3d() Fungsi di transform dalam properti.

Contoh

Contoh 1

Gunakan scale3d() Skala beberapa elemen <div>:

#myDiv1 {
  transform: scale3d(0.8, 0.8, 0.8);
}
#myDiv2 {
  transform: scale3d(-0.5, -0.5, -0.5);
}
#myDiv3 {
  transform: scale3d(1.1, 1.2, 1);
}

Coba sendiri

Contoh 2

Gunakan scale3d() Skala gambar:

#img1 {
  transform: scale3d(0.8, 0.8, 0.8);
}
#img2 {
  transform: scale3d(-0.5, -0.5, -0.5);
}
#img3 {
  transform: scale3d(1.1, 1.1, 1);
}

Coba sendiri

Sintaks CSS

scale3d(sx, sy, sz)
Nilai Deskripsi
sx Bilangan positif atau negatif, menentukan vektor skala lebar.
sy Bilangan positif atau negatif, menentukan vektor skala tinggi.
sz Bilangan positif atau negatif, menentukan vektor skala arah z.

Detil teknis

Versi: Modul Transformasi CSS Level 2

Dukungan browser

Angka di tabel menunjukkan versi browser yang pertama yang mendukung fungsi ini penuhnya.

Chrome Edge Firefox Safari Opera
12 12 10 4 15

Halaman yang Berhubungan

Panduan:Transformasi 3D CSS

Rujukan:Properti transform CSS

Rujukan:Atribut scale CSS

Rujukan:Fungsi scale() CSS

Rujukan:Fungsi scaleX() CSS

Rujukan:Fungsi scaleY() CSS