2第1章DreamweaverCS4简介.pptVIP

附记 难点 重点 新建一个文档，熟悉界面设置及页面属性的设置 作业 页面属性的设置 讲授与上机演示相结合 授课方式 界面的设置、页面属性的设置 教材分析 了解：系统工作界面， 掌握：各工具面板的显示/隐藏、拆分与组合、停靠，外部编辑器的设置、页面相关属性的设置 目的 要求 Dreamweaver CS3工作界面、相关参数设计、页面属性设置、文件菜单 教学 内容 1. 选择工具界面 教学进程 Dreamweaver 介绍 二、 Dreamweaver 的工作界面 2. 主窗口介绍 3. 主菜单介绍 4. 视图方式 1. 选择工具界面 教学进程 1.1 Dreamweaver 介绍 二、 Dreamweaver 的工作界面 2. 主窗口介绍 3. 主菜单介绍 4. 视图方式 插入工具栏 文档工具栏 面板组 标签选择器 属性面板 文档窗口 1. 选择工具界面 教学进程 1.1 Dreamweaver 介绍 二、 Dreamweaver 的工作界面 2. 主窗口介绍 3. 主菜单介绍 4. 视图方式 ● 【文件】菜单用于查看当前文档或对当前文档执行操作。 ● 【编辑】菜单包含常用的命令。还提供了【首选参数】，可以对Dreamweaver做一些细致的调整。 ● 【查看】菜单查看文档的各种视图，可以显示和隐藏不同类型的页面元素、工具和工具栏。 ● 【插入】菜单提供【插入】栏的替代项，用于将对象插入到文档中。 ● 【修改】菜单使你可以更改选定页面元素或项的属性。 1. 选择工具界面 教学进程 1.1 Dreamweaver介绍 二、 Dreamweaver 8的工作界面 2. 主窗口介绍 3. 主菜单介绍 4. 视图方式 ● 代码视图：可以直接编辑网页的源代码。 ● 设计视图：能更好地美化网页，更合理地布局网页。 ● 拆分视图：同时显示代码视图和设计视图，让我们能够更好地理解源代码，提高编程能力。 教学进程 1.2 Dreamweaver CS3 的参数设置 通过设置参数，可以改变操作环境，更加符合设计者的需要。1、预览设置：设计过程中随时在浏览器中打开设计的文档，以查看其设计效果，及时更正和完善。 编辑/首选项/在浏览器中预览2、设置外部编辑器与页面元素相关的外部编辑器相连接，外部编辑器编辑并存储后，直接应用到文档中。例：将jpg文档的外部编辑器设置成ps编辑/首选项/文件类型/编辑器 教学进程 1.2 修改页面 属性 1、打开相应页面：站点面板内双击目标页面文件或打开/选择目标页面文件。2、打开相应页面属性面板：修改/页面属性外观：文本：页面上默认的文本（字体、大小及颜色）；背景：页面所用的背景色或图；重复：当使用背景图时，背景的处理方式；边距：页面的左、右、上、下边界（一般为0）。链接：本页默认的超级链接状态：未访问的、访问过、活动的链接的字体、大小、颜色及下划线的状态。页标题：服务器上浏览时显示在浏览器标题栏上的内容。文档编码：本页的解码方式跟踪图像：一张用来模仿的图片。 教学进程 1.3 文件操作 1、新建文档2、保存文档：可存为HTML格式或模板3、打开现有文档 教学进程 习题与上机操作 1. 问答题 Dreamweaver有三种视图方式，分别叙述这三种视图的用途。 教学进程 习题与上机操作 2. 上机操作题 （1）启动Dreamweaver，并熟悉其工作界面的各个组成部分。 （3）在创建好的站点中创建以下一级目录：img，jianjie，wenxue，huihua及相应页面文件index.htm，jianjie.htm，wenxue.htm，huihua.htm。打开index.htm文件修改其页面属性。 （2）windows下在本地硬盘上创建一个名为“ys学号姓名（例ys26王亮）”的文件夹，然后使用Dreamweaver将其定义为一个本地站点。 （4）准备各栏目的相应素材，在windows下将其复制到站点对应的目录中。