Elemento canvas
Si no sabes lo que es un elemento o cómo debes usarlo, te recomiendo leer el tutorial "Tags y atributos en HTML" que puedes encontrar en la sección de tutoriales HTML.
Tabla de contenidos
Descripción
El elemento canvas
crea un área rectangular donde los autores pueden representar gráficos y animaciones programáticamente y en tiempo real. Este es un recurso valuable al diseñar sitios ricos en animación e interactividad, o cuando se desarrollan aplicaciones dentro del documento o videojuegos.
Ejemplos
El siguiente ejemplo muestra a un elemento canvas
ejecutando una animación que es llevada a cabo por una función escrita en Javascript. Como el ancho y la altura de este elemento no puede ser un valor relativo (como un porcentaje), esta función establecerá además, programáticamente, el ancho del elemento de modo que tome todo el espacio disponible en su padre.
<canvas id="canvas-1" height="100"></canvas>
Ahora un elemento canvas
será configurado para proveer interactividad, al permitir al usuario dibujar líneas con el puntero del mouse. Puedes probar esta pizarra de dibujo moviendo el mouse sobre la superfice mientras presionas el botón izquierdo. Si presionas el botón derecho sobre el elemento, el tablero será limpiado.
<canvas id="canvas-2" height="200"></canvas>
Atributos
Atributos específicos
width
El número de píxeles a ser usados como ancho del rectángulo que define este elemento. Cuando este atributo no se especifica, el área del elemento toma un ancho de 300 píxeles.
Ejemplo
<canvas width="500"></canvas>
height
El número de píxeles a ser usados como altura del rectángulo que define este elemento. Cuando este atributo no se especifica, el área del elemento toma una altura de 150 píxeles.
Ejemplo
<canvas height="200"></canvas>
Atributos globales
Para más información acerca de los atributos globales refiérete a esta lista de atributos gloables en HTML5.
Eventos
Eventos globales
Para más información acerca de los eventos globales refiérete a esta lista de eventos globales en HTML5.