Question

我有一个外部SVG图像，它不会在IE11中保持宽高比。

.container {
  width: 400px;
  height: 400px;
  display: block;
  border: 1px solid blue;
}
img {
  max-height: 200px;
  border: 1px solid red;
}

<div class="container">
  <img src="http://www.wikipathways.org/wpi/wpi.php?action=downloadFile&type=svg&pwTitle=Pathway:WP3155_r80720" />
</div>

（https://jsfiddle.net/9q3cL4cs/7/）

问题是在IE11中宽度没有缩放以匹配最大高度。这在IE11中不起作用的原因是因为SVG图像没有定义视图框。

感谢任何解决方案！

Answer 1

转到图片的网址并下载。

在GIMP或Illustrator中打开图像，您可以获取SVG代码。

获取该代码并将其粘贴到您的HTML中。

然后使用视图框属性进行播放，直到获得正确的缩放。

此外，您现在可以更改SVG中的任何内容。

如果在容器div中使用SVG，则使用

非常有用

svg{
    width:100%;
    height:auto;
}

CSS中的

。

因为使用此规则SVG大小与其容器div连接。

根据我的经验，对于任何有关SVG的操作，使用普通的SVG XML代码总是总是。

在IE11中SVG图像严重缩放

1 个答案: