SVG 元素

SVG 元素用于向 SVG 文档中添加图像，并将其嵌入到 SVG 绘图中。

语法

<image xlink:href="url" x="0" y="0" width="100" height="100" />

属性

• xlink:href：必需。指定图像的 URL。
• x：可选。定义图像左上角的横坐标位置。默认值为 0。
• y：可选。定义图像左上角的纵坐标位置。默认值为 0。
• width：可选。定义图像的宽度。默认值为 0。
• height：可选。定义图像的高度。默认值为 0。

实例

<svg width="400" height="500">
  <image xlink:href="https://picsum.photos/id/1015/400" x="0" y="0" width="400" height="500" />
</svg>

上面的代码将在 SVG 绘图区域内显示一张 400x500 的图片。图片的 URL 通过 xlink:href 属性指定。

注意事项

• 图像的 URL 可以是远程地址，也可以是本地地址。
• 如果图像的宽度和高度都是 0，则图像不会被显示。

参考链接

• MDN Web 文档