2.文本辅导：F10 HTML5音视频的嵌入设计案例.doc
任务3参考资料：
1参考资料：R05 图像的渐变效果设置.doc
2.参考资料：R06 HTML5音视频的嵌入设计案例.doc
第五模块：HTML5及其新增元素属性
HTML5新特性与页面结构。
HTML5新增元素和新增属性。
HTML5新增表单元素及新增属性的设置方法。
1 《WEB前端开发技术》第22讲 CSS盒子模型（上）;
2 《WEB前端开发技术》第23讲 CSS盒子模型（下）;
3 《WEB前端开发技术》第24讲 CSS排版与页面布局;
4 《WEB前端开发技术》第25讲 CSS3高级应用;
5 《WEB前端开发技术》第43讲 导航菜单设计;
任务2文本辅导：
1.文本辅导：F15 运用盒子模型相关属性控制页面中各个元素.doc
3.文本辅导：F14 CSS层叠性与选择器优先级.doc
任务3参考资料：
参考资料：R08 CSS文本样式及高级特性实现.docx
第七模块：CSS盒子模型与排版布局
CSS样式设置中常用的单位。
CSS盒子模型。
边框、边界、填充及内容等属性及设置方法。
DIV标记的CSS各类属性。
常见的页面布局类型。
DIV结构及CSS规则。
5《WEB前端开发技术》第30讲 JS程序控制结构（下）;
6《WEB前端开发技术》第31讲 javascript函数（上）;
7《WEB前端开发技术》第32讲 javascript函数（下）；
任务2文本辅导：
1.文本辅导：F23 Javascript数据类型和变量.docx
2.文本辅导：F24 String对象与Array对象.docx
任务2文本辅导：
1.文本辅导：F11 HTML5的部分新增元素用法.docx
2.文本辅导：F08 HTML5表单中新增属性使用.doc
任务3参考资料：
参考资料：R07 HTML5标签综合案例.docx
第六模块：CSS基础及样式属性
CSS基本概念、CSS类型。
4种CSS样式定义的方法。CSS中字体、排版、颜色、背景、列表等属性设置。
BOM结构图
浏览器对象模型的各对象的层次关系。
window对象的定时器及对话框方法。
navigator、screen、history、location等对象的属性和方法。
任务1：观看第36、37、38、39、40、41、42讲视频；
任务2：学习文本辅导中F16、F17、F18资料；
任务3：实践训练，完成参考资料中R16、R17应用。
DIV和SPAN标记语法及标记语法。
任务1：观看第16、17、18、19、20、21讲视频；
任务2：学习文本辅导中F12、F13、F14资料；
任务3：实践训练，完成参考资料中R08高级应用实现。
任务1视频资源：
1 《Web前端开发技术》第16讲 CSS基本语法规则
2 《WEB前端开发技术》第17讲 CSS定义与引用;
JavaScript程序的概念与作用。
JavaScript标识符和变量的概念及其使用方法。
JavaScript常用运算符和表达式概念。
JavaScript中顺序、分支、循环三种程序控制结构语法。
JavaScript函数的定义方法与使用。
任务1：观看第26、27、28、29、30、31、32讲视频；
任务2：学习文本辅导中F23、F24、F25、F26、F27资料；
任务1：观看第13、14、15讲视频；
任务2：学习文本辅导中F11、F08资料；
任务3：实践训练，完成参考资料中R07 动手实践。
任务1视频资源：
1 《Web前端开发技术》第13讲 HTML5概述；
2 《Web前端开发技术》第14讲 HTML5的文档结构；
3 《Web前端开发技术》 第15讲 HTML5新增表单输入类型与属性;
8.文本辅导：F22 CSS3综合运用设计推广软文.doc
任务3参考资料：
1.参考资料：R09运用盒子模型属性实现弹出框页效果.docx
2.参考资料：R10 运用元素的浮动和定位实现焦点图效果.docx
3.参考资料：R11 CSS3的2D与3D属性方法.docx
第八模块：JavaScript编程基础
4《Web前端开发技术》第4讲 文本的使用（上）；
5《《Web前端开发技术》第5讲 文本的使用（下）；
任务2文本辅导：
1.文本辅导：F01 HTML基本标签应用.docx
2.文本辅导：F02 HTML文本样式属性设置.docx
任务3参考资料：R01HTML图文混排动手实践.docx
第二模块：列表、超链接与框架
第九模块：JavaScript事件分析
JavaScript事件类型与事件的概念。
事件句柄与事件处理代码相关联的方式。
利用表单的提交及重置事件对表单的数据进行校验。
鼠标事件中的鼠标单击及鼠标移动事件。
常用的键盘及窗口事件。
JavaScript内置对象的常用属性及方法。
任务1：观看第33、34、35、44讲视频；
《Web前端开发技术》课程教学设计方案
模块名称
涉及知识点
任务设计
各任务所用资源名称
第一模块：
HTML基础及文本使用
Web网站相关的基本概念;
常用的Web前端开发工具、浏览器工具。
HTML文档的基本结构。
标记类型、标记语法。
网页添加注释。
元信息meta标记的作用。
文本格式化标记类型与各种样式。
使用段落与排版标记。
任务3：实践训练，完成参考资料中R12、R13、R14应用。
任务1视频资源：
1《WEB前端开发技术》第26讲 JavaScript概念与作用;
2《WEB前端开发技术》第27讲 JavaScript标识符和变量;
3《WEB前端开发技术》第28讲 JS常用运算符和表达式;
4《WEB前端开发技术》第29讲 JS程序控制结构（上）;
2参考资料: R17 JavaScript事件和DOM节点操作.docx
2.文本辅导：F16 盒子边框的样式设置.docx
3.文本辅导：F17 盒子浮动float与清除浮动影响.doc
4.文本辅导：F18 盒子相对定位与相对定位设置.doc
5.文本辅导：F19 运用浮动与定位组织页面.doc
6.文本辅导：F20 块元素与行内元素的使用.doc
7.文本辅导：F21 CSS3属性选择器和结构伪类选择器应用.docx
3 《WEB前端开发技术》第18讲 DIV与SPAN;
4 《WEB前端开发技术》第19讲 CSS字体样式属性;
5 《WEB前端开发技术》第20讲 CSS文本与列表样式;
6 《WEB前端开发技术》第21讲 颜色和背景属性;
任务2文本辅导：
1.文本辅导：F12 CSS样式引用与选择器使用.docx
2.文本辅导：F13 选择器及伪类链接的综合使用.doc
2.文本辅导：F07 表单下拉菜单和下拉列表效果.doc
3.文本辅导：F08 HTML5表单中新增属性使用.doc
任务3参考资料：1.参考资来自：R03 常用表单控件设计用户注册界面.docx
2.参考资料: R04 用表单控件及属性设计信息登记表.doc
第四模块：图像与多媒体文件
图像img标记语法及属性。
6 《WEB前端开发技术》 第41讲 BOM对象模型（上）;
7 《WEB前端开发技术》 第42讲 BOM对象模型（下）;
任务2文本辅导：
1.文本辅导：F30 操作DOM.docx
2.文本辅导：F31 操作DOM树中的表单.docx
3.文本辅导：F32浏览器对象概述.docx
任务3参考资料：
1参考资料：R16 JS实现焦点图轮播和无缝滚动.docx
任务1：观看第1、2、3、4、5讲视频；
任务2：学习文本辅导中F01、F02资料；
任务3：实践训练，完成参考资料中R01动手实践。
任务1视频资源：
1《Web前端开发技术》第1讲 Web前端开发技术概述；
2《Web前端开发技术》第2讲 HTML文档结构；
3《《Web前端开发技术》第3讲 HTML基本语法；
任务2：学习文本辅导中F28、F29资料；
任务3：实践训练，完成参考资料中R15应用实践。
任务1视频资源：
1《WEB前端开发技术》第33讲 JS事件类型及处理方法；
2《WEB前端开发技术》第34讲 表单事件；
3《WEB前端开发技术》第35讲 鼠标键盘与窗口事件；
4《WEB前端开发技术》第44讲 图片切换案例
设计表格所有标记和属性。
表格行标记的属性及设置方法。
表格单元格的跨行与跨列属性的设置方法。
表格的嵌套方法。
表格中嵌入各种页面元素。
表单结构语法及属性语法。
表单控件(元素)标记语法及属性语法。
表单域和域标题标记语法。
任务1：观看第7、8、9、10讲视频；
任务2：学习文本辅导中F06、F07、F08资料；
3.文本辅导：F25 if分支语句应用.docx
4.文本辅导：F26 JavaScript的for循环.docx
5.文本辅导：F27 函数定义和调用.docx
任务3参考资料：
1.参考资料：R12 深入学习循环语句.docx
2.参考资料：R13 函数应用.docx
3.参考资料：R14 JavaScript作用域.docx
列表的类型。
无序列表、有序列表标记语法及属性语法。
使用嵌套列表设计小型网站首页。
超链接的基本标记语法和属性语法。
使用超链接实现电子邮件链接。
使用浮动框架实现内嵌页面的显示。