Atributo CSS zoom

Definición y uso

zoom El atributo especifica la proporción de escala del elemento. El elemento puede ser ampliado o reducido.

Ejemplo

Ejemplo 1

Para texto zoom Atributo:

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

Pruebe usted mismo

Ejemplo 2

Usar zoom Ajuste de propiedades del elemento para cambiar el tamaño:

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

Pruebe usted mismo

Sintaxis CSS

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

Valor del atributo

Valor Descripción
normal Valor predeterminado. El elemento se renderiza de manera normal.
%

Especifique la proporción de escala en porcentaje.

100% = Normal.

Para ampliar, use valores mayores del 100%.

Para reducir, use valores menores del 100%.

number

Especifique la proporción de escala en forma numérica (porcentaje).

1.0 = Normal.

Para ampliar, use valores mayores de 1.0.

Para reducir, use valores menores de 1.0.

unset Deshabilite la proporción de escala (restaurar a normal).
initial Establezca esta propiedad en su valor predeterminado. Vea initial.
inherit Hereda esta propiedad del elemento padre. Vea inherit.

Detalles técnicos

Valor predeterminado: normal
Herencia: No
Producción de animación: Compatibilidad. Consulte:Propiedades relacionadas con la animación.
Versión: Módulo de Viewport CSS Nivel 1
Sintaxis de JavaScript: object.style.zoom = "3"

Compatibilidad del navegador

La tabla de números representa la versión del navegador que admite completamente esta propiedad por primera vez.

Chrome Edge Firefox Safari Opera
1 12 126 3.1 15.0