[HTML] <canvas> tag

HTML 5 <canvas> Tag


Example

How to display a red square, with the canvas element:

<canvas id="myCanvas"></canvas>

<script type="text/javascript">

var canvas=document.getElementById('myCanvas');
var ctx=canvas.getContext('2d');
ctx.fillStyle='#FF0000';
ctx.fillRect(0,0,80,100);

</script>

Try it yourself »

Definition and Usage

The <canvas> tag is used to display graphics.

The <canvas> tag is only a container for graphics, you must use a script to actually paint graphics.


Differences Between HTML 4.01 and HTML 5

The <canvas> tag is new in HTML 5.


Tips and Notes

Tip: You can write text between the start and end tags, to show older browser that they do not support this tag.

Note: Some browsers already support the <canvas> tag, like Firefox, Chrome, and Opera.


Attributes

New : New in HTML 5.

Attribute Value Description
heightNew pixels Sets the height of the canvas
widthNew pixels Sets the width of the canvas

Standard Attributes

The <canvas> tag also supports the Standard Attributes in HTML 5.


Event Attributes

The <canvas> tag also supports the Event Attributes in HTML 5.

크리에이티브 커먼즈 라이센스
Creative Commons License
이올린에 북마크하기(0) 이올린에 추천하기(0)

Posted by 홍반장

2010/11/02 21:58 2010/11/02 21:58
,
Response
No Trackback , No Comment
RSS :
http://tcbs17.cafe24.com/tc/rss/response/5610

Trackback URL : http://tcbs17.cafe24.com/tc/trackback/5610

« Previous : 1 : ... 187 : 188 : 189 : 190 : 191 : 192 : 193 : 194 : 195 : ... 1009 : Next »

블로그 이미지

- 홍반장

Archives

Recent Trackbacks

Calendar

«   2024/11   »
          1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
Statistics Graph

Site Stats

Total hits:
239527
Today:
179
Yesterday:
712