Dreamweaver全套教案3篇
下面是范文网小编整理的Dreamweaver全套教案3篇，欢迎参阅。
第一部分 网页基础
1、了解网页设计的相关知识：
Frontpage/网页四剑客/ Html/ Asp/ Java脚本语言等
2、熟悉Dreamweaver工作窗口
3、掌握常用工具的打开方法
文档/标准/插入/属性/CSS样式/行为/站点/资源/框架/层/时间轴等
4、掌握HTML网页源代码编写的基本语法结构 第二部分 HTML的使用
1、HTML是超文本标记/描述语言，它编写网页源代码，是网页设计的基础。
2、掌握HTML的语法规则
3、掌握常用标签的使用，实例演示
4、页面属性设置：修改→页面属性(Ctrl+J)练习题：通过HTML设计简单网页 要求：1>新建站点
2>在站点中新建一个普通网页
3>在普通网页中添加常用网页元素 第三部分 文本的编辑与基本操作
1、熟悉网页的组成元素，其中文字是最基本的，是网页的主体，主要用来传达信息。
2、掌握文本的创建与编辑操作
3、设置网页文字效果
利用属性面板/插入面板
4、利用文本创建超链接
5、网页属性设置（页面属性/系统网页样式）上机练习：
图文混排（包括文本编辑/文本格式/水平线/超链接/ 图片/表格等）
第四部分 网页图像
1、图像点缀网页，形象直观、丰富多彩
2、掌握图像在网页中的作用及常用图像格式
3、掌握在网页中创建各种图像的具体操作
4、编辑图像（设置图像属性）
热点链接及改变大小等
练习：变换图片效果（照片变换）第五部分 层叠样式表（CSS）
1、了解CSS的含义、作用、分类
2、具体操作（样式面板）
创建CSS样式/编辑样式表/删除样式表/附加样式表/应用CSS样式 上机练习：
<1>新建样式（内部样式）
<2>新建一个外部样式表文件（.css）<3>新建CSS特殊样式（格式化超链接）<4>制作电子相册
第六部分 页面的版面布局
1、了解版面布局设计方案及要求
2、利用表格布局网页
掌握表格的创建、编辑、设置属性 上机练习：
用隐藏的表格进行整个网页布局
3、层的使用
<1>了解层的含义、作用 <2>层的操作（层面板）
创建/编辑/用层设计表格 上机练习： <1>在网页页面中应用描绘层实现图像和文字的精 <2>制作导航条（用导航条设计栏目）
准备好所需的按钮图片→插入面板→常用→导航条
4、使用框架布局页面
<1>了解框架的含义、作用、组成及HTML语法结构 <2>掌握创建框架的方法 <3>框架的基本编辑操作
选定/保存/删除/设置属性
第八部分 表单的使用（交互式表单）
1、了解表单的含义、作用、组成及HTML标签
2、认识各种表单对象并创建表单
3、使用行为验证表单
制作和验证客户表单或个人简历表单
4、提交表单
设置并上网申请站点→发布站点→预览效果 第九部分 生成动态特效（时间轴和行为）
一、时间轴
1、了解什么是时间轴及其作用
2、打开认识时间轴
3、使用时间轴创建动画
<1>创建层动画（文字/图像）：通过时间轴来改变图层的位置、大小、可见性及叠放顺序。<2>创建图像动画（切换）
4、编辑时间轴
二、行为
1、了解行为及其包含的基本元素
2、掌握网页设计中常用事件及常用动作
3、掌握为具体为对象附加行为的操作方法
举例：为网页中经常暴发的事件，指定执行各种特 定的任务
第十部分 插入多媒体组件
1、了解什么是多媒体
2、掌握在网页中应用Flash动画、声音文件、视频文
件、日期等
3、网页中使用计数器（免费申请获取代码→网站上传
→预览）
第十一部分 模板与库的应用
一、模板：
1、了解模板的定义、组成、作用、特点
2、认识模板面板
3、模板操作 创建（.dwt）/编辑/应用/更新/模板与文档分离/管理
二、库
1、了解库的概念、作用
2、了解什么是库项目、掌握库项目的创建/编辑/应用/更新/文档与库项目分离
教学内容：认识Dreamweaver及站点和文件的操作 目的要求：
1、了解Dreamweaver界面和面板操作方法；
2、掌握Dreamweaver站点的操作方法；
3、掌握Dreamweaver站点文件的操作方法。
教法教具：演示法、讲授法、提问法、讨论法、比较学习法 教学过程：
讲授新课：
认识Dreamweaver：
一、打开DM：
开始—程序—Adobe Dreamweaver—
二、认识DM：
标题栏、菜单栏、工具栏、编辑栏、状态栏、面板。工具栏：视图—工具栏—插入/文档/标准。面板：窗口—相应面板。折叠面板/展开面板。
三、网页制作步骤：
创建文件—设置标题—编辑内容—保存文件—浏览器查看效果。浏览网页：
1、在编辑状态下，按F12浏览。
2、保存文件，打开浏览器，打开文件浏览。
站点操作：
一、新建站点：
方法：
1、站点—新建站点；
2、站点—管理站点—新建—站点；
3、文件面板—站点下拉菜单—管理站点—新建—站点 步骤：
方法1：基本选项—给站点命名—不使用服务器—确定站点存储位置（选
Adobe Dreamweaver CS4 择已有文件夹或新建文件夹）--选择无远程服务器—完成。
方法2：高级选项—输入站点名称—选择本地根文件夹位置（选择已有文件夹或新建文件夹）
二、编辑站点：
方法：
1、站点—管理站点—选择站点—编辑—修改站点名称或存储位置；
2、文件面板—站点下拉菜单—管理站点—选择站点—编辑—修改站点名称或存储位置。
三、复制站点：
方法：
1、站点—管理站点—选择站点—复制；
2、文件面板—站点下拉菜单—管理站点—选择站点—复制。
四、删除站点：
方法：
1、站点—管理站点—选择站点—删除；
2、文件面板—站点下拉菜单—管理站点—选择站点—删除。
注意：站点删除后，仅删除了站点在DW中的指向，并未删除站点文件夹，站点文件夹的内容仍然存在。
五、建立站点的优点：
当站点下文件的位置或文件名发生变化时，与之相关联的文件能提示更新，使关联不发生错误。
站点下文件的操作：
一、新建文件：
方法
1、文件—新建—Html—创建 方法
2、文件面板：
折叠状态：右击站点名称或站下文件夹—快捷菜单选择“新建文件”
展开状态：文件—新建文件 注意：
可以通过第一种方法新建基于某种模板的新文件。
二、复制文件：
文件面板—文件名称上右击—编辑—复制。
三、重命名文件：
在文件面板下选择站点下的文件名称：
1、文件名称上右击—编辑—重命名
2、单击文件名称--按F2
3、两次单击文件名称
注意：
在站点给文件重命名后，若有文件与之相关联，会给出更新提示；而在资源管理器给文件重命名不会给出提示。
四、删除文件：
文件面板—选择站点下的文件名称—右击—编辑—删除或按Del。
注意：
在站点下删除文件后，站点下的文件被真删除。
在站点下删除文件，若有文件与之相关联，会给出提示；而在资源管理器删除不会给出提示。
五、新建文件夹：
文件面板—站点下的某文件夹位置上右击—新建—文件夹。
课后作业：
1、在Dreamweaver中新建本地站点有哪些方法？如何新建本地站点？
2、在Dreamweaver中新建html文件有哪些方法？
3、在Dreamweaver中，删除站点与在资源管理器删除站点文件夹效果是否相同？
4、在Dreamweaver中，删除站点内文件与在资源管理器删除站点内文件效果是否相同？
5、在Dreamweaver中，在站点内给文件重命名或移动文件与在资源管理器给文件重命名或移动文件效果是否相同？
第一课 软件简介与设置 课程介绍 本课程主要内容
①内容提要/学习目标 ②软件演示 ③实例操作步骤
本课程的三个特色栏目
①网页色彩搭配； ②HTML基础；
③名词解释
(软件)基础知识 内容提要：
①起始页的使用及相关设置；
②软件界面概览(菜单，工具，面板等)； ③“插入”工具栏显示模式的切换； ④文档窗口的工具栏和状态栏； ⑤如何设置，存储和管理界面布局。
学习目标：
①了解Dreamweaver软件的作用，基本界面布局，以及各功能区的应用范围；
②了解控制软件界面和文档的基本方法。