CSS zoom egenskab

Definition og brug

zoom Egenskaben specificerer elementets skalaforhold. Elementet kan forstørres eller formindskes.

Eksempel

Eksempel 1

Brug på tekst zoom Egenskab:

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

Prøv det selv

Eksempel 2

Brug zoom Egenskabsjustering af elementstørrelse:

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;
}

Prøv det selv

CSS-syntaks

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

Egenskabsværdi

Værdi Beskrivelse
normal Standardværdi. Elementet renderes i normal måde.
%

Specificer skalaforhold i procent.

100% = Normal.

For at forstørre, brug værdier større end 100%.

For at formindske, brug værdier mindre end 100%.
number

Specificer skalaforhold i numerisk form (procent).

1.0 = Normal.

For at forstørre, brug værdier større end 1.0.

For at formindske, brug værdier mindre end 1.0.
unset Annuller indstilling af skalaforhold (genvind normal).
initial Sæt denne egenskab til dens standardværdi. Se: initial.
inherit Arv denne egenskab fra sin forældrelige element. Se: inherit.

Tekniske detaljer

Standardværdi: normal
Arv: Nej
Animationsproduktion: Understøttet. Se:Animationsrelaterede egenskaber.
Version: CSS Viewport Module Level 1
JavaScript-syntaks: object.style.zoom = "3"

Browser-understøttelse

Tabelens tal angiver den første browserversion, der fuldt ud understøtter egenskaben.

Chrome Edge Firefox Safari Opera
1 12 126 3.1 15.0