好的,开始吧:
这是我的网页:http://ingenious.jit.su/themes
如果您在 firefox 中查看它,您会注意到六个白色面板中每个面板的右上角都有一个红色小图标 (svg)。如果您查看该图像,您会注意到它的原始大小是 640 x 480。它很小是因为有一个 css 规则更改了 img 标签的大小,其中引用了 svg。
错误在这里:IE9 没有根据 css 规则调整图标大小。它只是剪掉了它的左上角。如果您使用 IE9 开发人员工具调整 css 规则,您就会明白我的意思。
我四处搜寻并确认我一直在遵循大多数 svg 最佳实践,例如包括不只是 100% 的宽度和高度值,包括视口(viewport)等,但没有运气。 IE9 仍然通过裁剪而不是缩放来响应 css 规则。
任何帮助都会很棒!
更新 已修复!我很笨,我的视口(viewport)不见了。凌晨 3 点不再编码。
最佳答案
您是否链接了 svg? 例子
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
enter svg here
</svg>
我在 ie9 上遇到了很多 svg 问题:)
如果这有帮助,我在查看页面时遇到此错误
SCRIPT438:对象不支持属性或方法“addEventListener”
followbar.js,第 3 行字符 3
这是我在评论中谈论的两个点的一个更好的例子
<img class="theme-icon" id="/recruitment-and-retention" src="../images/recruitment-and-retention.svg"/>
关于css - svg 无法在 ie9 中使用 css 调整大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16019574/