為什麼我的 SVG 影像在 IE9 中會變形？ ViewBox 的作用和一致的縮放。

IE9 中的SVG 影像比例和ViewBox 的作用

在 中使用SVG 影像時元素，期望在縮放時保持影像的自然比例。但是，在 IE9 中，此行為可能會因 SVG 檔案的結構而異。

問題：
某些SVG，特別是由多邊形組成的SVG，無法在IE9 中按比例縮放當包含在 中時設定了max-height CSS屬性的元素。這會導致影像拉伸或扭曲。

原因：
包含多邊形和路徑的 SVG 之間的縮放行為差異歸因於視圖中是否存在 viewBox 屬性。 SVG 檔案。

解決方案：
為了確保跨瀏覽器的一致縮放，建議始終在 SVG 檔案中指定 viewBox 屬性。此屬性定義 SVG 影像的座標空間。透過保留

範例：
以下程式碼示範了此解決方案：

<code class="xml"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200">
<polygon points="..." />
</svg></code>

透過合併viewBox、IE9 和其他瀏覽器一致地縮放SVG 映像，同時保持其縱橫比，無論是否存在多邊形或路徑。

以上是為什麼我的 SVG 影像在 IE9 中會變形？ ViewBox 的作用和一致的縮放。的詳細內容。更多資訊請關注PHP中文網其他相關文章！