image

该<image>SVG元素包括SVG文档内的图像。它可以显示光栅图像文件或其他SVG文件。

唯一的图像格式SVG软件必须支持JPEG，PNG和其他SVG文件。动画GIF的行为是未定义的。

显示的SVG文件<image>被视为图像：不加载外部资源，：未应用已访问的样式，它们不能交互。要包含动态SVG元素，请使用外部URL <use>。包括SVG文件，并在其内部运行的脚本，尝试<OBJECT>里面的<foreignObject>。

注意：在解析HTML时，HTML规范定义<image>为<img>的同义词。此特定元素及其行为仅适用于SVG文档或内联SVG。

用法上下文

属性

全局属性

• Conditional processing attributes

• Core attributes

• Graphical event attributes

• Presentation attributes

• Xlink attributes

• class

• style

• externalResourcesRequired

• transform

具体属性

• x: Positions the image horizontally from the origin.

• y: Positions the image vertically from the origin.

• width: The width the image renders at. Unlike HTML's <img>, this attribute is required.

• height: The height the image renders at. Unlike HTML's <img>, this attribute is required.

• xlink:href: Points at a URL for the image file.

• preserveAspectRatio: Controls how the image is scaled.

DOM接口

<image>实现SVGImageElement界面。

例

Basic rendering of a PNG image in SVG:

<svg viewBox="0 0 100 100"
     xmlns="http://www.w3.org/2000/svg" 
     xmlns:xlink="http://www.w3.org/1999/xlink">       
  <image href="https://mdn.mozillademos.org/files/6457/mdn_logo_only_color.png" height="100" width="100"/>    
</svg>

​

产品规格

浏览器兼容性