最近在學習HTML5，發現其中的canvas標簽非常有趣。在這里，我將介紹如何使用HTML5的canvas標簽來畫一個簡單的笑臉。

<canvas id="myCanvas" width="200" height="200"></canvas>
<script>
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
var radius = 80;
var centerX = canvas.width/2;
var centerY = canvas.height/2;
// 畫圓
ctx.beginPath();
ctx.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
ctx.fillStyle = 'yellow';
ctx.fill();
ctx.lineWidth = 5;
ctx.strokeStyle = 'black';
ctx.stroke();
// 畫眼睛
ctx.beginPath();
ctx.arc(centerX-30, centerY-25, 10, 0, 2 * Math.PI, false);
ctx.arc(centerX+30, centerY-25, 10, 0, 2 * Math.PI, false);
ctx.fillStyle = 'black';
ctx.fill();
// 畫嘴巴
ctx.beginPath();
ctx.arc(centerX, centerY+20, 50, 0, Math.PI, false);
ctx.lineWidth = 5;
ctx.stroke();
</script>

如上面的代碼所示，我們首先需要一個canvas標簽，并定義其寬高。然后在Javascript中獲取這個標簽，并通過getContext()方法獲得它的繪畫上下文。

接著我們定義了許多變量，包括半徑、中心坐標、眼睛半徑等等。在畫一個的圓中，我們使用了beginPath()函數表示我們將要開始畫圖，然后使用arc()函數畫了一個圓，并通過fill()函數來填充顏色

接下來，我們畫眼睛和嘴巴，都是通過arc()函數來畫圓弧。最后，我們再通過stroke()函數來描邊，加上黑色的線條后，就畫出了一個簡單的笑臉。

HTML5的canvas標簽可以做很多有趣的事，而這個例子只是其中一個簡單的示例。大家可以試著修改顏色、粗細、半徑等變量的值，創造出自己所想的形狀和顏色來。祝大家玩得愉快！