HTML <canvas>Etiqueta


Ejemplo

Muestra un rectángulo rojo mediante el elemento <canvas>:

<canvas id="myCanvas"></canvas> <script type="text/javascript"> var canvas=document.getElementById('myCanvas'); var ctx=canvas.getContext('2d'); ctx.fillStyle='#FF0000'; ctx.fillRect(0,0,80,100); </script>

Pruébalo »

Soporte del navegador

Internet Explorer Firefox Opera Google Chrome Safari

IE 9, Firefox, Opera, Chrome y Safari soportan la etiqueta <canvas>.

Nota:IE 8 o versiones anteriores de IE no soportan la etiqueta <canvas>.


Definición y uso de la etiqueta

La etiqueta <canvas> se utiliza para dibujar gráficos (como gráficos y otras imágenes) mediante scripts (generalmente JavaScript).

La etiqueta <canvas> es solo un contenedor de gráficos; debe usar scripts para dibujar los gráficos.


Diferencias entre HTML 4.01 y HTML5

La etiqueta <canvas> es una etiqueta nueva en HTML5.


Consejos y notas

Nota:Cualquier texto dentro del elemento <canvas> se mostrará en navegadores que no soporten <canvas>.

Consejo:Para conocer todas las propiedades y métodos del objeto canvas, consulteManual de referencia de HTML Canvas。


Atributos

New: Nuevo atributo en HTML5.

Atributo Valor Descripción
heightNew pixels Especifica la altura del lienzo.
widthNew pixels Especifica el ancho del lienzo.

Atributos globales

La etiqueta <canvas> soportalos atributos globales de HTML。


Atributos de eventos

La etiqueta <canvas> soportalos atributos de eventos de HTML。

Otras extensiones