La zoompropriété en CSS vous permet de mettre à l'échelle votre contenu. Il n'est pas standard et a été implémenté à l'origine uniquement dans Internet Explorer. Bien que plusieurs autres navigateurs prennent désormais en charge le zoom, il n'est pas recommandé pour les sites de production.
.zoom ( zoom: 150%; )Les valeurs «prises en charge:» sont:
percentage- Échelle de ce pourcentagenumber- Conversion en pourcentage et échelle - 1 == 100%; 1,5 = = 150%;normal- zoom: 1;
Si votre navigateur le prend en charge, vous verrez ces images sous différentes tailles:
Le zoom est une vieille chose IE. Ce n'est pas quelque chose que vous devriez utiliser sur les sites en direct. Si vous souhaitez mettre à l'échelle le contenu, utilisez les transformations CSS. Vous pouvez également utiliser des filtres si vous avez besoin du support oldIE.
À l'époque d'IE6, le zoom était principalement utilisé comme un hack. De nombreux bogues de rendu dans IE6 et IE7 pourraient être corrigés à l'aide du zoom. Par exemple, display: inline-blockcela ne fonctionnait pas très bien dans IE6 / 7. Le réglage a zoom: 1résolu le problème. Le bogue était lié à la façon dont IE rendait sa mise en page. Le paramètre a zoom: 1activé une propriété interne appelée hasLayout, qui a résolu le problème.
Prise en charge du navigateur
| Chrome | Safari | Firefox | Opéra | C'EST À DIRE | Android | iOS |
|---|---|---|---|---|---|---|
| Tout | 4.0+ | Aucun | Aucun | 5.5+ | À déterminer | À déterminer |
Safari prend également en charge zoomdepuis la version 4. Cependant, il a ajouté une nouvelle valeur: reset. Cela indique au navigateur de ne pas zoomer sur votre élément lors du zoom. Donc, votre cmd / ctrl +? Cela ne fonctionne pas sur les éléments avec zoom: resetappliqué.