SVG渐变在主页以外的页面上不起作用

这是相当令人费解的。我从图标字体改为使用

页面的徽标中有渐变

所有的一切都很顺利，直到我转到网站的其他页面时，徽标中的渐变消失了

该徽标是在Illustrator中创建的，一旦在grunt svgstore中运行，就会输出以下内容：

<svg xmlns="http://www.w3.org/2000/svg">
    <defs>
        <linearGradient id="logo-gradient" gradientUnits="userSpaceOnUse" x1="-263.1675" y1="145.0012" x2="-263.1675" y2="239.8049" gradientTransform="matrix(1 0 0 -1 304 239.8052)">
            <stop offset="0" style="stop-color:#223A9A" />
            <stop offset="1" style="stop-color:#2196F3" />
        </linearGradient>
    </defs>
    <symbol viewBox="0 0 418.042 94.805" id="svg-logo">
        <title>logo</title>
        <g id="logo-symbol">
            <path fill="url(#logo-gradient)" d="M81.347,0.523c-0. ..." />
        </g>
        <g id="logo-text">
            <g>
                <path fill="#FFFFFF" d="M113.23,42.32l2.185-13.941H79. ..." />
            </g>
        </g>
    </symbol>
</svg>

标志

然后，我将以以下方式使用此svg：

<a href="/" class="logo"><svg><use xlink:href="#svg-logo"></use></svg></a>

---

欢迎任何输入。

您的html页面是否有

元素。如果是这样的话，那就是问题的根源。聪明的罗伯特！明白了！：）