正如攝影是用光影作畫，html5則是用**作畫。既然是作畫，那我們就首先要聊聊html5裡面最基礎的東東：畫布。因為本人不是大牛，無法給出很深奧的底層理論，那咱們就實際點，直接拿來用吧。
例1：
canvas not supported
var canvas = document.getelementbyid('canvas'), （第一步）
context = canvas.getcontext('2d'); （第二步）
context.font = '38pt arial'; （第三步）
context.fillstyle = 'cornflowerblue';
context.strokestyle = 'blue';
context.filltext('hello canvas', canvas.width/2 - 150,
canvas.height/2 + 15);
context.stroketext('hello canvas', canvas.width/2 - 150,
canvas.height/2 + 15 );
1. 通過呼叫document.getelementbyid() 取得對canvas的引用。
2. 通過呼叫getcontext('2d') 來獲取圖形的context，我們就理解成取得乙隻畫筆吧！（大家注意2d, 那麼可想而知肯定有3d ）
3. 用畫筆開始作畫。
ok let's move on!
例2：
canvas not supported
ok ，跟第乙個例子不同的是我們沒有設定元素canvas的寬高屬性，而是用css進行控制。那麼問題就來了，如果這樣設定的話，畫布大小就成了500px*500px, 那實際繪畫平面的大小是多少呢？ 是300px*150px. 而如果我們按照例1中，給元素直接這是寬高屬性，那麼畫布大小就等於繪畫平面的大小。 咦? 你肯定會問，我例2裡並沒有設定繪畫平面大小，你怎麼就說是300px*150px ？ 哦，那是因為這個是預設值。。。 另外，我們要注意的是，當兩個平面大小不一致的時候，預設情況下，繪畫平面會自動縮放到畫布的大小。 ok ，大家自己試試就可以了，理論很枯燥。ok?
我們推薦例1的設定方式，即直接給canvas元素設定寬和高！！！便於控制效果。
在結束本文之前，我們再聊一下從 2d context 裡面除了canvas之外還有哪些屬性呢，換言之，可以通過本文中context 直接呼叫的屬性有哪些呢？
fillstyle font globalalpha globalcomposite-operation linecap linewidth linejoin miterlimit shadowblur shadowcolor shadowoffsetx shadowoffsety strokestyle textalign textbaseline
我後面會跟大家一起慢慢學習的喲~~
that's it everybody!~~~~
html5 1 之標籤初探
第一張是以前的寫法，右圖是現在的html5寫法，這樣寫有利於seo搜尋到 html中 html有了新的標籤.就是頁面最上的東西，如果用dw開啟，他就已經給你定義好了 其他的就是新增的html5標籤 結構 定義一篇 文章 標記乙個頁面，或者一塊區域的頭部 導航 側邊欄 h html中的 h1.h2.h...
HTML5 1 課程內容
前置課程 軟體開發基礎 課程專案學習內容達到目標軟體開發基礎建立新專案，使用git遠端和本地管理源 編寫專案說明文件visual studio code git markdown使用code開發和建立專案 git管理專案源 markdown書寫專案文件baoaibaoai前後端後開發環境安裝部署及使...
初識jQuery 什麼是jquery
本節課的主要內容為 jquery 是由美國人 john resig 於 2006 年建立的乙個開源專案，基本功能包含訪問和操作 dom 控制頁面樣式 處理頁面事件 便捷的動畫 便捷的 ajax 等。我們在基礎班的課程中有講過 css 選擇器，jquery 選擇器即通過 這個建構函式，按照 css 選...