HTML 예제 19 / 20
<canvas> 는 JS로 픽셀을 '그리는' 도화지, <svg> 는 태그로 도형을 '선언'하는 벡터 그래픽입니다.
canvas
svg
그래픽
💡 이렇게 바꿔보세요
- SVG 도형은 DOM 요소라서 CSS/JS 로 각각 선택하고 스타일링하기 쉬워요
- Canvas 는 한 번 그리면 '픽셀'이 되어 개별 도형을 다시 선택할 수 없어요 — 대신 애니메이션·게임처럼 빠르게 다시 그리기에 유리해요
- JS 탭의
ctx.fillRect(x, y, 너비, 높이) 숫자를 바꿔보세요
← HTML 예제 목록