我的模式在Firefox中不可见:
顶部:Chrome浏览器
底部:Firefox
Svg代码(但请稍等一下以查看图片)
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" enable-background="new 0 0 120 120" version="1.1" viewBox="0 0 120 120" xml:space="preserve">
<style type="text/css">
.st0{fill:none;}
.st1{opacity:0.48;}
.st2{fill:#FFF99A;}
.st5{fill:url(#a);stroke:#007BFF;stroke-width:0.5;stroke-miterlimit:10;}
</style>
<pattern id="b" y="120" width="200" height="200" overflow="visible" patternUnits="userSpaceOnUse" viewBox="0 -200 200 200">
<rect class="st0" y="-200" width="200" height="200"/>
<rect class="st0" y="-200" width="200" height="200"/>
<g class="st1">
<rect class="st2" y="-100" width="200" height="100"/>
</g>
<g class="st1">
<rect class="st2" x="100" y="-200" width="100" height="200"/>
</g>
</pattern>
<pattern id="a" xlink:href="#b" patternTransform="matrix(.014142 -.014142 -.014142 -.014142 -16028 -559.29)">
</pattern>
<path class="st5" d="m87.5 87.5v23.1c0 3.5-2.6 6.4-6.1 6.8-21.7 2.6-42.3 0-50.3-1.2-2.1-0.3-3.6-2.1-3.6-4.2 0-5.6 0.1-16.7 0.5-24.4h23.5"/>
</svg>
知道为什么吗?
我找到了这个question,但实际上并没有任何改变。
答案 0 :(得分:1)
我已经删除了模式#a
,现在它也适用于FF
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" enable-background="new 0 0 120 120" version="1.1" viewBox="0 70 120 65" xml:space="preserve">
<style type="text/css">
.st0{fill:none;}
.st1{opacity:0.48;}
.st2{fill:#FFF99A;}
.st5{fill:url(#b);stroke:#007BFF;stroke-width:0.5;stroke-miterlimit:10;}
</style>
<pattern id="b" y="120" width="200" height="200" overflow="visible" patternUnits="userSpaceOnUse" viewBox="0 0 200 200" patternTransform="matrix(.014142 -.014142 -.014142 -.014142 -16028 -559.29)">
<rect class="st0" width="200" height="200"/>
<rect class="st0" width="200" height="200"/>
<g class="st1">
<rect class="st2" y="100" width="200" height="100"/>
</g>
<g class="st1">
<rect class="st2" x="100" width="100" height="200"/>
</g>
</pattern>
<path class="st5" d="m87.5 87.5v23.1c0 3.5-2.6 6.4-6.1 6.8-21.7 2.6-42.3 0-50.3-1.2-2.1-0.3-3.6-2.1-3.6-4.2 0-5.6 0.1-16.7 0.5-24.4h23.5"/>
</svg>