《Web前端开发》课程教学大纲（本科）.docxVIP

Web前端开发（Front-end development of Web） 课程代码学分：2 学时：32（其中：课堂教学学时：16实验学时：上机学时：16课程实践学时：） 先修课程：图形图像处理技术 适用专业：教育技术 教材： Dreamweaver CC网页设计实战从入门到精通2017年01月 刘玉红、侯永岗清华大学出版社一、课程性质与课程目标 （-）课程性质（需说明课程对人才培养方面的贡献） Web前端开发是教育技术专业的一门必修专业课。本课程从HTML文件的基本结构是什么，到使 用HTML标签制作简单的网页，一直到最后使用DIV+CSS制作精美的商业网站，以这样一个循序渐进 的讲解过程，帮助大家完成不会一会一熟练一精通网页制作的蜕变。学习完本门课程后，能够掌握 网页制作的精髓，快速而熟练地制作网页，为日后从事信息技术课程教学打下基础，同时为制作和 维护学校网站打下基础。 （二）课程目标（根据课程特点和对毕业要求的贡献，确定课程FI标。应包括知识目标和能力目标。） （-）知识目标 .掌握 html、html5 css、css3 的基本语法； .掌握html5的canvas绘图; .熟练应用div+css实现页面布局 .掌握JavaScript基本语法 .掌握D0M的基本用法 .掌握jQuery的基本用法； .熟悉w3c规范，了解各大主流浏览器的兼容性； .熟悉bootstrap框架 .通过本课程的学习要求学生掌握div+css实现页面的布局，实现静态页面; .通过JavaScript实现简单的交互功能； .通过jQuec，简化js的原生代码，减少代码量； .通过bootstrap框架，实现页面快速布局 .能解决各大浏览器的兼容性问题二、课程内容与教学要求（按章撰写） 第1章 网页设计与制作基础 （一）课程内容 1认识网页和网站 网页的相关概念 网页的HTML构成 HTML常用标签 （二）教学要求 掌握网页、网站的基础概念，了解网站的种类和特点 了解因特网与万维网、浏览器与HTML、URL、域名与IP地址、上传和下载 认识文档标签、头部标签、主体标签 第2章认识 Dreamweaver CC （一）课程内容 1 走进 DreamwoaverCC 2 Dreamweaver CC 的工作环境 3体验DreamweaverCC的新增功能 管理站点 操作站点文件及文件夹 （二）教学要求 学会安装 DreamweaverCC 启动 DreamweaverCC 认识Dreamweaver CC的工作界面、熟悉【插入】面板组 认识站点，学会创建站点（本地站点、远程站点） 学会站点的基本操作（打开站点、编辑站点、删除站点、复制站点） 学会创建文件夹、创建文件、文件或文件夹的移动和复制、删除文件或文件夹 第3章创建网页中的文本 （一）课程内容 1网页设计的基本操作 设置页面属性 用文字充实网页 特殊文本的操作 （二）教学要求 学会新建网页、保存网页、打开网页、预览网页 学会设置页面属性 学会插入文字、设置字体、设置字号、设置字体颜色、设置字体样式、编辑段落、检查拼写、 创建项目列表 学会插入换行符、插入水平线、插入日期、插入特殊字符、插入注释 第4章使用图像和多媒体 （一）课程内容 选择适合网页中图像的格式 用图像美化网页 在网页中插入多媒体 （二）教学要求 学会插入图像、设置图像属性、图像的对齐方式、学会插入鼠标经过图像、插入图像占位符 学会插入背景音乐、插入Flash动画、插入FLV、插入IITML5音频、插入IITML5视频 HTML5新增元素与属性速览 （一）课程内容 新增的主体结构元素 新增的非主体结构元素 新增其他常用元素 新增的全局属性 新增的其他属性与废除的属性 （二）教学要求 掌握section元素、article元素、aside元素、nav元素、time元素 掌握header元素、hgroup元素、footer元素、figure元素、address元素 认识 mark 元素、rp、rt 与 ruby 元素、progress 元素、command 元素、embed 元素、details 与 summary 元素、datalist 元素 认识 contentEditable 属性、spellcheck 属性、tabindex 属性 第6章设计网页超链接 （一）课程内容 1链接与路径 6.2添加网页超链接 （二）教学要求 了解链接的概念、认识链接的路径及链接的类型 学会添加文本链接、添加图像链接、创建外部链接、创建锚记链接、创建图像热点链接 学会创建电子邮件链接、创建下载文件的链接、创建空链接、创建脚本链接 第7章表格的应用 （一）课程内容 1插入表格 2选择表格 表格属性 操作表格 操作表格数据 （二）教