Canvas 最早由Apple引入WebKit,用于Mac OS X 的 Dashboard,后来又在Safari和Google Chrome被实现。基于 Gecko 1.8的浏览器,比如 Firefox 1.5, 同样支持这个元素。  

      Canvas元素是WhatWG Web applications 1.0规范的一部分,也包含于HTML 5中。 

【 案例展示 】

学习任务

重点、难点

突破方法

1. Canvas基本语法。

1. Canvas使用。

2. 教学难点：Canvas画布控制。

采用翻转课堂、项目导入的教学模式，采用分组讨论、案例教学、演示动画等教学方法，运用在线教学平台。

知识目标

能力目标

素质目标

1.掌握Canvas的使用。

2.掌握Canvas画布绘制功能。

3.进行画布不同内容的绘制。

1.能够利用Canvas画布绘制功能。

2.能进行不同形状的绘制。

1. 养成积极主动学习意识；

2. 养成勤于动手的习惯；

3. 培养团队合作能力。

课程思政——工匠精神

【 视频讲解】

知识储备及案例实现

1、canvas基本语法1

2、Canvas基本语法2

【 资料下载 】

单元设计

Canvas基本语法

课程教案

Canvas基本语法

演示文稿

Canvas基本语法

任务工单

Canvas基本语法

案例源码下载

        Canvas演示

课内同步项目

      蓝色宽屏漂亮的网站设计公司整站.rar   

课外扩展项目

       蓝色响应式宽屏学校教育网站.rar 

练习题

 1、练习1

疑难问题解答

1、Canvas能做什么？