SVG<defs>元素用于嵌入可在SVG镜像内重用的定义。例如，我们可以将SVG形状分组在一起，然后将其作为单个形状重复使用。

defs示例

这是一个简单的<defs>元素示例：

<svg>
    <defs>
        <g>
            <rect x="100" y="100" width="100" height="100" />
            <circle cx="100" cy="100" r="100" />
        </g>
    </defs>
</svg>

在<defs>元素内定义的形状不会显示在SVG图像中。在显示它们之前，必须使用<use>元素对其进行引用。这是一个例子：

<svg>
  <defs>
    <g id="shape">
        <rect x="50" y="50" width="50" height="50" />
        <circle cx="50" cy="50" r="50" />
    </g>
  </defs>

  <use xlink:href="#shape" x="50" y="50" />
  <use xlink:href="#shape" x="200" y="50" />

</svg>

在引用<g>元素之前，必须通过其id属性设置ID。 " <use>"元素通过其" xlink：href"属性引用" <g>"元素。注意属性值中ID前面的"#"。

" <use>"元素通过其" x"和" y"属性指定在何处显示重复使用的形状。请注意，元素<g>中的形状位于0,0。这样做是因为它们的位置已添加到<use>元素中指定的位置。

这是结果图像：

蓝点不是示例的一部分。它们被添加以显示两个<use>元素的x和y。

可以在defs元素内定义哪些元素？

我们可以将以下元素放入<defs>元素中：

• 任何形状元素(" rect"，" line"等)
• g
• symbol（符号）