幅 100px の div 内に含まれる埋め込み SVG をスケーリングしようとしていますが、この SVG は-webkit-transform: scale(2)その div に適用することによってスケーリングされます。デスクトップでは、Chrome と Safari の両方で、SVG は元のサイズの 2 倍 (つまり 200px) に正しくスケーリングされます。ただし、iPad (Mobile Safari) と Android の既定のブラウザーでは、SVG は元のサイズの 4 倍 (つまり 400px) に誤って拡大されます。
同様に、scale(0.5) を使用すると、デスクトップ ブラウザーは SVG を元のサイズの半分 (つまり 50px) に正しくスケーリングしますが、前述のモバイル ブラウザーは SVG を元のサイズの 4 分の 1 (つまり 25px) にスケーリングします。
ビューポートを（経由で<meta name="viewport" content="...">）設定しようとしましたが、この動作は修正されませんでした。同様に、SVG のviewbox属性は正しく設定されており、影響を受けません。
ただし、<embed src=>、<iframe src=>、および<object data=>タグを介して SVG を埋め込むと、モバイル デバイスではこの望ましくない動作が発生しますが、モバイル デバイスでは<img src=>完全にスケーリングされます<img src=>が、それ自体に一連の問題が発生するため、特に注意してください。それ。
誰もこのようなことを経験しましたか? それは奇妙でおそらくニッチな質問ですが、誰かがこれに何度か遭遇したに違いないと思います。