Firefox 34.0.5和IE 11中未呈现SVG

Question

我正在使用许多SVG元素的网站上工作。 现在，我最近看到元素在Chrome版本39.0.2171.95 m和Opera中呈现。 但是，Firefox 34.0.5版和Internet Explorer 11并非如此。我已经检查了此答案

SVG无法在Firefox中正确呈现 ，

根据上面的答案，它说这是FF 16中的错误，但是他们已经在FF的最新版本中甚至在IE11中都解决了它，就我的研究而言，SVG并不是IE11的问题。 现在奇怪的是，所有简单的SVG文件都被渲染了，但是复杂的矢量文件（例如iPhone 5的矢量）并不是仅在IE和FF中渲染的。 以下是无法在FF或IE中运行的SVG：

<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 width="210px" height="211.5px" viewBox="0 0 210 211.5" style="enable-background:new 0 0 210 211.5;" xml:space="preserve">

<style type="text/css">
.st0{fill:#FF5200;}
.st1{fill:none;stroke:#FF5200;stroke-width:7;stroke-miterlimit:10;}
</style>

<filter id="drop">
   <feOffset result = "offOut" in = "#ff5500" dx = "0" dy = "0"/>
   <feGaussianBlur result = "blurOut" in = "offOut" stdDeviation = "4"/>
    <feBlend in = "SourceGraphic" in2 = "blurOut" mode = "normal"/>
</filter>

<g id="bolt">
<polygon filter="url(#drop)" class="st0" points="138.1,42.5 63.9,116.3 105.2,116.3 70.2,172.3 146.3,98.5 105.1,98.5     "/>

单击此小提琴，以便您可以更好地了解此问题。

我在Illusrator CS6中创建了SVG。 所以我的问题是这里有什么现象？ 我在这里做什么错？ 这是IE和FF中的错误吗？ 我使用SVG是因为我想合并一些SVG动画。 是否有解决此问题的好方法？ 我可以就此特定问题获得一些好的资源吗？ 如果此信息不足，我深表歉意，因为我是SVG动画的初学者，因此我处于学习阶段，因此愿意接受各种建议，批评等。 如果需要任何其他信息，请告诉我，我会回复。

编辑：请检查FF，IE和Chrome中的小提琴 ，以查看区别。

谢谢你的帮助 ！

Answer 1

这是因为您的过滤器：
将此行<feOffset result = "offOut" in = "#000000" dx = "0" dy = "10"/>更改为这<feOffset result = "offOut" in = "SourceGraphic" dx = "0" dy = "10"/>

它将起作用。

您是在告诉滤镜使用颜色而不是滤镜基色（请检查http://www.w3.org/TR/SVG/filters.html#FilterPrimitiveInAttribute ）

更新小提琴