image

<image>

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

唯一的图像格式SVG软件必须支持JPEGPNG和其他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>

产品规格

SpecificationStatusComment
Scalable Vector Graphics (SVG) 2The definition of '<image>' in that specification.Candidate RecommendationAllows omitting height and width
Scalable Vector Graphics (SVG) 1.1 (Second Edition)The definition of '<image>' in that specification.RecommendationInitial definition

浏览器兼容性

FeatureChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support1.0(Yes)1.5 (1.8)9.08.03.0.4

FeatureAndroidEdgeFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
Basic support3.0(Yes)1.0 (1.8)1No support(Yes)3.0.4