반응형
<!DOCTYPE HTML>
<html>
<head>
<title>HTML5 Canvas 사각형 선 그리기</title>
<script type="text/javascript">
var ctx;
function init()
{
ctx = document.getElementById('canvas').getContext('2d');
ctx.lineWidth = 1;
ctx.strokeStyle = "rgb(0, 0, 0)";
ctx.strokeRect(100, 50, 50, 50); // 사각형 그리기
}
</script>
</head>
<body onLoad="init()">
<canvas id="canvas" width="400" height="140" style="border:1px solid;">
이 브라우저는 HTML5의 canvas 요소를 지원하지 않습니다.
</canvas>
</body>
</html>
설명>
ctx.lineWidth = "선 굵기";
ctx.strokeStyle = "선 색상";
ctx.strokeRect(x위치, y위치, 넓이, 높이);
반응형
