Mit der zoomEigenschaft in CSS können Sie Ihren Inhalt skalieren. Es ist kein Standard und wurde ursprünglich nur in Internet Explorer implementiert. Obwohl einige andere Browser jetzt das Zoomen unterstützen, wird es für Produktionsstandorte nicht empfohlen.
.zoom ( zoom: 150%; )Die "unterstützten: Werte" sind:
percentage- Skalieren Sie um diesen Prozentsatznumber- In Prozent umrechnen und skalieren - 1 == 100%; 1,5 = 150%;normal- Zoom: 1;
Wenn Ihr Browser dies unterstützt, werden diese Bilder in verschiedenen Größen angezeigt:
Zoom ist eine alte IE-Sache. Es ist nicht etwas, das Sie auf Live-Sites verwenden sollten. Wenn Sie Inhalte skalieren möchten, verwenden Sie CSS-Transformationen. Sie können auch Filter verwenden, wenn Sie OldIE-Unterstützung benötigen.
In den Tagen von IE6 wurde Zoom hauptsächlich als Hack verwendet. Viele der Rendering-Fehler in IE6 und IE7 konnten mithilfe von Zoom behoben werden. Als Beispiel hat display: inline-blockes in IE6 / 7 nicht sehr gut funktioniert. Die Einstellung hat zoom: 1das Problem behoben. Der Fehler hatte damit zu tun, wie der IE sein Layout gerendert hat. Durch die Einstellung zoom: 1wurde eine interne Eigenschaft namens hasLayout aktiviert, mit der das Problem behoben wurde.
Browser-Unterstützung
| Chrom | Safari | Feuerfuchs | Oper | IE | Android | iOS |
|---|---|---|---|---|---|---|
| Irgendein | 4.0+ | Keiner | Keiner | 5,5+ | TBD | TBD |
Safari unterstützt auch zoomseit Version 4. Es hat jedoch einen neuen Wert hinzugefügt : reset. Das weist den Browser an, Ihr Element beim Zoomen nicht zu zoomen. Also dein cmd / ctrl +? Es funktioniert nicht bei Elementen mit zoom: resetangewendet.