From 074785cea106179cb3305637055ab0a009ca74f2 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:42:52 -0500 Subject: initial commit --- files/pt-br/web/svg/element/image/index.html | 102 +++++++++++++++++++++++++++ 1 file changed, 102 insertions(+) create mode 100644 files/pt-br/web/svg/element/image/index.html (limited to 'files/pt-br/web/svg/element/image') diff --git a/files/pt-br/web/svg/element/image/index.html b/files/pt-br/web/svg/element/image/index.html new file mode 100644 index 0000000000..b14010b60c --- /dev/null +++ b/files/pt-br/web/svg/element/image/index.html @@ -0,0 +1,102 @@ +--- +title: image +slug: Web/SVG/Element/image +tags: + - Elemento + - Gráficos SVG + - Referencia + - SVG +translation_of: Web/SVG/Element/image +--- +
{{SVGRef}}
+ +

O elemento SVG <image> carrega imagens dentro de documentos SVG. Ele pode exibir arquivos {{glossary("raster image")}} ou outros arquivos SVG.

+ +

The only image formats SVG software must support are JPEG, PNG, and other SVG files. Animated GIF behavior is undefined.

+ +

SVG files displayed with <image> are treated as an image: external resources aren't loaded, :visited styles aren't applied, and they cannot be interactive. To include dynamic SVG elements, try <use> with an external URL. To include SVG files and run scripts inside them, try <object> inside of <foreignObject>.

+ +
+

Note: The HTML spec defines <image> as a synonym for <img> while parsing HTML. This specific element and its behavior only apply inside SVG documents or inline SVG.

+
+ +

Usage context

+ +

{{svginfo}}

+ +

Attributes

+ +

Global attributes

+ + + +

Specific attributes

+ + + +

DOM Interface

+ +

<image> implements the {{domxref("SVGImageElement")}} interface.

+ +

Example

+ +

Basic rendering of a PNG image in SVG:

+ +

SVG

+ +
<svg width="200" height="200"
+  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="200" width="200"/>
+</svg>
+
+ +

Result

+ +

{{EmbedLiveSample("Example", 250, 260)}}

+ +

Specifications

+ + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('SVG2', 'embedded.html#ImageElement', '<image>')}}{{Spec2('SVG2')}}Allows omitting height and width
{{SpecName('SVG1.1', 'struct.html#ImageElement', '<image>')}}{{Spec2('SVG1.1')}}Initial definition
+ +

Browser compatibility

+ + + +

{{Compat("svg.elements.image")}}

-- cgit v1.2.3-54-g00ecf