网页设计与制作教案34233

章节名称章节名称 网页设计入门基础 网页设计入门基础 课堂类型课堂类型 理论 实训 练习 测试 学时安排学时安排 2 课时 目的要求目的要求 1 了解网络的基本知识 网页设计的基础知识 网页的分类 动态网页的原理 及技术 2 了解网页的基本构成及最简单的 html 代码 3 了解网页设计的流程 重重 点点 了解网页设计的流程 掌握最基本的网页的构成及最简单的网页 html 代码 难难 点点 掌握最基本的网页的构成及最简单的网页 html 代码 教法学法教法学法 1 采用教授法进行教学讲解 结合疑难点师生互动交流方式进行 2 练习采用学生自主安排 教师给与个别辅导的方式进行 参考资料参考资料 Dreamweaver CS5 网页设计与制作 DIV CSS 版 吴丰 丁欣 主编 清华大学出版社 动态网页制作教程 第二版 刘梅彦 徐英慧 编著 清华大学出版社 教学过程教学过程 环节一 结合 PPT 课件的内容 讲解网络和网页的基本知识 了解网页的分类 网页运行的原理 介绍网页设计的工具 动态网页的技术 环节二 介绍网页的构成 并对一个网站进行实例分析说明 编写最简单的 html 代码 环节三 了解网页设计的流程 主要有以下几个步骤 一 网站规划 二 素材资源收集 2 三 选择开发工具 四 站点建立与规划 五 分模块进行网页设计 六 网页源代码测试与特效添加 七 申请域名与空间 八 网页源代码上传 九 定期的维护 环节四 对本节课的内容进行复习 让学生练习 html 的代码 并进行疑难解答 3 章节名称章节名称 htmlhtml 基础与应用基础与应用 1 1 课堂类型课堂类型 理论 实训 练习 测试 学时安排学时安排 2 课时 目的要求目的要求 了解 html 语言的基础知识 结构 掌握 html 语言设置网页的背景音乐 背景图 片 字体的方法 重重 点点 Html 语言设置网页的背景音乐 图片 字体 难难 点点 Html 语言设置网页的方法 教法学法教法学法 1 采用教授法进行教学讲解 结合疑难点师生互动交流方式进行 2 练习采用学生自主安排 教师给与个别辅导的方式进行 参考资料参考资料 Dreamweaver CS5 网页设计与制作 DIV CSS 版 吴丰 丁欣 主编 清华大学出版社 动态网页制作教程 第二版 刘梅彦 徐英慧 编著 清华大学出版社 教学过程教学过程 环节一 复习网页设计的基础知识 介绍如何利用 Dreamweaver 开发工具 记事 本编辑网页的源程序 介绍网页站点的创建及注意事项 环节二 讲解 html 语言的结构 特点 设置网页页面的背景音乐 图片 字体 1 设置背景颜色 2 背景图片 3 背景音乐 背景音乐和上边介绍的两个有很大的不同 它的代码是放在页面的头部 里 4 4 标题字体 文字 1 2 3 4 5 6 比如 今天是星期三 今天天气晴 温度 15 23 5 字体的大小 用于一般文字 文字 1 2 3 4 5 6 7 or 例子 今天天气真好 6 字体颜色 指定颜色 文字 rrggbb 16 进制数码 或者是 下列预定义色彩 Black Olive Teal Red Blue Maroon Navy Gray Lime Fuchsia White Green Purple Silver Yellow Aqua 7 客户端字体 Font Face 客户端可获得的字体 什么是客户端 通俗的讲 就是你的电脑 face 就是从你的电脑 获得的字体 环节三 完成课堂讲解的练习例题 并疑难解答 环节四 复习本次课内容 步骤课后作业 5 章节名称章节名称 htmlhtml 基础与应用基础与应用 2 2 课堂类型课堂类型 理论 实训 练习 测试 学时安排学时安排 2 课时 目的要求目的要求 了解 html 语言的跑马灯效果标签的运用 序列卷标标签的运用 重重 点点 Html 语言的跑马灯效果标签及序列卷标的应用 难难 点点 Html 语言的跑马灯效果标签及序列卷标的应用 教法学法教法学法 1 采用教授法进行教学讲解 结合疑难点师生互动交流方式进行 2 练习采用学生自主安排 教师给与个别辅导的方式进行 参考资料参考资料 Dreamweaver CS5 网页设计与制作 DIV CSS 版 吴丰 丁欣 主编 清华大学出版社 动态网页制作教程 第二版 刘梅彦 徐英慧 编著 清华大学出版社 教学过程教学过程 环节一 复习 HTML 语言中设置背景颜色 背景图片 音乐等标签的知识 介绍 HTML 语言的编写规范要求 环节二 讲解 html 语言的跑马灯效果标记 序列卷标标记的使用 1 跑马灯效果 该标记能实现文字或图片的滚动效果 滚动文字 主要参数 direction 控制移动方向 可取 left right up down 四个 值 behavior 移动方式 可取 scroll 循环移动 slide 只走一圈 alternate 来回移动 6 loop 循环次数 不输入表示无限次循环 scrollamount 移动快慢 数值越大越快 scrolldelay 每移动一步之后的延时 单位是毫秒 height width 移动区域的高和宽 单位像素 bgcolor 移动区域的背景色 2 序列卷标 该类型标记类似于 Word 软件中的项目符号及编号 主要分为两种 1 无序标记 无序序列就是序列各条目间无顺序关系 姓名 吴小娟 生日 1993 6 16 星座 双子座 运行的效果如下 姓名 吴小娟 生日 1993 6 16 星座 双子座 其中为无序序列标记 每增加一个条目 就要添加一个 还可以通过设置来改变条目前面的图标 属性可以是 Disk 实心圆 Square 方形 Circle 空心圆 2 有序标记 无序序列就是序列各条目间有顺序关系 姓名 吴弘凯 生日 1993 6 16 星座 双子座 运行的效果如下 1 姓名 吴小娟 7 2 生日 1993 6 16 3 星座 双子座 其中为无序序列标记 每增加一个条目 就要添加一个 还可以通过设置来改变条目前面的编号 属性可以设置为 1 数字 A 大写英文字母 a 小写英文字母 I 大写罗马字母 i 小 写罗马字母 等五种 环节三 完成课堂讲解的练习例题 并疑难解答 环节四 复习本次课内容 步骤课后作业 8 章节名称章节名称 htmlhtml 基础及应用基础及应用 3 3 课堂类型课堂类型 理论 实训 练习 测试 学时安排学时安排 2 课时 目的要求目的要求 了解 Html 语言的控制表格及其表项 框架 重重 点点 Html 语言的表格及其表项的标记使用 超链接标记 框架标记的使用 难难 点点 掌握利用框架标记来设计页面 教法学法教法学法 1 采用教授法进行教学讲解 结合疑难点师生互动交流方式进行 2 练习采用学生自主安排 教师给与个别辅导的方式进行 参考资料参考资料 Dreamweaver CS5 网页设计与制作 DIV CSS 版 吴丰 丁欣 主编 清华大学出版社 动态网页制作教程 第二版 刘梅彦 徐英慧 编著 清华大学出版社 教学过程教学过程 环节一 复习 HTML 语言中跑马灯效果标记 序列卷标的使用方法 环节二 讲解 html 语言的表格标记 超链接标记 框架标记的使用 1 表格标记 定义表格 定义表行 定义表头 定义表元 2 超链接标记 超链接采用 标记来实现 链接文件的路径有以下两种 绝对路径方式 相对路径方式 9 3 框架结构标记 框窗实作 在中 COLS 表示左右分 ROWS 表示上下分 环节三 完成课堂讲解的练习例题 并疑难解答 环节四 复习本次课内容 步骤课后作业 章节名称章节名称 运用表格设计页面布局 运用表格设计页面布局 课堂类型课堂类型 理论 实训 练习 测试 学时安排学时安排 2 课时 目的要求目的要求 了解网页中表格布局模式设计的方法 重重 点点 了解网页中表格布局模式设计的方法 难难 点点 了解网页中表格布局模式设计的方法 教法学法教法学法 1 采用教授法进行教学讲解 结合疑难点师生互动交流方式进行 2 练习采用学生自主安排 教师给与个别辅导的方式进行 参考资料参考资料 Dreamweaver CS5 网页设计与制作 DIV CSS 版 吴丰 丁欣 主编 10 清华大学出版社 动态网页制作教程 第二版 刘梅彦 徐英慧 编著 清华大学出版社 教学过程教学过程 环节一 复习 HTML 语言中表格标记 超链接 框架的相关知识 讲解上次课布 置的作业 环节二 以一个蓝色空间网页的设计为例 讲解采用表格布局模式设计网页的方 法 设计规范要求 多采用表格嵌套方式设计页面 少采用表格拆分的设计方法 环节三 完成课堂讲解的练习例题 并疑难解答 环节四 复习本次课内容 步骤课后作业 章节名称章节名称 运用框架结构设计页面布局 运用框架结构设计页面布局 课堂类型课堂类型 理论 实训 练习 测试 学时安排学时安排 2 课时 目的要求目的要求 了解网页中框架布局模式设计的方法 重重 点点 11 掌握网页中框架布局模式设计的方法 难难 点点 掌握网页中框架布局模式设计的方法 教法学法教法学法 1 采用教授法进行教学讲解 结合疑难点师生互动交流方式进行 2 练习采用学生自主安排 教师给与个别辅导的方式进行 参考资料参考资料 Dreamweaver CS5 网页设计与制作 DIV CSS 版 吴丰 丁欣 主编 清华大学出版社 动态网页制作教程 第二版 刘梅彦 徐英慧 编著 清华大学出版社 教学过程教学过程 环节一 复习采用表格工具设计网页的方法 讲解上次课布置的作业 环节二 介绍框架结构在网页设计中的应用 以一个诗人作品简介网页的设计为 例 讲解采用框架布局模式设计网页的方法 设计技巧 框架中每个页面要单独保存命名 需要在超链接属性中设置显示在主 框架 target blank 环节三 完成课堂讲解的练习例题 并疑难解答 环节四 复习本次课内容 步骤课后作业 12 章节名称章节名称 网页 网页 CSSCSS 样式基础样式基础 课堂类型课堂类型 理论 实训 练习 测试 学时安排学时安排 2 课时 目的要求目的要求 掌握 CSS 样式的建立及使用的方法 重重 点点 掌握 CSS 样式的创建及使用的方法 难难 点点 掌握 CSS 样式的创建及使用的方法 教法学法教法学法 1 采用教授法进行教学讲解 结合疑难点师生互动交流方式进行 2 练习采用学生自主安排 教师给与个别辅导的方式进行 参考资料参考资料 Dreamweaver CS5 网页设计与制作 DIV CSS 版 吴丰 丁欣 主编 清华大学出版社 动态网页制作教程 第二版 刘梅彦 徐英慧 编著 清华大学出版社 教学过程教学过程 环节一 复习采用表格布局模式设计网页的方法 讲解上次课布置的作业 环节二 讲解 CSS 样式表的基础知识 通过实例说明其应用的方法 1 CSS 基础知识 CSS 是用于控制网页样式的一种标记语言 它以 HTML 为基础 扩展了 HTML 的功 能 提供了丰富的格式化功能 使网页设计者能够以更有效的方式设置网页的外 观 通过 CSS 可以实现网页的样式信息与网页内容分离 2 CSS 样式的建立 在 Dreamweaver 软件中的 CSS 面板中新建 CSS 样式 13 3 CSS 样式的类型主要有四种 1 类选择器 可用于任何标签 名字需要自定义 以 开头 例子 通过 CSS 样式 设置字体大小与颜色 2 ID 选择器 针对设置了 ID 属性的 HTML 标记 与类选择器类似 以 开 头 例子 通过 CSS 样式 设置指定 ID 的表格边框 3 标签选择器 标签也称标记 CSS 标签选择器就是针对 Html 标签设置 CSS 样式 例如 h2 选择器就用于声明页面中所有标记的样式风格 4 复合内容选择器 同时影响两个或多个标签 类或 ID 的复合规则 请选 择 复合内容 基于选择的内容 选项并输入用于复合规则的选择器 环节三 完成课堂讲解的练习例题 并疑难解答 环节四 复习本次课内容 步骤课后作业 章节名称章节名称 网页 网页 CSSCSS 样式基础样式基础 菜单制作菜单制作 1 1 课堂类型课堂类型 理论 实训 练习 测试 学时安排学时安排 2 课时 目的要求目的要求 掌握运用 CSS 样式设计网页菜单的方法 重重 点点 14 掌握运用 CSS 样式设计网页菜单的方法 难难 点点 掌握运用 CSS 样式设计网页菜单的方法 教法学法教法学法 1 采用教授法进行教学讲解 结合疑难点师生互动交流方式进行 2 练习采用学生自主安排 教师给与个别辅导的方式进行 参考资料参考资料 Dreamweaver CS5 网页设计与制作 DIV CSS 版 吴丰 丁欣 主编 清华大学出版社 动态网页制作教程 第二版 刘梅彦 徐英慧 编著 清华大学出版社 教学过程教学过程 环节一 复习 CSS 样式表的基础知识 讲解上次课布置的作业 环节二 通过一个网页菜单的制作实例 介绍 CSS 的设置技巧 1 通过设置 a 标签的 css 样式实现菜单的基本显示 通过设置 a 标签选择器的宽度高度来实现 2 通过设置鼠标经过的 CSS 样式 来实现鼠标移动到某个菜单的背景颜色变化 通过 a hover 符合选择器来实现 3 在不同的浏览器下运行这个网页 分析存在的问题 环节三 完成课堂讲解的练习例题 并疑难解答 环节四 复习本次课内容 步骤课后作业 15 章节名称章节名称 网页 网页 CSSCSS 样式基础样式基础 菜单制作菜单制作 2 2 课堂类型课堂类型 理论 实训 练习 测试 学时安排学时安排 2 课时 目的要求目的要求 掌握运用 UL LI 标签及它们的 CSS 样式来设计网页菜单的方法 重重 点点 掌握运用 UL LI 标签及它们的 CSS 样式来设计网页菜单的方法 难难 点点 掌握运用 UL LI 标签及它们的 CSS 样式来设计网页菜单的方法 教法学法教法学法 1 采用教授法进行教学讲解 结合疑难点师生互动交流方式进行 2 练习采用学生自主安排 教师给与个别辅导的方式进行 参考资料参考资料 Dreamweaver CS5 网页设计与制作 DIV CSS 版 吴丰 丁欣 主编 清华大学出版社 动态网页制作教程 第二版 刘梅彦 徐英慧 编著 清华大学出版社 教学过程教学过程 环节一 复习上节课介绍的网页菜单的制作方法 讲解上次课布置的作业 环节二 针对采用设置 a 标签 CSS 样式制作菜单的方法存在的问题 介绍采用 UL Li 标签的 CSS 样式设计网页菜单的制作实例 介绍 CSS 的设置技巧 16 网页菜单的设计步骤 1 通过 UL LI 标签创建网页菜单的基本内容 首页导读 推荐版面 推荐文章 人气排名 新开讨论区 休闲娱乐 常见问题 2 通过设置 UL LI 标签选择器的 CSS 样式实现网页菜单的基本显示效果 navigation li text align center width 80px height 32px background url button1 jpg repeat x float left 3 通过设置 a hover 复合内容选择器实现菜单的鼠标移动变换背景效果 17 navigation li a hover color FFFFFF background url button2 jpg no repeat 环节三 完成课堂讲解的练习例题 并疑难解答 环节四 复习本次课内容 步骤课后作业 章节名称章节名称 网页 网页 CSSCSS 样式应用实例样式应用实例 课堂类型课堂类型 理论 实训 练习 测试 学时安排学时安排 2 课时 目的要求目的要求 掌握 CSS 样式综合运用方法 重重 点点 掌握 CSS 样式综合运用方法 难难 点点 掌握 CSS 样式综合运用方法 教法学法教法学法 1 采用教授法进行教学讲解 结合疑难点师生互动交流方式进行 2 练习采用学生自主安排 教师给与个别辅导的方式进行 参考资料参考资料 Dreamweaver CS5 网页设计与制作 DIV CSS 版 吴丰 丁欣 主编 清华大学出版社 动态网页制作教程 第二版 刘梅彦 徐英慧 编著 清华大学出版社 教学过程教学过程 环节一 复习采用 UL LI 设计网页菜单的方法 讲解上次课布置的作业 18 环节二 讲解 CSS 样式表的两个应用实例 通过实例说明其中 CSS 的设置技巧 1 无边框输入表格案例 通过为表格单元格添加 css 样式 设置样式的边框属性为无边框来实现 table formdata input width 100px padding 1px 3px 1px 3px margin 0px border none 输入框不要边框 font family Arial 2 鼠标经过行变色效果 这个效果需要结合 Javascript 代码来实现 19 环节三 完成课堂讲解的练习例题 并疑难解答 环节四 复习本次课内容 步骤课后作业 章节名称章节名称 DIV CSSDIV CSS 设计实例设计实例 花店页面设计上花店页面设计上 课堂类型课堂类型 理论 实训 练习 测试 学时安排学时安排 2 课时 目的要求目的要求 掌握 DIV CSS 设计网页的模式与技巧 重重 点点 掌握 DIV CSS 设计网页的模式与技巧 难难 点点 掌握 DIV CSS 设计网页的模式与技巧 教法学法教法学法 1 采用教授法进行教学讲解 结合疑难点师生互动交流方式进行 2 练习采用学生自主安排 教师给与个别辅导的方式进行 参考资料参考资料 Dreamweaver CS5 网页设计与制作 DIV CSS 版 吴丰 丁欣 主编 清华大学出版社 动态网页制作教程 第二版 刘梅彦 徐英慧 编著 清华大学出版社 教学过程教学过程 环节一 复习上节课介绍的 CSS 样式表的应用案例 讲解上次课布置的作业 环节二 通过一个花店网页设计案例 讲解如何采用 DIV CSS 的布局模式来设计 网页 20 设计步骤 1 采用 Div 创建网页的整体结构 2 在每个模块中再添加独立的 Div 模块 完善网页内容 3 通过对每个模块分别设置 CSS 样式表完成网页显示效果的设置 环节三 完成课堂讲解的练习例题 并疑难解答 环节四 复习本次课内容 步骤课后作业 章节名称章节名称 DIV CSSDIV CSS 设计实例设计实例 花店页面设计下花店页面设计下 课堂类型课堂类型 理论 实训 练习 测试 学时安排学时安排 2 课时 目的要求目的要求 掌握 DIV CSS 设计网页的模式与技巧 重重 点点 21 掌握 DIV CSS 设计网页的模式与技巧 难难 点点 掌握 DIV CSS 设计网页的模式与技巧 教法学法教法学法 1 采用教授法进行教学讲解 结合疑难点师生互动交流方式进行 2 练习采用学生自主安排 教师给与个别辅导的方式进行 参考资料参考资料 Dreamweaver CS5 网页设计与制作 DIV CSS 版 吴丰 丁欣 主编 清华大学出版社 动态网页制作教程 第二版 刘梅彦 徐英慧 编著 清华大学出版社 教学过程教学过程 环节一 复习采用 DIV CSS 模式设计网页的方法 讲解上次课布置的作业 环节二 让学生完成花店网页设计练习 疑难解答 章节名称章节名称 PhotoshopPhotoshop 设计网页设计网页 课堂类型课堂类型 理论 实训 练习 测试 学时安排学时安排 2 课时 目的要求目的要求 掌握 Photoshop 软件在网页设计中的运用 重重 点点 掌握使用 Photoshop 软件设计网页的方法 难难 点点 利用切片工具对网页进行分割 教法学法教法学法 1 采用教授法进行教学讲解 结合疑难点师生互动交流方式进行 2 练习采用学生自主安排 教师给与个别辅导的方式进行 参考资料参考资料 Dreamweaver CS5 网页设计与制作 DIV CSS 版 吴丰 丁欣 主编 22 清华大学出版社 动态网页制作教程 第二版 刘梅彦 徐英慧 编著 清华大学出版社 教学过程教学过程 环节一 复习采用表格布局模式设计网页的方法 环节二 介绍 Photoshop 软件在网页设计中的应用 通过一个产品介绍网页的实 例说明设计的方法 Photoshop 设计网页的方法 1 通过布局 色彩搭配 将草图设计的网页在计算机上以图片形式绘制出来 2 对于设计好的图片形式的网页 通过 Photoshop 软件的切片功能 将图片的网 页分割为各个部分模块 再导出为 web 格式的文件 环节三 完成课堂讲解的练习例题 并疑难解答 章节名称章节名称 网页设计中的动画 网页设计中的动画 FlashFlash 动画动画 课堂类型课堂类型 理论 实训 练习 测试 学时安排学时安排 2 课时 目的要求目的要求 掌握网页制作中 Flash 动画的设计方法技巧 重重 点点 掌握网页制作中 Flash 动画的设计方法技巧 难难 点点 掌握网页制作中 Flash 动画的设计方法技巧 教法学法教法学法 1 采用教授法进行教学讲解 结合疑难点师生互动交流方式进行 2 练习采用学生自主安排 教师给与个别辅导的方式进行 参考资料参考资料 Dreamweaver CS5 网页设计与制作 DIV CSS 版 吴丰 丁欣 主编 清华大学出版社 23 动态网页制作教程 第二版 刘梅彦 徐英慧 编著 清华大学出版社 教学过程教学过程 环节一 复习 Photoshop 软件设计网页的方法 讲解上次课布置的作业 环节二 介绍 Flash 动画在网页中的应用 以网站首页光芒文字动画的制作为例 介绍 Flash 动画的设计方法 设计步骤 1 创建动画文字内容 复制一份 并修改其颜色 2 添加遮罩所用的长方形条 设置其从第 1 帧到 100 帧移动的动画效果 3 设置方形条为遮罩 4 动画效果测试 环节三 完成课堂讲解的练习例题 并疑难解答 章节名称章节名称 网页设计实用工具介绍 网页设计实用工具介绍 课堂类型课堂类型 理论 实训 练习 测试 学时安排学时安排 2 课时 目的要求目的要求 掌握几个常用的网页设计工具的使用方法 重重 点点 掌握几个常用的网页设计工具的使用方法 难难 点点 掌握几个常用的网页设计工具的使用方法 教法学法教法学法 1 采用教授法进行教学讲解 结合疑难点师生互动交流方式进行 2 练习采用学生自主安排 教师给与个别辅导的方式进行 参考资料参考资料 Dreamweaver CS5 网页设计与制作 DIV CSS 版 吴丰 丁欣 主编 清华大学出版社 动态网页制作教程 第二版 刘梅彦 徐英慧 编著 清华大学出版社 24 教学过程教学过程 环节一 复习采用 Flash 制作网页动画的方法 环节二 介绍几个网页制作的实用工具 通过实例说明其应用的方法 1 Flashbannermaker 软件 能利用简单的设置 完成一个网页的 Banner 动画 2 Firework 软件 利用该工具 可以设计网页中的图标 环节三 完成课堂讲解的练习例题 并疑难解答 章节名称章节名称 JavascriptJavascript 语言基础语言基础 1 1 课堂类型课堂类型 理论 实训 练习 测试 学时安排学时安排 2 课时 目的要求目的要求 掌握 JavaScript 程序设计的基础知识 重重 点点 能运用 JavaScript 语言实现网页中的特定功能 难难 点点 能运用 JavaScript 语言实现网页中的特定功能 教法学法教法学法 1 采用教授法进行教学讲解 结合疑难点师生互动交流方式进行 2 练习采用学生自主安排 教师给与个别辅导的方式进行 参考资料参考资料 Dreamweaver CS5 网页设计与制作 DIV CSS 版 吴丰 丁欣 主编 清华大学出版社 动态网页制作教程 第二版 刘梅彦 徐英慧 编著 清华大学出版社 教学过程教学过程 环节一 复习网页设计几个常用工具的使用方法 25 环节二 讲解 Javascript 程序设计的基础知识 通过实例说明其使用的方法 1 Javascript 程序的基本结构 在网页 Html 代码中添加如下代码 2 Javascript 基本语法 1 变量命名 字母或下划线开头 字母数字下划线的组合 2 变量定义方式 以 var 变量名的方式定义 例如 var username 3 变量类型 整型 实型 布尔型 字符串等 4 运算符 包括算术运算符 比较运算符 逻辑运算符等 5 分支结构程序 IF IF Else 语句的使用 3 以一个判断输入用户名和密码是否为空的 Javascript 程序为例 介绍其使用 的方法 环节三 完成课堂讲解的练习例题 并疑难解答 环节四 复习本次课内容 步骤课后作业 26 章节名称章节名称 JavascriptJavascript 语言基础语言基础 2 2 课堂类型课堂类型 理论 实训 练习 测试 学时安排学时安排 2 课时 目的要求目的要求 掌握 JavaScript 语言中循环程序的编写 重重 点点 掌握 JavaScript 语言中循环程序的编写 难难 点点 掌握 JavaScript 语言中循环程序的编写 教法学法教法学法 1 采用教授法进行教学讲解 结合疑难点师生互动交流方式进行 2 练习采用学生自主安排 教师给与个别辅导的方式进行 参考资料参考资料 Dreamweaver CS5 网页设计与制作 DIV CSS 版 吴丰 丁欣 主编 清华大学出版社 动态网页制作教程 第二版 刘梅彦 徐英慧 编著 清华大学出版社 教学过程教学过程 环节一 复习 Javascript 程序的基础知识 讲解上次课的作业 环节二 讲解 Javascript 程序设计的循环语句 通过实例说明其使用的方法 1 for 语句 格式 for 初始表达式 条件表达式 增量表达式 语句集 功能 实现条件循环 当条件成立时 执行语句集 否则跳出循环体 2 while 语句 格式 while 条件 语句集 说明 while 语句不断的测试一个条件 如果条件始终成立 则这个循环会一致持 续下去 直到条件不再成立为止 27 3 do while 语句 格式 do 语句集 while 条件 说明 do while 语句首先不管 while 中的条件是否成立 总是先执行一次循环 完成第一次循环后 do while 语句才试图判定 while 中的条件 如果成立 就 继续循环 如果条件不成立 就跳到循环后的第一条语句去执行 环节三 完成课堂讲解的练习例题 并疑难解答 环节四 复习本次课内容 步骤课后作业 章节名称章节名称 JavascriptJavascript 应用实例应用实例 跑马灯效果与时钟显示效果跑马灯效果与时钟显示效果 课堂类型课堂类型 理论 实训 练习 测试 学时安排学时安排 2 课时 目的要求目的要求 掌握运用 JavaScript 语言实现特定功能的能力 重重 点点 掌握运用 JavaScript 语言实现特定功能的能力 难难 点点 掌握运用 JavaScript 语言实现特定功能的能力 教法学法教法学法 1 采用教授法进行教学讲解 结合疑难点师生互动交流方式进行 2 练习采用学生自主安排 教师给与个别辅导的方式进行 参考资料参考资料 Dreamweaver CS5 网页设计与制作 DIV CSS 版 吴丰 丁欣 主编 清华大学出版社 动态网页制作教程 第二版 刘梅彦 徐英慧 编著 清华大学出版社 28 教学过程教学过程 环节一 复习 JavaScript 语言循环语句的知识 讲解上次课布置的作业 环节二 通过网页设计中一个跑马灯效果和一个时钟显示效果的例子说明如何根 据需求设计 JavaScript 程序 1 跑马灯效果 功能效果 实现图片的滚动显示 2 时钟显示效果 功能效果 将系统的时间以特定的格式显示在一个输入文本框中 扩展练习 考试倒计时功能的设计 环节三 完成课堂讲解的练习例题 并疑难解答 章节名称章节名称 JavascriptJavascript 应用实例应用实例 2 2 在线考试网页设计在线考试网页设计 课堂类型课堂类型 理论 实训 练习 测试 学时安排学时安排 2 课时 目的要求目的要求 掌握 JavaScript 程序综合设计的能力 重重 点点 掌握 JavaScript 程序综合设计的能力 难难 点点 掌握 JavaScript 程序综合设计的能力 教法学法教法学法 1 采用教授法进行教学讲解 结合疑难点师生互动交流方式进行 2 练习采用学生自主安排 教师给与个别辅导的方式进行 29 参考资料参考资料 Dreamweaver CS5 网页设计与制作 DIV CSS 版 吴丰 丁欣 主编 清华大学出版社 动态网页制作教程 第二版 刘梅彦 徐英慧 编著 清华大学出版社 教学过程教学过程 环节一 复习上节课介绍的 JavaScript 设计案例 环节二 通过一个考试系统页面的设计案例 分析 JavaScript 程序设计的流程 与技巧 提高学生编写 JavaScript 程序的熟练度 环节三 完成课堂讲解的练习例题 并疑难解答 章节名称章节名称 JavascriptJavascript 应用实例应用实例 3 3 kindeditorkindeditor 文本编辑器的应用文本编辑器的应用 课堂类型课堂类型 理论 实训 练习 测试 学时安排学时安排 2 课时 目的要求目的要求 掌握基于 JavaScript 开发的工具的使用方法 重重 点点 掌握基于 JavaScript 开发的一个 kindeditor 文本编辑工具的使用方法 30 难难 点点 掌握基于 JavaScript 开发的一个 kindeditor 文本编辑工具的使用方法 教法学法教法学法 1 采用教授法进行教学讲解 结合疑难点师生互动交流方式进行 2 练习采用学生自主安排 教师给与个别辅导的方式进行 参考资料参考资料 Dreamweaver CS5 网页设计与制作 DIV CSS 版 吴丰 丁欣 主编 清华大学出版社 动态网页制作教程 第二版 刘梅彦 徐英慧 编著 清华大学出版社 教学过程教学过程 环节一 复习上节课介绍的 JavaScript 设计案例 环节二 讲解一个基于 Javascript 库开发的在线文本编辑工具 kindeditor 的应 用 应用步骤 1 将 kindeditor 目录下的 目录下的 bin 目录中的 LitJSON dll 拷贝到 整个项目的 bin 目录下 2 点击项目的引用 右键 将 LitJSON dll 添加到项目的引用中 3 参考 文件夹中的 demo aspx 文件 将对应的内容添加到需要添加文本 编辑器的 aspx 动态页面 4 在页面中的 HTML 代码 Body 中添加一个 TextBox 控件 ID 名称为 editor id 5 接下来 在页面代码的第一行修改以下 添加 ValidateRequest False 6 在 A 文件夹中的 file manager json ashx 和 upload json ashx 文件中 修改图片 视频等文件的上传路径 7 要使用 editor id 控件的使用就跟普通 TextBox 的使用方法一致 环节三 完成课堂讲解的练习例题 并疑难解答 章节名称章节名称 JQueryJQuery 程序设计基础程序设计基础 课堂类型课堂类型 理论 实训 练习 测试 31 学时安排学时安排 2 课时 目的要求目的要求 掌握 JQuery 程序的基础知识及使用方法 重重 点点 掌握 JQuery 程序的基础知识及使用方法 难难 点点 掌握 JQuery 程序的基础知识及使用方法 教法学法教法学法 1 采用教授法进行教学讲解 结合疑难点师生互动交流方式进行 2 练习采用学生自主安排 教师给与个别辅导的方式进行 参考资料参考资料 Dreamweaver CS5 网页设计与制作 DIV CSS 版 吴丰 丁欣 主编 清华大学出版社 动态网页制作教程 第二版 刘梅彦 徐英慧 编著 清华大学出版社 教学过程教学过程 环节一 复习上节课介绍的 Kindeditor 工具的使用方法 环节二 介绍 JQuery 库的基础知识及使用方法 1 JQuery 是一个基于 Javascript 开发的库 代码简洁 功能强大 2 JQuery 下载后 将其拷贝到网站目录下 在页面的 HTML 代码中添加如下引用 3 页面载入 载入方法 添加如下代码 document ready function 简写 function 4 引用方式 有三种 1 标记 语法 p 2 类 语法 myclass 3 ID 32 语法 btnDemo 环节三 介绍一个点击文字消失的案例说明 JQuery 的使用 document ready function p click function this hide If you click on me I will disappear 环节四 完成课堂讲解的练习例题 并疑难解答 章节名称章节名称 JQueryJQuery 应用实例应用实例 课堂类型课堂类型 理论 实训 练习 测试 学时安排学时安排 2 课时 目的要求目的要求 掌握 JQuery 程序综合应用的能力 重重 点点 掌握 JQuery 程序综合应用的能力 难难 点点 掌握 JQuery 程序综合应用的能力 教法学法教法学法 1 采用教授法进行教学讲解 结合疑难点师生互动交流方式进行 2 练习采用学生自主安排 教师给与个别辅导的方式进行 参考资料参考资料 33 Dreamweaver CS5 网页设计与制作 DIV CSS 版 吴丰 丁欣 主编 清华大学出版社 动态网页制作教程 第二版 刘梅彦 徐英慧 编著 清华大学出版社 教学过程教学过程 环节一 复习上节课介绍的 JQuery 的基础知识 环节二 通过一个窗口淡入淡出的案例 分析 JQuery 程序设计的流程与技巧 环节三 介绍 JQuery UI 库的基本情况 并通过一个日期选择器 环节三 完成课堂讲解的练习例题 并疑难解答 章节名称章节名称 表单处理 表单处理 课堂类型课堂类型 理论 实训 练习 测试 学时安排学时安排 2 课时 目的要求目的要求 掌握网页设计中表单的使用方法 重重 点点 掌握网页设计中几种常用的表单控件的使用 难难 点点 掌握表单的使用技巧 教法学法教法学法 1 采用教授法进行教学讲解 结合疑难点师生互动交流方式进行 2 练习采用学生自主安排 教师给与个别辅导的方式进行 参考资料参考资料 Dreamweaver CS5 网页设计与制作 DIV CSS 版 吴丰 丁欣 主编 清华大学出版社 动态网页制作教程 第二版 刘梅彦 徐英慧 编著 清华大学出版社 教学过程教学过程 环节一 复习上节课介绍的 JQuery 的应用案例 环节二 通过一个用户注册的页面设计案例 介绍表单及文本框 单选按钮 复 34 选框 下拉框 按钮等控件的使用 表单的数据提交方式 1 post 方式 通过 Request Form 方式接收数据 2 get 方式 通过 Request QueryString 方式接收页面传递的数据 环节三 完成课堂讲解的练习例题 并疑难解答 章节名称章节名称 SprySpry 控件创建选项卡式网页控件创建选项卡式网页 课堂类型课堂类型 理论 实训 练习 测试 学时安排学时安排 2 课时 目的要求目的要求 掌握 Spry 控件创建选项卡式网页的方法 重重 点点 掌握 Spry 控件创建选项卡式网页的方法 难难 点点 掌握 Spry 控件创建选项卡式网页的方法 教法学法教法学法 1 采用教授法进行教学讲解 结合疑难点师生互动交流方式进行 2 练习采用学生自主安排 教师给与个别辅导的方式进行 参考资料参考资料 Dreamweaver CS5 网页设计与制作 DIV CSS 版 吴丰 丁欣 主编 35 清华大学出版社 动态网页制作教程 第二版 刘梅彦