黄釉!
在Firefoxy中对SVG文本元素使用高斯模糊滤镜时,我有一个奇怪的现象。我尝试在网上搜索解决方案,但我甚至无法找到任何提及此问题的内容。这是一个可重复的示例(以及JSFiddle):
<svg id="svg1" width="100%" height="1000" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" >
<defs>
<filter id="filterBlur">
<feGaussianBlur in="SourceGraphic" stdDeviation="3" result="blurOut" />
<feBlend in="SourceGraphic" in2="blurOut" />
</filter>
</defs>
<text class="link" x="100" y="100">Hello World</text>
</svg>
和CSS
body {background-color:black;}
text {
font-family: "Arial";
fill: white;
}
.link {
font-size: 20px;
opacity: 0.90;
letter-spacing: 3px;
font-weight: bold;
filter: url(#filterBlur);
}
我尝试了几种字体,但它们都呈现出相同的绿色光芒。在Chrome中,模糊效果很好。有什么想法吗?
d