<svg>

El elemento svg es un contenedor que define un nuevo sistema de coordenadas y viewport (en-US). Es usado como el elemento más externo de cualquier documento SVG, pero también puede ser usado para agregar un fragmento de un SVG dentro de un documento SVG o HTML.

Contexto de Uso

Ejemplo

Considere la sigiente imagen SVG (representando la bandera nacional de Italia):

xml
<svg xmlns="http://www.w3.org/2000/svg"
     width="150" height="100" viewBox="0 0 3 2">

  <rect width="1" height="2" x="0" fill="#008d46" />
  <rect width="1" height="2" x="1" fill="#ffffff" />
  <rect width="1" height="2" x="2" fill="#d2232c" />
</svg>

Esta puede ser incluida en un documento HTML5 de la siguiente manera:

html
<!doctype html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>HTML/SVG Example</title>
  </head>

  <body>
    <svg width="150" height="100" viewBox="0 0 3 2">
      <rect width="1" height="2" x="0" fill="#008d46" />
      <rect width="1" height="2" x="1" fill="#ffffff" />
      <rect width="1" height="2" x="2" fill="#d2232c" />
    </svg>
  </body>
</html>

Atributos

Atributos Globales

Specific attributes

Interfaz DOM

Este elemento implementa SVGSVGElement (en-US) en la interfaz.

Especificaciones

Specification
Scalable Vector Graphics (SVG) 2
# NewDocument

Compatibilidad con navegadores

BCD tables only load in the browser