<image>

**<image>** SVG 元素在 SVG 文件中包含影像。它可以顯示 光柵影像 檔案或其他 SVG 檔案。

SVG 軟體必須支援的唯一影像格式是 JPEG、PNG 和其他 SVG 檔案。動畫 GIF 行為未定義。

使用 <image> 顯示的 SVG 檔案 被視為影像：不會載入外部資源，:visited 樣式 不會應用，它們也不能進行互動。要包含動態 SVG 元素，請嘗試使用 <use> 以及外部 URL。要包含 SVG 檔案並在其中執行指令碼，請嘗試在 <foreignObject> 中使用 <object>。

**注意：** HTML 規範將 <image> 定義為解析 HTML 時 <img> 的同義詞。此特定元素及其行為僅在 SVG 文件或內聯 SVG 中適用。

使用環境

類別圖形元素、圖形引用元素
允許的內容以下元素的任意數量，以任何順序
動畫元素
描述性元素

屬性

  • x：從原點水平定點陣圖像。
  • y：從原點垂直定點陣圖像。
  • width：影像渲染的寬度。與 HTML 的 <img> 不同，此屬性是必需的。
  • height：影像渲染的高度。與 HTML 的 <img> 不同，此屬性是必需的。
  • href 和 xlink:href ：指向影像檔案的 URL。
  • preserveAspectRatio：控制影像的縮放方式。
  • crossorigin：為 CORS 請求定義憑據標誌的值。
  • decoding：為瀏覽器提供提示，說明它應該同步或非同步執行影像解碼。

DOM 介面

<image> 實現 SVGImageElement 介面。

示例

在 SVG 中基本渲染 PNG 影像

SVG

html
<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg">
  <image href="mdn_logo_only_color.png" height="200" width="200" />
</svg>

結果

規範

規範
可縮放向量圖形 (SVG) 2
# ImageElement

瀏覽器相容性

BCD 表僅在瀏覽器中載入