HTML5 canvas
Did we already mention that the <canvas>
element is new in HTML5? This is an amazing tool that will help you create dynamic web apps. Here is how to set up the canvas:
<!DOCTYPE html>
<html>
<body>
<canvas id="c1"></canvas>
<script></script>
</body>
</html>
And when you open this page, you will see nothing. Why? Well, the canvas element is, by default, a white rectangle that you cannot see against the white background. You could add some CSS to add a border to the canvas or a background color to the body and your canvas will be revealed.
But, we probably want to put something on it and we need JavaScript to make that happen. Let's create a "drawing" on it using JavaScript:
<!DOCTYPE html>
<html>
<head>
<style>
canvas {
border: 1px solid black;
}
</style>
</head>
<body>
<canvas...