《网页制作技术（第二版）-电子教案-许莉 14.任务十四 提高网站开发效率》由会员分享，可在线阅读，更多相关《网页制作技术（第二版）-电子教案-许莉 14.任务十四 提高网站开发效率（18页珍藏版）》请在金锄头文库上搜索。
1、网页制作技术（第二版）,主编 许莉 中国水利水电出版社,网页设计与制作,任务十四 提高网站开发效率,学习目标 了解库与模板的功能特点 掌握创建库与模板的方法 掌握编辑库与模板的方法 掌握利用库与模板制作网页的方法 掌握库与模板自动更新的方法,任务十四 提高网站开发效率,目录： 知识1 库文件 知识2 模板 任务1 应用网页库文件 任务2 利用模板制作网页,任务十四 提高网站开发效率,知识1 库文件,通常，页面中的顶部和底部在整个网站中会多次使用，因此我们希望能将它们作为一个整体保存起来，在想用它们时，像插入图片一样将它们整个插入到页面中去，这样就能节省大量的制作时间。 1.创建库 选择【窗口】
2、|【资源】菜单命令，打开“资源” 面板，在左侧的按钮中单击“库”按钮切换到“库”面板。 选中文档中需要重复使用的一整个部分。 选择【修改】|【库】|【增加对象到库】菜单 命令，此时会打开一个提示框。单击“确定”按钮关闭 对话框后，新建的库对象就出现在“库”面板上，这里 给新建的库重命名为top。,知识1 库文件,2.插入库 创建好库对象之后，就可以在新文档中使用它了。 新建文档，将鼠标定位在需要插入库文件的位置，在“库”面板中，选择要插入的库对象，单击“库”面板底部的“插入”按钮，将库对象插入到文档中。,知识1 库文件,3.编辑库 如果想要修改所有插入库对象中的内容，只要修改库就可以了。 在“
3、库”面板中双击要修改的库“top”，就会在文档编辑窗口中打开该对象。 编辑库文件中的元素属性，用快捷键Ctrl+S保存库文件，此时将打开一个“更新库项目”对话框，其中显示的是包含正在编辑的库对象的网页文件 。,知识1 库文件,3.编辑库 单击“更新”按钮，这样将更新网站内所有使用了该库的网页。此时将打开“更新页面”对话框开始自动更新，在里面显示正在更新的页面。 如果在“更新库项目”对话框中单击的是“不更新”按钮，Dreamweaver将会停止更新操作。 如果想在之后进行补救，可以选择【修改】|【库】|【更新页面】菜单命令，这样也会打开“更新页面”对话框。,知识1 库文件,4.使库对象脱离源文件
4、 有时我们可能需要将网页中的库和源文件分离，进而能够在网页中直接编辑。这时可以选中页面中的库对象。 单击“从源文件中分离”按钮，原来的库对象就变成普通的表格和图像，我们又可以在网页中直接编辑。,知识2 模板,Dreamweaver模板是一种特殊类型的文档，从模板创建的文档与该模板保持链接状态，修改模板即可立即更新所有基于该模板的文档。模板最大的作用就是一次更新多个页面。如果将具有相同版面结构的页面制作成模板，然后通过模板来创建其他页面，将大大提高网站的工作效率。 在Dreamweaver模板中通过标记可编辑区域和锁定区域来设置站点中各页面的风格统一区域，避免因操作失误导致模板被修改。创建模板时
5、，可编辑区域和锁定区域都可以更改，但在应用模板的文档中，只能修改可编辑区域，锁定区域无法修改。若要修改网页的风格可以只修改相应的模板文件，然后全面更新利用该模板创建的所有文档。,知识2 模板,1.创建模板 模板必须保存在站点中，因此在创建模板前应先建立站点，否则系统也会提示建立站点。 选择【窗口】|【资源】命令或按【F11】键， 打开“资源”面板，单击 “模板”按钮，打开模板资源 窗口；然后单击“新建模板按钮，这时将在模板资 源列表中添加一个未命名的新模板。输入模板的名 称，按【Enter】键即可创建一个空白的模板文件。 双击模板图标或单击“编辑”图标，即可打开该模板文件进行编辑。 编辑模板文
6、件后，选择【文件】|【保存】命令即可保存该模板文件。,知识2 模板,2.生成模板 模板不仅可以新建，也可将将现有文档保存为模板。 选择【文件】|【另存为模板】命令，打开“另存模板”对话框。 单击“保存”按钮，模板文件被保存在指定站点的Templates文件夹中，文件格式名为.dwt。,知识2 模板,3.编辑模板 模板创建好后接下来就是对模板进行编辑，定义可编辑区域，以便应用。 在“插入栏”的“常用”选项卡中单击“模板”按钮， 打开模板编辑列表，单击“可编辑区域”按钮，打开 对话框。 在“名称”文本框中输入可编辑区域的名称（不能使用“双引号”、“单引号”、“小于号”、“大于号”及“与”符号等特殊
7、字符）,单击“确定”按钮，模板中可编辑区域以绿色高亮显示。 用同样的方法可以在同一文件的多个位置创建可编辑区域。,知识2 模板,4.应用模板 打开“资源”面板，在“资源”面板中单击左侧的 “模板”按钮，打开模板列表。用鼠标右键单击要应 用的模板，在弹出的快捷菜单中选择“从模板新建” 命令，文档即会在文档窗口中打开。 如果不想在文档中附有模板，或不希望文档与模板有联系，可以选择【修改】|【模板】|【从模板中分离】命令将文档与模板分离。分离后该文档中的任意区域都可编辑。,知识2 模板,5.更新模板 打开要更新的模板，进行修改。 模板修改后，选择【文件】|【保存】命令保存模板时，Dreamweaver会询问是否更新所有附着到该模板的文档，此时将打开 “更新模板文件”对话框。也可以直接选择【修改】|【模板】|【刷新页面】命令，更新所有附着模板的文件。 如单击“不更新”按钮文档，则只是对修改后的模板进行保存。,任务1 应用网页库文件,将几个子网页共同的页首作为一个整体保存起来。,任务2 利用模板制作网页,本章结束,
