《HTML CSS JavaScript网页制作案例教程》 教学大纲.doc

《HTML CSS JavaScript网页制作案例教程》_教学大纲(课程英文名称)课程编号:201509210011学分:5学分学时:64学时(其中:讲课学时:45上机学时:19)先修课程:计算机基础、计算机网络、计算机应用后续课程:UI设计、JavaScript网页特效适用专业:信息及其计算机相关专业开课部门:计算机系一、课程的性质与目标《HTML+CSS+JavaScript网页制作案例教程)》是面向计算机相关专业的一门专业基础课,涉及网页基础、HTML标记、CSS样式、网页布局、JavaScript编程基础与事件处理等内容。通过本课程的学习,学生能够了解HTML、CSS及JavaScript语言的发展历史及未来方向,熟悉网页制作流程、掌握常见的网页布局效果、学会制作各种企业、门户、电商类网站。二、课程的主要内容及基本要求第一章网页那点事(2学时)[知识点]认识网页常见的互联网专业术语Web标准HTML简介CSS简介JavaScript简介常用浏览器介绍Dreamweaver工具的使用使用Dreamweaver创建第一个页面[重点]Web标准Dreamweaver工具的使用[难点]Web标准Dreamweaver工具创建第一个页面[基本要求]了解Web标准,明确HTML、CSS及JavaScript在其中的作用。熟悉Dreamweaver工具的基本操作,能使用Dreamweaver创建简单的网页。第二章从零开始构建HTML页面(4学时)[相关案例]【案例1】简单的网页:【案例2】新闻页面:【案例3】图文混排:[知识点]HTML文档基本格式单标记与双标记标题与段落标记HTML文档头部相关标记font标记标记的属性文本格式化标记图像标记相对路径与绝对路径常用图像格式特殊字符标记[重点]HTML文档基本格式标记的属性图像标记相对路径与绝对路径[难点]相对路径与绝对路径[学习目标]掌握HTML文档基本格式,能够书写规范的HTML网页。掌握标题、段落及文字标记,可以合理地使用它们定义网页元素。掌握图像标记,学会制作图文混排页面。第三章使用CSS技术美化网页(8学时)[相关案例]【案例4】文字Logo:【案例5】专题栏目:【案例6】搜索页面:[知识点]CSS样式规则引入CSS样式表CSS基础选择器CSS字体样式属性CSS文本外观属性CSS复合选择器CSS层叠性与继承性CSS优先级[重点]CSS样式规则引入CSS样式表CSS复合选择器CSS层叠性与继承性CSS优先级[难点]CSS复合选择器CSS优先级[基本要求]掌握CSS样式规则,能够书写规范的CSS样式代码。掌握CSS字体样式及文本外观属性,能够控制页面中的文本样式。掌握CSS复合选择器,可以快捷选择页面中的元素。理解CSS层叠性、继承性与优先级,学会高效控制网页元素。第四章CSS盒子模型(8学时)[相关案例]【案例7】音乐盒:【案例8】用户中心:【案例9】咖啡店banner:【案例10】图标导航栏:[知识点]认识盒子模型div标记边框属性内边距属性外边距属性背景属性元素的类型span标记元素的转换[重点]div标记边框属性内边距属性外边距属性背景属性元素的转换[难点]背景属性元素的类型元素的转换[基本要求]掌握盒子模型相关属性,能够使用它们熟练地控制网页元素。理解块元素与行内元素的区别,能够对它们进行转换。第五章列表与超链接(6学时)[相关案例]【案例11】精美电商悬浮框:【案例12】二维码名片:【案例13】电商团购悬浮框:【案例14】唱吧导航栏:唱吧导航栏默认效果鼠标移上歌曲分类时[知识点]无序列表有序列表定义列表定义列表实现图文混排列表嵌套list-style复合属性背景图像定义列表项目符号超链接标记<a>清除超链接图像的边框链接伪类锚点链接[重点]无序列表定义列表背景图像定义列表项目符号超链接标记<a>链接伪类[难点]背景图像定义列表项目符号链接伪类[基本要求]掌握无序、有序及定义列表的使用,可以制作常见的网页列表模块。掌握超链接标记的使用,能够使用超链接定义网页元素。掌握CSS伪类,会使用CSS伪类实现超链接特效。第六章HTML表单(6学时)[相关案例]【案例15】用户登录界面:【案例16】趣味选择题:【案例17】空间日志:【案例18】学员档案: