SVG linearGradient不显示路径（多浏览器）

我不明白为什么此渐变不适用于Chrome/Firefox/IE。SVG linearGradient不显示路径（多浏览器）

它在svg编辑器（浏览器内）和Inkscape中工作。

<?xml version="1.0" encoding="UTF-8" standalone="no"?> 

<svg xmlns="http://www.w3.org/2000/svg" height="300" width="85" version="1.1"> 
<defs> 
    <linearGradient id="fill_bg" x2="0.5"> 
    <stop stop-color="#8e8e8e" offset="0"/> 
    <stop stop-color="#d6d6d6" offset="0.59766"/> 
    </linearGradient> 
</defs> 
<g> 
    <path d="m3.5,16.5c12.5,6.6507,21,6.6507,33,0v271.47c-12.5,7.1172-22,7.1172-33,0v-135.74-135.73,0.00002,0.00001,0.00002,0.00001z" stroke="#352c2c" fill="url(#fill_bg)"/> 
</g> 
</svg>

的行程显示正确，但将填充缺少完全（透明），

难道我用的东西，浏览器不支持？

来源

2013-03-18 Hendrik

我在这里引用你的问题：http://stackoverflow.com/questions/38803429/gradient-of-svg-in-html-page-not-working ---也许你有一个想法？ – sasha 2016-08-06 10:51:02

对不起，我从来没有为所有路径元素定义CSS。

一旦我删除，一切正常。

来源

2013-03-18 21:39:16 Hendrik

哪些定义是那些？你自己或从自举或某事？在我的情况下梯度不是工作太多，但我不认为我有路径或svg元素的CSS样式。至少不能找到他们<:-) – sasha 2016-08-06 10:53:49

我使用Chrome 53.0.2785.143（64位）。 SVG中的线性渐变不起作用。奇怪的是，在我们的生产环境中，Chrome正在添加一个云端地址，其中线性渐变ID正在被引用。必须是一个错误。因此，填充线性渐变的位置，即：fill ='url（％23linearGrad）'，线性渐变的id为'linearGrad'，Chrome会添加fill ='url（// d1cop1ikja3jwt.cloudfront.net'奇怪。 – 2016-10-18 01:17:05

SVG linearGradient不显示路径（多浏览器）

回答

相关问题