CSS:
img{
max-height:30px;
}
HTML:
<img src="foo.svg" />
我正在寻找这个 svg 图像按比例缩放到最大高度 30 像素高。 svg 的自然尺寸为 200 像素 x 200 像素。在 FF 和 Chrome (30x30) 中效果很好，但在 IE9 中图像为 30x200。现在最关键的是。这只发生在某些 SVG 文件中，其他 svgs 可以正确缩放。
看起来区别在于一个是由多边形组成的，另一个是由路径组成的。
无法正确缩放：
http://www.radiantinteractive.com/rs/images/allies/other/crocs.svg
是否正确缩放：
知道为什么会发生这种情况，或者如何让第一个在 ie9 中按比例缩放？
为了在浏览器之间获得更一致的缩放，请始终确保指定viewBox但不要width and height你的属性svg元素。我有创建了一个测试页面用于比较指定不同 SVG 属性与 CSS 中指定的宽度和高度相结合的效果。在几个不同的浏览器中并排比较它，您会发现处理上有很多差异。