<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>선 굵기 지정하기</title> </head> <body> <canvas id="myCanvas" width="700" height="400" style="border: 2px solid #cef"> </canvas> <script> const canvas = document.getElementById("myCanvas"); const ctx = canvas.getContext("2d"); for (let i = 1; i <= 25; i ++) { ctx.beginPath(); ctx.moveTo(i * 25, 50); ctx.lineTo(i * 25, 350); ctx.strokeStyle = `rgb(${i * 10}, 0, 0)`; ctx.lineWidth = i; ctx.stroke(); } </script> </body> </html>