今天我們來看一下如何使用HTML5畫一個圖。首先我們需要一個畫板，這可以通過HTML5的canvas元素來實現。以下是一個最簡單的canvas元素代碼：

<canvas id="myCanvas" width="200" height="100">
您的瀏覽器不支持 HTML5 canvas 標簽。
</canvas>

上面的代碼創建了一個寬度為200像素，高度為100像素的畫布。接下來我們需要在畫板上畫圖。

<canvas id="myCanvas" width="200" height="100">
您的瀏覽器不支持 HTML5 canvas 標簽。
</canvas>
<script>
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
ctx.fillStyle = "#FF0000";
ctx.fillRect(0, 0, 200, 100);
</script>

上面的代碼創建了一個紅色的矩形，該矩形填滿了畫板。ctx是我們用來與畫板進行交互的對象，我們可以使用它的方法來畫各種各樣的圖形。 我們也可以畫線。

<canvas id="myCanvas" width="200" height="100">
您的瀏覽器不支持 HTML5 canvas 標簽。
</canvas>
<script>
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
ctx.moveTo(0, 0);
ctx.lineTo(200, 100);
ctx.stroke();
</script>

上面的代碼畫了一條從左上角到右下角的斜線。我們使用ctx.moveTo方法將畫筆移動到起點，使用ctx.lineTo將畫筆終點移動到目標位置，然后通過ctx.stroke方法畫出線條。 當然，這只是HTML5畫圖功能的冰山一角。HTML5還提供了繪制曲線、繪制文本、繪制圖像等多種功能。學好HTML5畫圖，將為我們的網頁和應用程序增添無限魅力。