首頁 >web前端 >css教學 >為什麼我的 SVG 在 Internet Explorer 中無法正確縮放?

為什麼我的 SVG 在 Internet Explorer 中無法正確縮放?

Linda Hamilton
Linda Hamilton原創
2024-12-18 18:45:22789瀏覽

Why Aren't My SVGs Scaling Correctly in Internet Explorer?

SVG 在IE 中無法正確縮放- 有額外空間

問題:使用SVG 實現響應時,符號響應時,符號響應時, SVG 在Internet Explorer 中無法正確縮放(IE)。

答案: IE 有一個錯誤,除非指定寬度和高度,否則 SVG 無法正確縮放。

解決方案:

使用尼古拉斯發現的技巧加拉格爾:

  1. 增加一個與SVG 與<div> 具有相同縱橫比的元素包含SVG。
  2. 使 不可見且可見:隱藏。
  3. 將 SVG 絕對定位在 <div> 內。並將其寬度設為 100%。

    代碼:

    <div>

    CSS:

    canvas {
        display: block;
        width: 100%;
        visibility: hidden;
    }
    
    svg {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
    }

    CSS:

    CSS: 這個技巧會強制IE 縮放SVG正確使用作為參考。

以上是為什麼我的 SVG 在 Internet Explorer 中無法正確縮放?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

css for using this position canvas bug
陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
上一篇:為什麼我的 CSS 轉換邊框在 Chrome 中呈現鋸齒狀,如何修復它們?下一篇:為什麼我的 CSS 轉換邊框在 Chrome 中呈現鋸齒狀,如何修復它們?

相關文章

看更多