欢迎大家赞助一杯啤酒🍺 我们准备了下酒菜:Formal mathematics/Isabelle/ML, Formal verification/Coq/ACL2, C++/F#/Lisp
HTML5/canvas
来自开放百科 - 灰狐
(版本间的差异)
小 (→项目) |
小 |
||
(未显示1个用户的8个中间版本) | |||
第1行: | 第1行: | ||
− | |||
{{SeeWikipedia|Canvas element}} | {{SeeWikipedia|Canvas element}} | ||
Convas 是 [[HTML5]] 的一部分,它支持动态生成与渲染2D图形、图表、图像和动画。 | Convas 是 [[HTML5]] 的一部分,它支持动态生成与渲染2D图形、图表、图像和动画。 | ||
+ | |||
+ | Canvas 3D has now become [[WebGL]]. | ||
HTML5 Canvas 将在[[HTML5/game|HTML5游戏]]中扮演重要角色。 | HTML5 Canvas 将在[[HTML5/game|HTML5游戏]]中扮演重要角色。 | ||
+ | |||
+ | 第一个例子: | ||
+ | <html> | ||
+ | <head> | ||
+ | <script type="application/x-javascript"> | ||
+ | function draw() { | ||
+ | var canvas = document.getElementById("canvas"); | ||
+ | if (canvas.getContext) { | ||
+ | var ctx = canvas.getContext("2d"); | ||
+ | ctx.fillStyle = "rgb(200,0,0)"; | ||
+ | ctx.fillRect (10, 10, 55, 50); | ||
+ | ctx.fillStyle = "rgba(0, 0, 200, 0.5)"; | ||
+ | ctx.fillRect (30, 30, 55, 50); | ||
+ | } | ||
+ | } | ||
+ | </script> | ||
+ | </head> | ||
+ | <body onload="draw();"> | ||
+ | <canvas id="canvas" width="150" height="150"> | ||
+ | <nowiki><p>This example requires a browser that supports the | ||
+ | <a href="http://www.w3.org/html/wg/html5/">HTML5</a> | ||
+ | <canvas> feature.</p></nowiki> | ||
+ | </canvas> | ||
+ | </body> | ||
+ | </body> | ||
+ | </html> | ||
==项目== | ==项目== | ||
第10行: | 第37行: | ||
==链接== | ==链接== | ||
+ | *[http://www.w3.org/TR/html5/the-canvas-element.html HTML5: The Canvas Element] | ||
*[http://dev.w3.org/html5/2dcontext/ HTML Canvas 2D Context] | *[http://dev.w3.org/html5/2dcontext/ HTML Canvas 2D Context] | ||
*[https://developer.mozilla.org/en/HTML/Canvas Canvas tutorial on Mozzila.org] | *[https://developer.mozilla.org/en/HTML/Canvas Canvas tutorial on Mozzila.org] |
2011年2月13日 (日) 15:49的最后版本
您可以在Wikipedia上了解到此条目的英文信息 HTML5/canvas Thanks, Wikipedia. |
Convas 是 HTML5 的一部分,它支持动态生成与渲染2D图形、图表、图像和动画。
Canvas 3D has now become WebGL.
HTML5 Canvas 将在HTML5游戏中扮演重要角色。
第一个例子:
<html> <head> <script type="application/x-javascript"> function draw() { var canvas = document.getElementById("canvas"); if (canvas.getContext) { var ctx = canvas.getContext("2d"); ctx.fillStyle = "rgb(200,0,0)"; ctx.fillRect (10, 10, 55, 50); ctx.fillStyle = "rgba(0, 0, 200, 0.5)"; ctx.fillRect (30, 30, 55, 50); } } </script> </head> <body onload="draw();"> <canvas id="canvas" width="150" height="150"> <p>This example requires a browser that supports the <a href="http://www.w3.org/html/wg/html5/">HTML5</a> <canvas> feature.</p> </canvas> </body> </body> </html>
[编辑] 项目
[编辑] 链接
- HTML5: The Canvas Element
- HTML Canvas 2D Context
- Canvas tutorial on Mozzila.org
- HTML5 canvas - the basics on Opera
<discussion>characters_max=300</discussion>
分享您的观点