[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 : ... 854 : 855 : 856 : 857 : 858 : 859 : 860 : 861 : 862 : ... 6391 : Next »

블로그 이미지

- 홍반장

Archives

Recent Trackbacks

Calendar

«   2024/12   »
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 31        
Statistics Graph

Site Stats

Total hits:
250556
Today:
535
Yesterday:
295