CSS zoom egenskap

Definition och användning

zoom Egenskapen specificerar skalningsförhållandet för elementet. Elementet kan förstöras eller förminska.

Exempel

Exempel 1

För text zoom Egenskap:

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

Prova själv

Exempel 2

Använd zoom Egenskapsjustering av elementstorlek:

div {
  rundkant: 100%;
  bakgrund: #73AD21;
  marginal: 20px;
  bredd: 80px;
  höjd: 80px;
}
div.a {
  zoom: normal;
}
div.b {
  zoom: 150%;
}
div.c {
  zoom: 0.6;
}

Prova själv

CSS-syntax

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

Egenskapsvärde

Värde Beskrivning
normal Standardvärde. Element renderas i normalt läge.
%

Ange skalningsförhållandet i procent.

100% = Normal.

För att förstora, använd värden större än 100%.

För att förminska, använd värden mindre än 100%.
number

Ange skalningsförhållandet i numerisk form (procent).

1.0 = Normal.

För att förstora, använd värden större än 1.0.

För att förminska, använd värden mindre än 1.0.
unset Annullera inställningen av skalningsförhållandet (återställ till normal).
initial Sätt detta egenskap till dess standardvärde. Se: initial.
inherit Inhärta detta egenskap från föräldrelementet. Se: inherit.

Tekniska detaljer

Standardvärde: normal
Arvande: Nej
Animaationsproduktion: Stöd. Se:Animaationsrelaterade egenskaper.
Version: CSS Viewport Modul Nivå 1
JavaScript-syntax: object.style.zoom = "3"

Webbläsarstöd

Tabellens siffror anger den första webbläsaren som helt stöder detta egenskap.

Chrome Edge Firefox Safari Opera
1 12 126 3.1 15.0