Dreamweaver网页制作课件 第14章 布局模式、模式与资源列表.pptVIP

制作网页前首先要进行布局，否则将难以继续进行网页的创建，而模板与资源列表则可以帮助用户快速地创建相同风格的网页。 布局与模板 使用资源列表 使用库 任务一 布局与模板 制作网页前首先要进行布局，否则将难以继续进行网页的创建，本节讲解布局和模板的关系。 阶段1 布局模式 页面布局，就是指通过对页面内容框架的安排，确定网页中导航条、图像、文本内容以及其他网页对象的显示位置，以达到规整网页结构，完善内容显示效果的目的。在Dreamweaver 8中，提供了专门的页面布局视图，以方便用户在其中进行网页布局。 1.进入/退出布局模式 （1）选择“插入”面板中的“布局”面板，在面板中单击“布局模式”按钮。 （2）在文档顶部显示的布局模式标签，表示现在正处于布局视图；如果要退出布局模式，则只需要单击旁边的“退出”按钮，即可返回到标准模式视图。 2.绘制布局表格 （1）在布局视图中，单击“布局”面板中的“布局表格”按钮 ，鼠标指针变为手指形。 （2）按住左键在文档中拖动鼠标（左图），即可在文档绘制一个布局表格（右图）。 阶段2 使用模板 模板其实也是一个文档，可以将其作为创建其他文档的基础；熟练地应用模板，可以轻松快速地制作出多个样式相同、内容不同的网页。下面分别介绍创建模板、定义可编辑区域和应用模板的操作方法。 1.创建模板 （1）在Dreamweaver 8中选择“文件→打开”命令，打开一个已经制作好的网页文档，然后选择“文件→另存为模板”命令。 （2）在打开的“另存为模板”对话框的“站点”下拉列表中选择站点，然后在“另存为”文本框中输入保存的模板名称。 （3）单击“保存”按钮，模板文件即被保存在站点目录的“Templates”文件夹中。 在Dreamweaver 8中还可以通过直接创建来新建一个空白模板文件，其操作步骤如下。 （1）在Dreamweaver 8中选择“文件→新建”命令，打开“新建文档”对话框。 （2）在对话框的“常规”标签中，在“类别”列表选中“模板页”，再在“模板页”列表中选择“HTML模板”项，然后单击“创建”按钮。 （3）在Dreamweaver 8中可以看到已经成功地创建了一个空白模板页。 2.定义可编辑区域 模板文件中的内容分为锁定区域和可编辑区域。创建好模板内容后，就需要设置这些内容是否为可编辑区域，才能在应用了模板的文档中进行可编辑区域的修改编辑。 （1）在Dreamweaver 8中打开模板文件，在文档中选择要定义为可编辑区域的内容。 （2）选择“插入→模板对象→可编辑区域”命令（左图），打开“新建可编辑区域”对话框（右图）。 （3）在“新建可编辑区域”对话框中为可编辑区域命名，然后单击“确定”按钮，完成可编辑区域的创建。 （4）在文档中可以看到可编辑区域被一个矩形框围起来，在左上角的标签上显示有可编辑区域的名称。 删除可编辑区域 在Dreamweaver 8中为模板创建了可编辑区域后，可以将其删除变回锁定区域。其操作方法很简单，只需要在文档中选择要修改的可编辑区域，然后选择“修改→模板→删除模板标记”命令，即可将可编辑区域转变为锁定区域。 3.应用模板 （1）在Dreamweaver 8新建一个空白文档，然后选择“窗口→资源”命令（左图），打开“资源”面板，并在面板左侧单击“模板”按钮（右图）。 （2）在“资源”面板的模板分类中，选择要应用的模板文件后，单击面板中的“应用”按钮（左图），即可在文档中应用选择的模板（右图）。 任务二 使用资源列表 在Dreamweaver 8中，资源是指存储在站点中的各种元素，如图像、影片和动画等。要查看站点中的资源，可以通过“资源”面板查看，包括“站点”和“收藏”两种查看方式 阶段1 “资源”面板 图像 ：包括了站点的图像文件，能够显示GIF、JPEG和PNG3种类型的图像。 颜色 ：站点中所有网页使用的颜色信息，包括文本颜色、背景颜色和链接颜色信息。 URLs ：站点中的外部链接信息，包括FTP、gopher、HTTP和电子邮件链接等。 Flash ：站点中的Flash格式文件。在资源面板中仅显示SWF文件，而不显示Flash源文件。 Shockwave ：站点中的Shockwave格式文件。 影片 ：站点的中的QuickTime或MPEG等格式的视频文件。 脚本 ：站点中的独立的JavaScript或VBScript文件。 模板 ：站点的中模板文件，通过模板文件可以快速的制作大量风格相同的网页。 库 ：站点中的库项目，可以在多个页面中使用，当修改一个项目时，所有包含该项目的网页都同时被更新。 阶段2 使用站点资源 （1