<canvas>是一个新的HTML元素，这个元素可以被Script语言(通常是JavaScript)用来绘制图形。例如可以用它来画图、合成图象、或做简单的(和不那么简单的)动画。右面的图象展示了一些<canvas>的应用示例，我们将会在此教程中看到他们的实现。
　　
　　<canvas>最先在苹果公司(Apple)的MacOSXDashboard上被引入，而后被应用于Safari。基于Gecko1.8的浏览器，例如Firefox1.5，也支持这个新元素。元素<canvas>是WhatWGWebapplications1.0也就是大家都知道的HTML5标准规范的一部分。
　　
　　在本教程中，我将试着讲述如何在你自己的网页中使用<canvas>元素。提供的示例应该会给你些清晰概念，即用<canvas>能做些什么的。这些示例也可作为你应用<canvas>的起点。
　　
　　开始使用之前
　　
　　用元素<canvas>并不难，只要你具有HTML和JavaScript的基础知识。
　　
　　如上所述，并不是所有现代浏览器都支持
　　
　　<canvas>
　　
　　元素，所以你需要Firefox1.5或更新版本、或者其他基于Gecko的浏览器例如Opera9、或者最近版本的Safari才能看到所有示例的动作。
　　
　　1.Canvas是甚么？
　　
　　下面网址可以找到html5Canvas的完整定义
　　
　　#the-canvas
　　
　　现在Firefox2，safari都直接支持Canvas,IE需要一个ExCanvas的js代码库转换。
　　
　　下面网址可以找到ExCanvas[此js库尚未提供对arcto()，clip()的支持，因此基于其上的各种chart组件天然的不能生成pie图]
　　
　　
　　
　　Mozilla的Canvas入门
　　
　　:HTML:Canvas
　　
　　Mininova的Canvas入门
　　
　　
　　
　　2.Canvas能做甚么？
　　
　　(1)Msx模拟器
　　
　　ItemulatestheunderlyingZ80CPU,TMS9918VideoDisplayProcessor(VDP),PPI,RAMslotsandMegaram.Initspresentform,itshouldbeabletorunanyprogramorgamedevelopedforMSX1.0.
　　
　　用js模拟Z80等硬件,读取rom信息，无声游戏
　　
　　
　　
　　(2)Painter
　　
　　假如性能允许，发展成Webphoto也是可能的事情。
　　
　　
　　
　　(3)效果
　　
　　水波纹
　　
　　
　　
　　某个模糊理论视觉模型
　　
　　
　　
　　(4)3D
　　
　　多面体
　　
　　
　　
　　3D地图
　　
　　Mozilla的例子，RayCaster就是一个。
　　
　　Canvascape-3Dwalker，比上面例子更完善些，还提供纹理贴图功能
　　
　　一个类似CS的界面
　　
　　
　　
　　(5)chart组件
　　
　　成形的有WebFxChart,Flot等，需要可自行搜索。
　　
　　3.Canvas的发展
　　
　　(1)Canvas代码转换到flash(portingcanvastoflash)
　　
　　?title=porting_canvas_to_flash&more=1&c=1&tb=1&pb=1
　　
　　(2)支持Canvas的框架
　　
　　mootools支持Canvas的调用，并有一个mocha的基于mootools的组件提供一个窗体功能。点这里查看更多HTML教程