Pourquoi les proportions des images SVG sont-elles biaisées dans l'élément `` d'IE9 ?

IE9 incline les proportions de l'image SVG dans Élément

Lors de l'utilisation de CSS pour définir la hauteur maximale d'une image SVG dans un élément, on s'attend à ce que l'image soit mise à l'échelle proportionnellement à cette hauteur. Cependant, dans IE9, certaines images SVG peuvent présenter des proportions déformées.

Plus précisément, le problème se pose avec les SVG composés de polygones plutôt que de chemins. Un exemple d'image concernée est le SVG « crocs » de Radiant Interactive : http://www.radiantinteractive.com/rs/images/allies/other/crocs.svg

Pour résoudre cette incohérence entre les navigateurs, il est recommandé de toujours définir une viewBox pour les images SVG, tout en omettant les attributs width et height du champ

Pour démontrer l'impact des différents attributs SVG, une page de test a été créée :

[Lien de la page de test]

En comparant les résultats dans différents navigateurs, on peut observer des variations significatives dans la gestion des images basées sur la combinaison des attributs SVG et des dimensions CSS.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!