La zoom
propiedad en CSS le permite escalar su contenido. No es estándar y se implementó originalmente solo en Internet Explorer. Aunque varios otros navegadores ahora admiten el zoom, no se recomienda para sitios de producción.
.zoom ( zoom: 150%; )
Los valores “admitidos: son:
percentage
- Escalar por este porcentajenumber
- Convertir a porcentaje y escala - 1 == 100%; 1,5 == 150%;normal
- zoom: 1;
Si su navegador lo admite, verá estas imágenes en diferentes tamaños:
¡Mira este bolígrafo!
Zoom es una vieja cosa de IE. No es algo que deba usar en sitios activos. Si desea escalar el contenido, use CSS Transforms. También puede usar filtros si necesita soporte antiguo.
En los días de IE6, el zoom se usaba principalmente como un truco. Muchos de los errores de renderizado tanto en IE6 como en IE7 podrían solucionarse con el zoom. Como ejemplo, display: inline-block
no funcionó muy bien en IE6 / 7. La configuración zoom: 1
solucionó el problema. El error tenía que ver con la forma en que IE representaba su diseño. La configuración zoom: 1
activó una propiedad interna llamada hasLayout, que solucionó el problema.
Soporte del navegador
Cromo | Safari | Firefox | Ópera | ES DECIR | Androide | iOS |
---|---|---|---|---|---|---|
Alguna | 4.0+ | Ninguno | Ninguno | 5.5+ | TBD | TBD |
Safari también soporta zoom
desde la versión 4. Sin embargo, se añade un nuevo valor: reset
. Eso le dice al navegador que no haga zoom en su elemento. Entonces, ¿su cmd / ctrl +? No funciona en elementos con zoom: reset
aplicado.