The <canvas> element is important part of HTML5, and it is used to draw, or rather help draw graphics. The <canvas< element is only a container where the graphic object will be placed, and to make it fully functional it has to be approached with a script such as JavaScript.

Syntax:

<canvas></canvas>

Attributes:

The <canvas> element should always have an id attribute so it can be referred to by JavaScript. It is also a good idea to use width and height attributes in order to define the size of your canvas.

How to use canvas in real life?

The canvas element is a pretty simple one, in sense that all of its functionality is exposed through a JavaScript object. By default, the <canvas> element has no border and no content.

Example

Example how to use canvas elements:

 

 

›› go to examples ››