Properti zoom CSS

Definisi dan penggunaan

zoom Atribut menentukan skala elemen. Elemen dapat diperbesar atau diperkecil.

Contoh

Contoh 1

Untuk teks zoom Atribut:

p.a {
  zoom: normal;
}
p.b {
  zoom: 150%;
}
p.c {
  zoom: 0.6;
}

Coba sendiri

Contoh 2

Gunakan zoom Pengaturan ukuran elemen atribut:

div {
  border-radius: 100%;
  background: #73AD21;
  padding: 20px;
  width: 80px;
  height: 80px;
}
div.a {
  zoom: normal;
}
div.b {
  zoom: 150%;
}
div.c {
  zoom: 0.6;
}

Coba sendiri

Sintaksis CSS

zoom: normal|%|number|unset|initial|inherit;

Nilai atribut

Nilai Deskripsi
normal Nilai default. Elemen diperkenalkan dengan cara normal.
%

Tentukan skala skala dalam bentuk persen.

100% = normal.

Untuk memperbesar, gunakan nilai lebih besar dari 100%.

Untuk memperkecil, gunakan nilai kurang dari 100%.

number

Tentukan skala skala dalam bentuk angka (persen).

1.0 = normal.

Untuk memperbesar, gunakan nilai lebih besar dari 1.0.

Untuk memperkecil, gunakan nilai kurang dari 1.0.

unset Batalkan pengaturan skala (kembalikan ke normal).
initial Atur atribut ini ke nilai default. Lihat initial.
inherit Mengambil atribut ini dari elemen induknya. Lihat inherit.

Detil teknis

Nilai default: normal
Inheritsi: Tidak
Produksi animasi: Dukungan. Lihat:Atribut yang berhubungan dengan animasi.
Versi: Modul Viewport CSS Level 1
Sintaksis JavaScript: object.style.zoom = "3"

Dukungan browser

Angka di tabel menunjukkan versi browser yang sepenuhnya mendukung atribut ini.

Chrome Edge Firefox Safari Opera
1 12 126 3.1 15.0