我的 HTML 文档中有两个 SVG 结构。比如说,
<svg width="8cm" height="3cm"
xmlns="http://www.w3.org/2000/svg" version="1.1">
<desc>Local URI references within ancestor's 'defs' element.</desc>
<defs>
<linearGradient id="Gradient01">
<stop offset="20%" stop-color="#39F" />
<stop offset="90%" stop-color="#F3F" />
</linearGradient>
</defs>
<rect x="1cm" y="1cm" width="6cm" height="1cm" fill="url(#Gradient01)" />
</svg>
和
<svg width="8cm" height="3cm"
xmlns="http://www.w3.org/2000/svg" version="1.1">
<defs>
<linearGradient id="Gradient01">
<stop offset="20%" stop-color="#85F" />
<stop offset="90%" stop-color="#35F" />
</linearGradient>
</defs>
<rect x="10cm" y="10cm" width="60cm" height="10cm" fill="url(#Gradient01)" />
</svg>
尽管在两个 SVG 结构中都有一个 ID 为“Gradient01”的“linearGradient 标签”,但第二个 SVG 结构的矩形也遵循第一个的“linearGradient”。(因为它在整个文档中搜索 id)
无论如何,它总是只在那个 SVG 结构中链接。(因为在我的情况下,我无法更改 ID)