In this chapter, we are going to learn about HTML canvas. An HTML canvas helps you to draw, especially the graphics (for example, circles, squares, rectangles, and so on) on your HTML page. The <canvas></canvas> tags are usually controlled by JavaScript. Canvas can draw texts, which can also be animated. Let's see what we can do using the HTML canvas.
To add canvas on your HTML page, you need to define the height and width of your canvas in the <canvas></canvas> tags as shown in the following:
<html>
<head>
<title>Canvas</title>
</head>
<body>
<canvas id="canvasTest" width="200" height="100" style="border:2px solid #000;">
</canvas>
</body>
</html>We have defined the canvas ID as canvasTest, which will be used to play with the canvas. We used inline CSS on our canvas. The 2 px solid border is used to have a better view of the canvas.
..................Content has been hidden....................
You can't read the all page of ebook, please click here login for view all page.