HTML畫布是一種強(qiáng)大的工具，可以使用它來創(chuàng)作出許多精美的圖像。本文將介紹如何使用HTML畫布來繪制太陽圖片。

<canvas id="sun" width="300" height="300"></canvas>

以上代碼創(chuàng)建了一個(gè)id為“sun”的畫布，寬度和高度均為300像素。接下來，我們需要使用JavaScript來完成繪制。

var canvas = document.getElementById("sun");
var ctx = canvas.getContext("2d");
ctx.beginPath();
ctx.arc(150,150,100,0,2*Math.PI);
ctx.fillStyle = "#FFD700";
ctx.fill();
ctx.closePath();
ctx.beginPath();
ctx.moveTo(220,150);
ctx.arc(150, 150, 70, 0.4*Math.PI, 1.6*Math.PI, true);
ctx.fillStyle = "#FFFFFF";
ctx.fill();
ctx.closePath();
ctx.beginPath();
ctx.moveTo(190,130);
ctx.arc(170, 130, 20, 0, 2*Math.PI);
ctx.fillStyle = "#000000";
ctx.fill();
ctx.closePath();
ctx.beginPath();
ctx.moveTo(170,150);
ctx.arc(150, 150, 20, 0, 2*Math.PI);
ctx.fillStyle = "#000000";
ctx.fill();
ctx.closePath();
ctx.beginPath();
ctx.moveTo(210,190);
ctx.arc(190, 190, 20, 0, 2*Math.PI);
ctx.fillStyle = "#000000";
ctx.fill();
ctx.closePath();
ctx.beginPath();
ctx.moveTo(130,150);
ctx.arc(150, 150, 20, 0, 2*Math.PI);
ctx.fillStyle = "#000000";
ctx.fill();
ctx.closePath();
ctx.beginPath();
ctx.moveTo(110,180);
ctx.arc(130, 180, 20, 0, 2*Math.PI);
ctx.fillStyle = "#000000";
ctx.fill();
ctx.closePath();

以上JS代碼繪制了一個(gè)黃色的圓形，其位置居中，半徑為100像素。接著繪制太陽的眼睛、鼻子和嘴巴，這些部分都是黑色填充的。最后，繪制嘴巴上方的半圓形，并使用白色填充。

畫布是一種非常靈活的繪圖工具，可以使用JavaScript代碼創(chuàng)建各種復(fù)雜的圖形，制作許多精美的圖像。