《HTML+CSS+JavaScript网页制作案例教程》_教学大纲
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
《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复合属性
➢背景图像定义列表项目符号
➢清除超链接图像的边框
➢链接伪类
➢锚点链接