HTML5 canvas 기본 사용법

기본 사용법
<canvas id="tutorial" width="200" height="200"></canvas>

canvas의 기본 사용법이다.
canvas의 속성은 width, height 두가지만 가지고 있다.
만약 크기를 지정하지 않으면 기본적으로 300*150의 공간을 가지고 있고,
Javascript, CSS로 쉽게 제어가 가능하다.
CSS로는 일반적인 이미지 태그처럼 각종 스타일을 지정할 수 있다. (margin, background, border 등)

대체 속성
canvas는 기본적으로 브라우저 지원이 적기때문에 간단하게 대체 문구나 이미지를 삽입할 수 있다.

1. <canvas id="stockGraph" width="150" height="150">  
2.   current stock price: $3.15 +0.15  
3. </canvas>  
4.   
5. <canvas id="clock" width="150" height="150">  
6.   <img src="images/clock.png" width="150" height="150" alt=""/>  
7. </canvas>  

위의 두가지 canvas요소들은 각각 canvas를 지원하지 않는 브라우저에서 보았을경우
아래의 텍스트와 이미지로 대체할 수 있다.