HTML5繪制圖形是一個非常有用的功能，它可以幫助我們創建出各種精美的圖形。在本文中，我們將學習如何使用HTML5繪制圖形。 首先，我們需要定義一個畫布，讓我們使用以下代碼：

<canvas id="myCanvas" width="200" height="100"></canvas>

上面的代碼將創建一個寬度為200像素，高度為100像素的畫布。接下來，我們需要在畫布上繪制一個矩形，可以使用以下代碼：

var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
ctx.fillStyle = "#FF0000";
ctx.fillRect(0, 0, 150, 75);

上面的代碼將在畫布上繪制一個紅色的矩形。fillStyle屬性定義了填充的顏色，fillRect方法定義了矩形的位置和大小。 我們還可以繪制直線，使用以下代碼：

var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
ctx.moveTo(0, 0);
ctx.lineTo(200, 100);
ctx.stroke();

上面的代碼將在畫布上繪制一條從左上角到右下角的直線。moveTo方法定義了起點位置，lineTo方法定義了終點位置。 最后，我們還可以繪制圓形，使用以下代碼：

var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
ctx.beginPath();
ctx.arc(100, 50, 40, 0, 2 * Math.PI);
ctx.stroke();

上面的代碼將在畫布上繪制一個半徑為40像素的圓形。arc方法定義了圓心位置、半徑、起始角度和結束角度。 總之，HTML5繪制圖形是一個非常有用的功能，我們可以使用它創建各種各樣的圖形。以上是一些基本的HTML5繪制圖形代碼，希望對您有所幫助。