html5 canvas-1.canvas介紹(hello canvas)

2024-09-05 07:20:03

字體：大中小

來源：轉載

供稿：網友

從今天開始，我們將開始一個關于html5 canvas的系列課程。這個系列是我讀《HTML5 Canvas：Native Interactivity and Animation for the Web》后的總結，有興趣的朋友可以去下載英文原版書籍閱讀。這本書通過介紹canvas游戲開發的方式，向我們展現canvas強大的功能，我覺得相當不錯，通過閱讀這本書我學到了canvas很多的知識。其實canvas本身的api并不多，關鍵是活學活用，學會對api的組合使用制作出令人難以置信的效果。而這本書就是你學習canvas最好的選擇，只可惜他暫時還沒有中文版，英文不好的朋友只有再等等了。

大家都知道，目前并不是所有的瀏覽器中支持html5，就算是支持html5的瀏覽器，也不見得支持html5所有的新特性。所以大家要選擇一款比較新的瀏覽器作為自己的調試環境，建議大家使用firefox（開發者的最愛）或者是chrome瀏覽器，我所有的例子都是基于firefox開發的。

html5相關的基礎知識這里就不做介紹了，網上有很多關于html5的教程，自行學習吧。學習html5需要大家有比較好的javascript的基礎，大家可以去湯姆大叔的博客進行學習：http://www.cnblogs.com/TomXu/archive/2011/12/15/2288411.html。其實他的這個系列課程還是有相當難度的，50多篇全學好你應該算是js專家了。
現在我們正式開始我們的canvas課程，第一個例子：“hello canvas”。
首先需要在body中添加canvas標簽，如下：

復制代碼

上一篇：html5指南-1.html5全局屬性(html5 global attributes)深入理解

下一篇：html5 canvas-2.用canvas制作一個猜字母的小游戲