IE9 で一部の SVG 画像が不均衡に拡大縮小するのはなぜですか?

IE9 での SVG 画像のスケーリングの問題への対処

特定の SVG 画像は、幅が存在しない場合でも、img 要素内で指定された最大高さに比例して拡大縮小できません。この不均衡なアップスケーリングは、パスを使用して作成された SVG ではなく、ポリゴンで構成される SVG に主に影響を与えることが観察されています。

不一致について

この不一致は、viewBox 属性の処理における標準化の欠如に起因します。 viewBox は SVG コンテンツの座標と寸法を明示的に定義し、適切にスケーリングできるようにします。ただし、ブラウザは viewBox を異なる方法で解釈します。

影響を受ける例では、SVG に viewBox 属性がありません。したがって、IE9 はスケーリングのために (画像要素ではなく) SVG 要素の幅と高さのプロパティを解釈し、不均衡なアップスケーリングを引き起こします。

問題の解決

ブラウザ間で一貫したスケーリングを確保するには、SVG 要素から幅と高さの属性を省略しながら、SVG 画像に viewBox を指定していることを確認してください。このアプローチはブラウザーに明示的なガイダンスを提供し、IE9 の不均衡なスケーリングにつながる不確実性を排除します。

以上がIE9 で一部の SVG 画像が不均衡に拡大縮小するのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。