Join MDN and developers like you at Mozilla's View Source conference, 12-14 September in Berlin, Germany. Learn more at https://viewsourceconf.org

canvas

Introducido en HTML5

El elemento HTML canvas (<canvas>) se puede utilizar para dibujar gráficos a través de secuencias de comandos (por lo general JavaScript ). Por ejemplo, puede usarse para dibujar gráficos, hacer composiciones de fotos o incluso realizar animaciones.

Las aplicaciones de Mozilla adquirieron la compatibilidad con <canvas> a partir de Gecko 1.8 (es decir, Firefox 1.5 ). El elemento fue originalmente introducido por Apple en el OS X Dashboard y Safari. Internet Explorer, antes de la versión 9.0 beta, no admite de forma nativa <canvas> , pero una página puede de hecho añadir la compatibilidad mediante la inclusión de un script del proyecto Explorer Canvas de Google. Opera 9 también es compatible con <canvas> .

Para más artículos sobre canvas, consulta la página del tema canvas .

Contexto de uso

Contenido permitido Transparente, ya sea contenido estático o contenido dinámico .
Omisión de etiquetas Ninguna, deben estar presentes tanto las etiquetas de inicio como las de cierre
Elementos primarios permitidos Cualquier elemento que acepte contenido dinámico o cualquier otro elemento que acepte contenido estático . 
Documento normativo HTML 5, sección 4.8.10

Atributos

width
 La anchura del espacio de coordenadas en píxeles CSS. El valor predeterminado es 300.
height
La altura del espacio de coordenadas en píxeles CSS. El valor predeterminado es 150.
Nota: el tamaño del lienzo mostrado se puede cambiar con una hoja de estilo. La imagen se escala durante la representación para adaptarse al tamaño que se le ha aplicado estilo .

Interfaz DOM

Ejemplo

<canvas id="canvas" width="300" height="300">
  Tu navegador no admite el elemento &lt;canvas&gt;.
</canvas>

Consulta también

 

Etiquetas y colaboradores del documento

 Colaboradores en esta página: teoli, inma_610, xaky
 Última actualización por: teoli,