為什麼我的 SVG 在 IE9 中縮放不正確，但只有部分縮放？

IE9 中特定影像的 SVG 比例扭曲

在 img 元素中使用 SVG 時，您可能會遇到意外的縮放問題。在 Internet Explorer 9 中，某些 SVG 可能無法正確縮放，無法保持其原始比例。儘管透過 CSS 指定了 max-height，這種情況仍可能發生。

使用由路徑與多邊形組成的 SVG 時會出現差異。例如，問題中提到的“crocs.svg”圖像無法正確縮放，而“groovy.svg”圖像則可以。

解決方案：確保ViewBox 並省略元素寬度/高度屬性

要解決此問題並確保跨瀏覽器的縮放一致，建議始終在SVG 元素中指定viewBox 屬性。但是，請將寬度和高度屬性留空。

透過這樣做，您可以明確定義 SVG 的尺寸，並允許瀏覽器相應地解釋 CSS max-height 屬性。它確保在各種瀏覽器之間的縮放更加一致。

要進一步了解，請參閱此測試頁面：[測試頁面連結]。本頁提供了 SVG 屬性與 CSS 寬度和高度規格結合的各種範例。透過比較不同瀏覽器中的縮放比例，可以觀察到這些屬性對 SVG 渲染的影響。

以上是為什麼我的 SVG 在 IE9 中縮放不正確，但只有部分縮放？的詳細內容。更多資訊請關注PHP中文網其他相關文章！