网页设计与制作第12章 使用库和模板

12.2.4
可编辑区域
可编辑区域是指可以进行添加、修改和删除网页元素等操作的区域。 可编辑区域控制在基于模板的页面中，用户可以编辑哪些区域。在插入 可编辑区域之前，需要将文档保存为模板。如果是在普通网页文档而不 是模板文档中插入可编辑区域，则会提醒用户系统会将该文档自动另存 为模板。 在【文档】窗口中，选择要设置为可编辑区域的内容或将插入点放在 要插入可编辑区域的位置，然后选择菜单命令【插入】/【模板对象】/ 【可编辑区域】（也可在鼠标右键快倢菜单中选择【模板】/【新建可编 辑区域】命令，或在【插入】面板【常用】类别的【模板】按钮组中单 击【可编辑区域】按钮），来打开【新建可编辑区域】对话框。
12.1.5
二、更新库项目
维护库项目
在库项目被修改保存后，引用该库项目的网页会进行自动更新。如果 没有进行自动更新，可以选择菜单命令【修改】/【库】/【更新当前页】， 对应用库项目的页面进行更新。也可选择菜单命令【修改】/【库】/【更新 页面】，打开【更新页面】对话框，根据需要更新相关页面。如果在【更新 页面】对话框的【查看】下拉列表中选择【整个站点】选项，然后从其右侧 的下拉列表中选择站点的名称，将会使用当前库项目更新所选站点中的所有 页面。如果选择【文件使用…】选项，然后从其右侧的下拉列表中选择库项 目名称，将会更新当前站点中所有应用了该库项目的文档。
12.2.8
使用模板创建网页
12.2.9
一、 打开附加模板
维护模板
12.1.3
一、创建空白库项目
创建库项目
选择菜单命令【窗口】/【资源】，打开【资源】面板，单击 【库】按 钮切换至【库】分类，单击面板右下角的 【新建库项目】按钮，新建一个 库项目，然后在列表框中输入库项目的新名称并按Enter键确认。此时它还 是一个空白库项目，可单击面板底部的 【编辑】按钮或双击库项目名称打 开库项目，在里面添加内容保存即可。
12.2.8
使用模板创建网页
二、 将现有文档应用模板 利用【资源】面板或通过【文档】窗口，可以将模板应用于现有文 档。如果需要，也可以撤消模板应用。 首先打开要应用模板的网页文档，然后选择菜单命令【修改】/ 【模板】/【应用模板到页】，或在【资源】面板的模板列表框中选中 要应用的模板，再单击面板底部的【应用】按钮，即可应用模板。 如果应用的是现有模板之一的修订版本，则名称可能会匹配。如果 将模板应用于一个尚未应用过模板的文档，则没有可编辑区域可供比 较并且会出现不匹配。Dreamweaver CS6将跟踪这些不匹配的内容， 这样就可以选择将当前页面的内容移到哪个或哪些区域，也可以删除 不匹配的内容。通常这时会打开【不一致的区域名称】对话框。
12.1.3
创建库项目
也可以选择菜单命令【文件】/【新建】，打开【新建文档】对话框， 选择【空白页】/【库项目】选项来创建空白库项目。此时创建的库项目是 打开的，添加内容后保存即可。
12.1.3
创建库项目
二、创建基于选定内容的库项目 用户也可以从网页文档body部分中的任意元素创建库项目，这些元素 包括文本、表格、表单和图像等。在页面中选择要创建库项目的元素，然后 选择菜单命令【修改】/【库】/【增加对象到库】，即可将选中的内容创建 为库项目，在【库】列表中输入库名称并确认即可。 在Dreamweaver中，创建的库项目保存在站点的“Library”文件夹内， 文件扩展名为“.lbi”，“Library”文件夹是自动生成的，不能对其名称进行 修改。
12.1.5
一、修改库项目
维护库项目
库项目创建以后，根据需要适时地修改其内容是不可避免的。如果要 修改库项目，需要直接打开库项目进行修改。在【资源】面板的库项目列表 中双击库项目，或先选中库项目，然后单击面板底部的【编辑】按钮打开库 项目。也可以在引用库项目的网页中选中库项目，然后在【属性】面板中单 击【打开】按钮打开库项目，这是一种快速打开库项目的方法。在打开库项 目后，根据需要编辑内容并保存即可。
12.2.8
一、 从模板新建网页
使用模板创建网页
选择菜单命令【文件】/【新建】，打开【新建文档】对话框，选 择【模板中的页】选项，然后在【站点】列表框中选择站点，在模板 列表框中选择模板，并选择【当模板改变时更新页面】复选框，以确 保模板改变时更新基于该模板的页面，然后单击【创建】按钮来创建 基于模板的网页文档。
12.2.7
可选区域
12.2.7
可选区域
用户可将可选区域设置为在基于模板的文档中显示或隐藏。当要为 在文档中显示内容设置条件时，可使用可选区域。使用可选区域可以 控制不一定在基于模板的文档中显示的内容。可选区域分为两类： •可编辑的可选区域 插入可编辑的可选区域的方法是，在【文档】窗口中，将插入点置 于要插入可选区域的位置（不能环绕选定内容来创建可编辑的可选区 域），然后选择菜单命令【插入】/【模板对象】/【可编辑的可选区 域】（也可在【插入】面板【常用】类别的【模板】按钮组中单击 【可编辑的可选区域】按钮），打开对话框，输入可选区域的名称， 如果要设置可选区域的高级参数，可选择【高级】选项卡。
学习目标
了解库和模板的概念。 掌握创建和应用库项目的方法。.1 教学案例━━励志小故事 12.1.2 认识库项目 12.1.3 创建库项目 12.1.4 添加库项目 12.1.5 维护库项目
12.1.1 教学案例━━励志小故事
将素材文档复制到站点文件夹下，然后使用库设置页面，在浏 览器中的显示效果如图12-1所示。
12.1.5
四、重命名库项目
维护库项目
在【资源】面板的【库】类别中选中库项目，然后单击库项目名称， 此时名称处于可编辑状态，接着输入新名称并按Enter键确认即可。也可在 库项目上单击鼠标右键，在弹出的快捷菜单中选择【重命名】命令来修改库 项目的名称。 五、删除库项目 在【资源】面板的【库】类别中选中库项目，单击面板底部的【删除】 按钮或直接在键盘上按Delete键即可删除库项目。一旦删除了库项目，将无 法进行恢复，因此应特别小心。
12.2.5
重复区域
重复区域是指可以复制任意次数的指定区域。重复区域是模板非常 重要的一部分，可以在基于模板的页面中重制多次。使用重复区域， 可以通过重复特定项目来控制页面布局，例如目录项、说明布局或者 重复数据行。实际上，重复区域经常与表格一起使用。
在【文档】窗口中，选择要设置为可编辑区域的内容或将插入点放 在要插入可编辑区域的位置，然后选择菜单命令【插入】/【模板对象】 /【重复区域】（也可在鼠标右键快倢菜单中选择【模板】/【新建重 复区域】命令，或在【插入】面板【常用】类别的【模板】按钮组中 单击【重复区域】按钮），来打开【新建重复区域】对话框，在【名 称】文本框中输入重复区域名称，单击【确定】按钮即可。重复区域 左上角的选项卡显示重复区域的名称。
12.2.4
可编辑区域
插入可编辑区域后，也可以在以后修改其名称。单击可编辑区域左上 角的标签，在【属性】面板的【名称】文本框中输入一个新名称，按 Enter键确认即可。 如果已经将模板文件的某个区域标记为可编辑，现在想要重新锁定该 区域（使其在基于模板的文档中不可编辑），请使用“删除模板标记” 命令。单击可编辑区域左上角的标签，然后选择菜单命令【修改】/【模 板】/【删除模板标记】，也可在鼠标右键快倢菜单中选择【模板】/【删 除模板标记】命令，该区域将不能再编辑。
12.2.3
一、基于新文档创建模板
创建模板
在【资源】面板中单击 【模板】按钮，切换到【模板】类别， 单击底部的 【新建模板】按钮，新建一个模板，然后在列表框中输 入模板的新名称并按Enter键确认即可。
12.2.3
创建模板
也可以选择菜单命令【文件】/【新建】，打开【新建文档】对 话框，然后选择【空模板】，在【模板类型】列表框中选择相应选 项来创建模板文件。
12.1.2
认识库项目
库是一种特殊的Dreamweaver文件，其中包含可放置到网页中的一组单 个资源或资源副本。库中的这些资源称为库项目，也就是要在整个网站范 围内反复使用或经常更新的元素。可在库中存储的项目包括图像、表格、 声音和使用Adobe Flash创建的文件等。 在网页制作实践中，经常遇到要将一些网页元素在多个页面内应用的 情形。当修改这些重复使用的页面元素时如果逐页修改会相当费时，这时 便可以使用库项目来解决这个问题。每当编辑某个库项目时，可以自动更 新所有使用该项目的页面。
12.2.3
二、基于现有文档创建模板
创建模板
这是创建模板比较快捷的一种方式。首先打开一个现有的网页， 选择菜单命令【文件】/【另存为模板】，打开【另存模板】对话框， 将当前的文档保存为模板文件，然后选择相应的网页元素，通过插 入模板对象的方式将其转换为相应的模板区域，最后再次保存即可。 在Dreamweaver中，创建的模板文件保存在站点的“Templates” 文件夹内，文件扩展名为“.dwt”，“Templates”文件夹是自动生成的， 不能对其名称进行修改。
12.2 使用模板
12.2.1 教学案例━━浮山学堂 12.2.2 认识模板 12.2.3 创建模板 12.2.4 可编辑区域 12.2.5 重复区域 12.2.6 重复表格 12.2.7 可选区域 12.2.8 使用模板创建网页 12.2.9 维护模板
12.2.1 教学案例━━浮山学堂
将素材文档复制到站点文件夹下，然后使用库和模板制作页面，在浏 览器中的显示效果如图12-18所示。
第12章 使用库和模板
在Dreamweaver CS6中，可以使用库项目 制作网页内容相同的部分，使用模板制作网 页结构相同的部分。库项目通常代表诸如站 点徽标、版权信息或导航栏这类小型的设计 资源，对于较大的设计区域可使用模板。本 章将介绍库和模板的基本知识以及使用库和 模板制作网页的基本方法。
12.1.4
添加库项目
库项目是可以在多个页面中重复使用的页面元素。在【资源】面板中选 中库项目，然后单击面板底部的【插入】按钮（或者单击鼠标右键，在弹出 的快捷菜单中选择【插入】命令），可将库项目插入到当前页面中。 在使用库项目时，Dreamweaver不是向网页中直接插入库项目，而是插 入一个库项目链接，【属性】面板中的“/Library/tu.lbi”可以清楚地说明这一 点。
12.1.5
三、分离库项目
维护库项目
一旦在网页文档中应用了库项目，如果希望其成为网页文档的一部分 可以自由编辑，这就需要将库项目从源文件中分离出来。在当前网页中选中 库项目，然后在【属性】面板中单击【从源文件分离】按钮，在弹出的信息 提示框中单击【确定】按钮，即可将页面中的库项目与源文件分离，使其成 为网页的一部分。分离后，就可以对这部分内容进行编辑了，因为它与库项 目再没有联系。
12.2.7
可选区域
用户可将可选区域设置为在基于模板的文档中显示或隐藏。当要为 在文档中显示内容设置条件时，可使用可选区域。使用可选区域可以 控制不一定在基于模板的文档中显示的内容。可选区域分为两类： •不可编辑的可选区域 插入不可编辑的可选区域的方法是：在【文档】窗口中，选择要设 置为可选区域的元素，然后选择菜单命令【插入】/【模板对象】/ 【可选区域】（也可在鼠标右键快倢菜单中选择【模板】/【新建可选 区域】命令，或在【插入】面板【常用】类别的【模板】按钮组中单 击【可选区域】按钮），打开【新建可选区域】对话框。
12.2.2
认识模板
模板是一种特殊类型的文档，用于设计固定的并可重复使用的页面 布局，基于模板创建的网页文档会继承模板的布局结构。在批量制作具 有相同版式和风格的网页文档时，使用模板不仅可使网站拥有统一的布 局和外观，而且可以同时更新基于该模板的多个网页文档，无疑提高了 站点管理和维护的效率。 在Dreamweaver CS6中，常用的模板对象有可编辑区域、重复区域、 重复表格和可选区域等类型。 创建模板时，可编辑区域和锁定区域都可以更改。而在基于模板的 文档中，模板用户只能在可编辑区域中进行更改，不能修改锁定区域。