canvas (HTML5)

The <canvas> tag is used to draw graphics, on the fly, via scripting (usually JavaScript). The <canvas> tag is only a container for graphics, you must use a script to actually draw the graphics.

The drawImage method allows you to insert other images (img and canvas elements) into your canvas context. To draw an image using HTML5 Canvas, we can use the drawImage() method which requires an image object and a destination point. The destination point is relative to the top left corner of the image.

To align HTML5 Canvas text, we can use the textAlign property of the canvas context, which can be set to start, end, left, center, or right. Unless otherwise specified, the textAlign property is defaulted to left.

HTML5 canvas populated with one filled rectangle and one painted stroke.