首页 > web前端 > css教程 > 为什么我的 SVG 在 Internet Explorer 中无法正确缩放,如何修复它?

为什么我的 SVG 在 Internet Explorer 中无法正确缩放,如何修复它?

Patricia Arquette
发布: 2024-12-10 01:11:10
原创
770 人浏览过

Why Aren't My SVGs Scaling Properly in Internet Explorer, and How Can I Fix It?

SVG 在 IE 中无法正确缩放

为什么会发生这种情况?

IE 有一个已知错误,如果两者都无法正确缩放 SVG宽度和高度未明确指定。

如何修复它?

为了解决 IE 中的这个问题,可以采用 Nicolas Gallagher 发现的一个技巧。该技术利用了。元素,IE 可以正确缩放。通过放置一个

<div> 中的 SVG 具有相同的纵横比包含 SVG,它强制 SVG 以正确的尺寸渲染。

实现

这里是带有 的更新代码窍门:

<div>
登录后复制

自定义样式

要正确定位元素,请添加以下 CSS:

canvas {
    display: block;
    width: 100%;
    visibility: hidden;
}

svg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}
登录后复制

通过这些调整,SVG 应在 Internet 中正确缩放探索者。

以上是为什么我的 SVG 在 Internet Explorer 中无法正确缩放,如何修复它?的详细内容。更多信息请关注PHP中文网其他相关文章!

来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门推荐
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板