Question

奇怪的是这个。

我有以下内容：

<svg aria-hidden="true">
   <use xlink:href="/assets/icons/utility-sprite/svg/symbols.svg#down"></use>
</svg>

<table>
    <tr>
        <td>
            <svg aria-hidden="true">
                <use xlink:href="/assets/icons/utility-sprite/svg/symbols.svg#close"></use>
            </svg>
        </td>
    </tr>
</table>

第一个图标未显示。但是，如果我将第一个的svg文件更改为：

<svg aria-hidden="true">
   <use xlink:href="/assets/icons/standard-sprite/svg/symbols.svg#down"></use>
</svg>

然后两个都显示，我在同一个文件中缺少SVG吗？

这绝对不是网址，因为如果两个<svg>标记使用相同的网址，则只会显示第二个网址。

非常感谢

Answer 1

希望这对所有新人都有帮助

这么多年之后，我偶然发现了同样的问题，我解决了它...... 对我来说发生的事情是我的路径的填充属性共享相同的 url(#paint0_linear) 和这些“填充”的视图框，其中设置在 DOM 中第一个 SVG 的位置，要解决这个问题，只需更改填充（及其对应的 id）后续 SSVG。

英语不是我的母语，所以让我告诉你我在代码中做了什么，以防我没有说清楚：

<svg width="32" height="24" viewBox="0 0 32 24" fill="none" xmlns="http://www.w3.org/2000/svg">
        <g id="hamb1">
          <path id="hambBottom1" fillRule="evenodd" clipRule="evenodd" d="M0 22" fill="url(#paint0_linear)"/>
          <path id="hambTop1" d="M13.8599" fill="url(#paint1_linear)"/>
        </g>
        <defs>
          <linearGradient id="paint0_linear" x1="-6.5" y1="30" x2="18.9429" y2="34.8415" gradientUnits="userSpaceOnUse">
            <stop stopColor="#134F82"/>
            <stop offset="1" stopColor="#2BA665"/>
          </linearGradient>
          <linearGradient id="paint1_linear" x1="-6.50012" y1="30" x2="18.9428" y2="34.8414" gradientUnits="userSpaceOnUse">
            <stop stopColor="#134F82"/>
            <stop offset="1" stopColor="#2BA665"/>
          </linearGradient>
        </defs>
      </svg>

检查路径上的 fill 属性NEVER 是否共享 相同的 ID。

Answer 2

我无法完全确定，因为我猜你应该正确解释问题，但可能是第一个文件路径可能不正确的情况（即使用链接＆＃34; / assets / icons / utility- sprite / svg / symbols.svg＃down＆＃34;）（即可能是一些拼写错误）所以文件没有加载。尝试使用url手动加载文件。

从同一个svg文件链接的SVG导致一个消失

2 个答案: