《HTML5网页前端设计》教学大纲

1、HTML5网页前端设计（零基础56课时版）本教学大纲适用于零基础入门学习，适用于未曾学习过WEB前端设计的前置课程的班级。可以直接使用本教材完成Web网页前端设计的基础入门和后续HTML5技术的学习。本教材配合以HTML5网页前端设计实战作为实验辅导教材。内容章节学习目标理论课时上机课时建议基础知识篇（14章）第1章绪论HTML5入门介绍20第2章HTML5基础HTML5嵬本结构HTML5保留的常用标签HTML5新增的常用标签22上机实验：1 .开发第一个Web页而2 .使用HTML5新增标签丰富页面内容第3章CSS基础CSS样式表CSS选择器CSS常用样式CSS定位42上机实验（任选其一）：

2、HTML5网页前端设计实战第1章：1 .导航栏菜单的设计与实现2 .商务风格表格的设计与实现第4章JavaScript基础JavaScript变量、衰本数据类型JavaScript对象类型JavaScript 运算符JavaScript条件语句和循环语句JavaScript 函数JavaScript DOM 和 BOM62上机实验（任选其一）：HTML5网页前端设计实战第2章：1 .电子时钟的设计与实现2 .电子日历的设计与实现重点篇（5-10 章）第5章HTML5拖放API掌握HTML5元素拖放功能22上机实验（任选其一）：HTML5网页前端设计实战第3章：1 .仿回收站效果的设计与实现2

3、.图片相框展示的设计与实现第6章HTML5表单APIHTML表单基础HTML5表单新增输入类型HTML5表单新增元素标签HTML5表单新增属性42上机实验（任选其一）：HTML5网页前端设计实战第4章：1 .用户注册页面的设计与实现2 .问卷调查页面的设计与实现第7章HTML5画布APIHTML5画布创建绘制路径、矩形、图片和文本颜色和样式设置保存与恢复技术 变形与剪裁42上机实验（任选其一）：HTML5网页前端设计实战第5章：1 .手绘时钟的设计与实现2 .拼图游戏的设计与实现第8章HTML5媒体APIHTML5音频的应用HTML5视频的应用HTML5媒体API的其他通用功能42上机实验（任

4、选其一）：HTML5网页前端设计实战第6章：1 .音乐播放器的设计与实现2 .在线教学视频的设计与实现第9章HTML5地理定位API经纬度坐标HTML5获取当前定位HTML5实时更新定位22上机实验（任选其一）：HTML5网页前端设计实战第7章：1 .运动数据记录的设计与实现2 .运动轨迹记录的设计与实现第 10 章 HTML5 Web存储 APIlocalstorage 和 sessionStorage 存储 存储、读取数据、数据遍历 删除指定数据、清空所有数据22上机实验（任选其一）：HTML5网页前端设计实战第8章：1 .网页主题设置的设计与实现2 .网页日志本的设计与实现提高篇（11

5、章）第11章CSS3技术CSS3边框和背景效果CSS3文本和字体效果CSS3变形与动画效果CSS3多列42上机实验（任选其一）：HTML5网页前端设计实战第9章:1 .特殊字体效果的设计与实现2 .动画放大菜单的设计与实现总计3620HTML5网页前端设计（零基础64课时版）本教学大纲适用于零基础入门学习，适用于未曾学习过WEB前端设计的前置课程的班级。可以直接使用本教材完成Web网页前端设计的基础入门和后续HTML5技术的学习。本教材配合以HTML5网页前端设计实战作为实验辅导教材，内容章节学习目标理论课时上机课时建议基础知识篇（1-4 章）第1章绪论HTML5入门介绍20第2章HTML5基

6、础HTML5基本结构HTML5保留的常用标签HTML5新增的常用标签22上机实验：3 .开发第一个Web页而4 .使用HTML5新增标签丰富页而内容第3章CSS基础CSS样式表CSS选择器CSS常用样式CSS定位42上机实验（任选其一）：HTML5网页前端设计实战第1章：1 .导航栏菜单的设计与实现2 .商务风格表格的设计与实现第4章JavaScript基础JavaScript变量、基本数据类型JavaScript对象类型JavaScript 运算符JavaScript条件语句和循环语句JavaScript 函数JavaScript DOM 和 BOM62上机实验（任选其一）：HTML5网页前

7、端设计实战第2章：1 .电子时钟的设计与实现2 .电子日历的设计与实现重点篇（5-10 章）第5章HTML5拖放API掌握HTML5元素拖放功能22上机实验（任选其一）：HTML5网页前端设计实战第3章：1 .仿回收站效果的设计与实现2 .图片相框展示的设计与实现第6章HTML5表单APIHTML表单基础HTML5表单新增输入类型HTML5表单新增元素标签HTML5表单新增属性42上机实验（任选其一）：HTML5网页前端设计实战第4章：1 .用户注册页面的设计与实现2 .问卷调查页面的设计与实现第7章HTML5画布APIHTML5画布创建绘制路径、矩形、图片和文本颜色和样式设置保存与恢复技术

8、变形与剪裁42上机实验（任选其一）：HTML5网页前端设计实战第5章：1 .手绘时钟的设计与实现2 .拼图游戏的设计与实现第8章HTML5媒体APIHTML5音频的应用HTML5视频的应用HTML5媒体API的其他通用功能42上机实验（任选其一）：HTML5网页前端设计实战第6章：1 .音乐播放器的设计与实现2 .在线教学视频的设计与实现第9章HTML5地理定位API经纬度坐标HTML5获取当前定位HTML5实时更新定位22上机实验（任选其一）：HTML5网页前端设计实战第7章：1 .运动数据记录的设计与实现2 .运动轨迹记录的设计与实现第 10 章 HTML5 Web存储 APIlocals

9、torage 和 sessionStorage 存储 存储、读取数据、数据遍历 删除指定数据、清空所有数据22上机实验（任选其一）：HTML5网页前端设计实战第8章：1 .网页主题设置的设计与实现2 .网页日志本的设计与实现提高篇（11 章）第11章CSS3技术CSS3边框和背景效果CSS3文本和字体效果CSS3变形与动画效果CSS3多列42上机实验（任选其一）：HTML5网页前端设计实战第9章：1 .特殊字体效果的设计与实现2 .动画放大菜单的设计与实现综合篇综合应用设计实例通过对完整项目实例的解析与实现， 提高开发者项目分析能力以及强化 对于 HTML5、CSS3 与 JavaScript

10、 的综 合应用能力44上机实验（任选其一）：HTML5网页前端设计实战第10章：1 .贪吃蛇游戏的设计与实现2 . Web网站的设计与实现总计4024HTML5网页前端设计（有Web基础56课时版）本教学大纲适用于学习过WEB前端设计的前置课程的班级（包括HTML、CSS和JavaScript技术）。可以使用本教材完成后续HTML5和CSS3技术的学习。本教材配合以HTML5网页前端设计实战作为实验辅导教材。内容章节学习目标理论课时上机课时建议基础知识篇（1-4 章）第1章绪论HTML5入门介绍20第2章HTML5基础HTML5显本结构HTML5保留的常用标签HTML5新增的常用标签22上机实

11、验：5 .开发第一个Web页而6 .使用HTML5新增标签丰富页面内容第3章CSS基础（根据前置课程内容选讲）CSS样式表CSS选择器CSS常用样式CSS定位22上机实验（任选其一）：HTML5网页前端设计实战第1章：1 .导航栏菜单的设计与实现2 .商务风格表格的设计与实现重点篇（5-10 章）第4章JavaScript基础（根据前置课程内容选讲）JavaScript变量、基本数据类型JavaScript对象类型JavaScript 运算符JavaScript条件语句和循环语句JavaScript 函数JavaScript DOM 和 BOM22上机实验（任选其一）：HTML5网页前端设计实

12、战第2章：1 .电子时钟的设计与实现2 .电子日历的设计与实现第5章HTML5拖放API掌握HTML5元素施放功能42上机实验（任选其一）：HTML5网页前端设计实战第3章：1 .仿回收站效果的设计与实现2 .图片相框展示的设计与实现第6章HTML5表单APIHTML表单基础HTML5表单新增输入类型HTML5表单新增元素标签HTML5表单新增属性42上机实验（任选其一）：HTML5网页前端设计实战第4章：1 .用户注册页面的设计与实现2 .问卷调查页面的设计与实现第7章HTML5画布APIHTML5画布创建绘制路径、矩形、图片和文本颜色和样式设置保存与恢复技术 变形与剪裁42上机实验（任选其

13、一）：HTML5网页前端设计实战第5章：1 .手绘时钟的设计与实现2 .拼图游戏的设计与实现第8章HTML5媒体APIHTML5音频的应用HTML5视频的应用HTML5媒体API的其他通用功能42上机实验（任选其一）：HTML5网页前端设计实战第6章：1 .音乐播放器的设计与实现2 .在线教学视频的设计与实现提高篇 （11 章）第9章HTML5地理定位API经纬度坐标HTML5获取当前定位HTML5实时更新定位22上机实验（任选其一）：HTML5网页前端设计实战第7章：1 .运动数据记录的设计与实现2 .运动轨迹记录的设计与实现第 10 章 HTML5 Web 存储 APIlocalstora

14、ge 和 sessionStorage 存储 存储、读取数据、数据遍历 删除指定数据、清空所有数据42上机实验（任选其一）：HTML5网页前端设计实战第8章：1 .网页主题设置的设计与实现2 .网页日志本的设计与实现第11章CSS3技术CSS3边框和背景效果CSS3文本和字体效果CSS3变形与动画效果CSS3多列62上机实验（任选其一）：HTML5网页前端设计实战第9章：1 .特殊字体效果的设计与实现2 .动画放大菜单的设计与实现总计3620HTML5网页前端设计（有Web基础64课时版）本教学大纲适用于学习过WEB前端设计的前置课程的班级（包括HTML、CSS和JavaScript技术）。可

15、以使用本教材完成后续HTML5和CSS3技术的学习。本教材配合以HTML5网页前端设计实战作为实验辅导教材。内容章节学习目标理论课时上机课时建议基础知识篇第1章绪论HTML5入门介绍20（14章）第2章HTML5基础HTML5基本结构HTML5保留的常用标签HTML5新增的常用标签22上机实验：7 .开发第一个Web页而8 .使用HTML5新增标签丰富页而内容重点篇（510章）第3章CSS基础（根据前置课程内容选讲）CSS样式表 css选择器 css常用样式 CSS定位22上机实验（任选其一）：HTML5网页前端设计实战第1章：1 .导航栏菜单的设计与实现2 .商务风格表格的设计与实现第4章J

16、avaScript基础（根据前置课程内容选讲）JavaScript变量、基本数据类型JavaScript对象类型JavaScript 运算符JavaScript条件语句和循环语句JavaScript 函数JavaScript DOM 和 BOM22上机实验（任选其一）：HTML5网页前端设计实战第2章：1 .电子时钟的设计与实现2 .电子日历的设计与实现第5章HTML5拖放API掌握HTML5元素施放功能42上机实验（任选其一）：HTML5网页前端设计实战第3章：1 .仿回收站效果的设计与实现2 .图片相框展示的设计与实现第6章HTML5表单APIHTML表单嶷础HTML5表单新增输入类型HT

17、ML5表单新增元素标签HTML5表单新增属性42上机实验（任选其一）：HTML5网页前端设计实战第4章：1 .用户注册页面的设计与实现2 .问卷调查页面的设计与实现第7章HTML5画布APIHTML5画布创建绘制路径、矩形、图片和文本颜色和样式设置保存与恢复技术变形与剪裁42上机实验（任选其一）：HTML5网页前端设计实战第5章：1 .手绘时钟的设计与实现2 .拼图游戏的设计与实现提高篇（11 章）第8章HTML5媒体APIHTML5音频的应用HTML5视频的应用HTML5媒体API的其他通用功能42上机实验（任选其一）：HTML5网页前端设计实战第6章：1 .音乐播放器的设计与实现2 .在线教学视频的设计与实现第9章HTML5地理定位API经纬度坐标HTML5获取当前定位HTML5实时更新定位22上机实验（任选其一）：HTML5网页前端设计实战第7章：1 .运动数据记录的设计与实现2 .运动轨迹记录的设计与实现第 10 章 HTML5 Web 存储 APIlocalstorage 和 sessionStorage 存储 存储、读取数据、数据遍历 删除指定数据、清空所有数据42上机实验（任选其一）：HTML5网页前端设计实战第8章：1 .