网页制作基础教程 第2版 作者 邓振杰 第12章.pptVIP

* 第12章 利用模板和库设计网页 【本章学习目标】 ● 模板原理。 ● 创建、使用和管理模板的方法。 ● 利用模板更新网页。 ● 创建管理库项目。 ● 利用库更新网页。 在线教务辅导网： 教材其余课件及动画素材请查阅在线教务辅导网 QQ:349134187 或者直接输入下面地址： 12.1 利用模板创建网页 12.1.1 模板原理 Dreamweaver 模板是一种特殊类型的文档，用户利用模板可以在短时间内设计大量风格相同或相近的页面。 模板由可编辑区域和不可编辑区域（又称锁定区域）两部分组成。 不可编辑区域包含了在所有页面中共有的元素，即构成页面的基本框架； 可编辑区域是为添加相应的内容而设置的，可以快速地更新整个站点中所有使用了模板的页面布局。 12.1.2 创建模板 1．将现有的文档保存为模板 将现有的文档保存为模板的操作步骤如下。 （1）在Dreamweaver CS3中打开现有文档。 （2）选择“文件”→“另存为模板”命令，或在“插入”面板的“常用”类别中选择“模板”，然后单击“创建模板”按钮 ，打开“另存模板”对话框。 （3）在“站点”下拉列表框中选择站点名称，在“另存为”文本框中输入模板名称。 （4）单击“保存”按钮，就把当前页面保存为模板。系统将自动在站点根目录下创建“Templates”文件夹，并将创建的模板文件保存在该文件夹中。 2．通过“资源”面板创建新模板 （1）选择“窗口”→“资源”命令或按F11键，打开“资源”模板。 （2）单击左边的“模板”按钮 ，打开“资源”面板的模板类别。面板的上方是模板的预览效果，下方是模板文件列表。 （3）单击“资源”面板上右下角的“新建模板”按钮 ，这时在模板列表框中添加了一个“无标题”的模板。 （4）输入模板名称，并保存模板，就创建了一个空白模板。 单击“资源”面板右下角的“编辑”按钮 ，就可在“文档”窗口中打开该模板文档。 3．创建嵌套模板 创建嵌套模板的方法如下。 （1）执行下列操作之一，创建一个基于模板的文档。 ● 用鼠标右键单击“资源”面板的模板类别上想要使用的模板，从弹出的快捷菜单中选择“从模板新建”命令。 ● 选择“文件”→“新建”命令，在“新建文档”对话框中，单击“模板中的页”选项卡，选择包含使用模板的站点，然后在文档列表中双击该模板来创建新文档。 （2）选择“文件”→“另存为模板”命令，或在“插入”面板的“常用”类别中选择“模板”，然后单击“创建嵌套模板”按钮 ，打开“另存模板”对话框，将新文档另存为模板。 （3）在新模板中可编辑区域添加其他内容。 （4）保存该模板。 12.1.3 定义可编辑区域 1．定义可编辑区域 一种是选择已有的一部分页面内容将它指定为可编辑区域，另一种是在当前光标处插入一个空的可编辑区域。 （1）在“文档”窗口中，执行下列操作之一选择区域。 ● 选择想要设置为可编辑区域的文本或内容。 ● 将插入点放在想要插入可编辑区域的地方。 （2）执行下列操作之一打开如图所示的“新建可编辑区域”对话框。 （3）在“名称”文本框中输入该区域名称，注意不能对特定模板中的多个可编辑区域使用相同的名称，也不要在“名称”域中使用特殊字符。 （4）单击“确定”按钮。可编辑区域在模板中由高亮显示的矩形边框围绕，该区域左上角的选项卡显示该区域的名称。 2．删除可编辑区域 如果已经将模板文件的一个区域定义为可编辑区域，而现在想要再次锁定它，使其为不可编辑区域，可执行“删除模板标记”操作。 （1）在文档或标签选择器中，选择想要更改的可编辑区域。 （2）按Delete键，即可删除该可编辑区域。如果选择“修改”→“模板”→“删除模板标记”命令，可以删除可编辑区域的标记，但区域还保留。 12.1.4 使用模板 1．创建基于模板的新页面 选择“文件”→“新建”命令，打开“新建文档”对话框，选择“模板中的页”标签，在“站点”列表中选择需要的站点，在“站点‘…’的模板”列表中选择需要的模板，此时对话框的右边显示该模板的效果图，单击“创建”按钮。 在创建的新页面中，前面定义的不可编辑区域中鼠标选择不可用，呈现 状态。而在可编辑区鼠标选择功能可用，可以直接在其中输入特定的内容。 2．将模板应用到现有文档 （1）选择“文件”→“打开”命令，打开想要应用模板的文档。 （2）执行下列操作之一。 ● 在“文档”窗口中单击，然后选择“修改”→“模板”→“应用模板到页”菜单命令，“选择模板”对话框。选择所需站点，并从“模板”列表中选择一个模板并单击“选择”按钮。 ● 在“资源”面板的“模板”类别中选择模板，然后单击面板底部的“应用”按钮。 ● 将模板从“资源”面板的“模板”类别中拖曳到“文