[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/05   »
      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:
185507
Today:
510
Yesterday:
328