2讲DW快速入门课件.pptVIP

第2章 DW快速入门 本章重点 熟悉Dreamveaver 界面 理解各个面板及菜单 学会如何利用DW创建简单网页 Dreamveaver简单介绍 Macromedia Dreamweaver MX 是一款专业的 HTML 编辑器，用于对 Web 站点、Web 页和 Web 应用程序进行设计、编码和开发。无论您愿意享受手工编写 HTML 代码时的驾驭感还是偏爱在可视化编辑环境中工作，Dreamweaver 都会为您提供有用的工具，使您拥有更加完美的 Web 创作体验。 利用 Dreamweaver 中的可视化编辑功能，您可以快速地创建页面而无需编写任何代码。您可以查看所有站点元素或资源并将它们从易于使用的面板直接拖到文档中。您可以在 Macromedia Fireworks 中创建和编辑图像，然后将它们直接导入 Dreamweaver，或者直接在 Dreamweaver 中添加 Macromedia Flash 对象，从而优化您的开发工作流程。 Dreamweaver 还包括多种与编码相关的工具和功能 选择工作区布局（仅适用于 Windows） 初次安装并启动DW后,会显示以下对话框,让使用者选择工作布局 2.1界面的结构 工作界面 菜单栏：提供了全面DW命令； 文档工具栏：快速地使用一些功能； 插入栏：包含多个选项卡，每个选项卡都提供了可插入文件中的对象； 编辑区：对网页进行可视化编辑； 属性检查器：对选择对象属性进行设置； 状态栏：标签选择器提供快捷选择HTML方法。窗口大小，下载时间。 2.2文档工具栏及插入栏 若要查看或隐藏文档工具栏，请选择“查看”“工具栏”“文档”。 2.2文档工具栏及插入栏 设计备注是您为文件创建的备注。设计备注与它们所描述的文件相关联，但存储在单独的文件中。您可以使用设计备注来记录与文档关联的其他文件信息，如图像源文件名称和文件状态说明。 2.3“文档”窗口 “文档”窗口显示当前文档。可以选择下列任一视图 “设计”视图 、“代码”视图 、“代码和设计”视图 标签选择器显示环绕当前选定内容的标签的层次结构。单击该层次结构中的任何标签以选择该标签及其全部内容。单击 body 以选择文档的整个正文。若要设置标签选择器中某个标签的 class 或 id 属性，请右击 (Windows) 或按住 Control 并单击 (Macintosh) 该标签，然后从上下文菜单中选择一个类或 ID。 2.4面板组 Dreamweaver 中的面板被组织到面板组中。每个面板组都可以展开或折叠，并且可以和其它面板组停靠在一起或取消停靠。 面板组还可以停靠到集成的应用程序窗口中（仅适用于 Windows 集成工作区）。这使得能够很容易地访问所需的面板，而不会使工作区变得混乱。面板组内的面板显示为选项卡。 查看一个面板组的“选项”菜单： 通过单击展开箭头展开该面板组。“选项”菜单仅当面板组展开时才可见。 重命名面板组关闭一个面板组使它完全消失： 打开屏幕上不可见的面板组： 从“窗口”菜单中选择一个面板的名称。 2.5属性检查器 属性检查器使您可以检查和编辑当前选定页面元素（如文本和插入的对象）的属性。您既可以在“设计”视图也可以在“代码”视图中选择页面元素。 若要显示或隐藏属性检查器，请选择“窗口”“属性”。 您对属性所做的大多数更该会立刻应用在“文档”窗口中。但是对于有些属性，直到您在属性编辑文本域外单击、按下 Enter 键 (Windows) 或 Return 键 (Macintosh) 或者按下 Tab 键切换到其他属性时，才会应用更改 2.5属性检查器 属性检查器的内容根据选定的元素而变化。要了解有关特定属性的信息，请在“文档”窗口中选择一个元素，然后单击属性检查器右上角的“帮助”图标。 属性检查器最初显示选定元素的大多数属性。单击属性检查器右下角的展开箭头，可以折叠属性检查器使之仅显示最常用的属性。 提示： 在少数情况下，某些不重要的属性即使在展开的属性检查器中也可能不显示；在这些情况下，可以使用“代码”视图或代码检查器手工对这些属性进行编码，或者在“代码”视图中选择该标签然后选择“修改”“编辑标签”。 2.6创建一个简单的网页 步骤：文件—新建—常规选项—基本页—html—保存 插入文字 插入软回车2种方法 插入图象 插入超级链接[文字、图象] 保存并退出 2.7 DW与html 在IE中查看页面源文件方法2种 在DW中查看网页源文件方法： 1、文档工具栏-显示代码视图和设计视图； 2、文档工具栏-显示代码视图和； 3、窗口—其它—代码检查器或者F10 在DW中设置BODY属性 修改菜单—页面属性 2.7