项目十三 利用模板和库提高网页制作效率

《项目十三 利用模板和库提高网页制作效率》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、项目十三利用模板和库提高网页制作效率情境设置大家在浏览网站时，会发现每一个网站都有自己的风格，同一个站点内的页面样式都会大体相同，因此在开发一个站点时，为了使其页面达到样式一致，就必须每个页面都做一次同样的样式设置，若网站样式改版，那就必须逐个页面修改，很麻烦。但Dreamweaver为我们提供了模板和库这两个工具，有效地解决了这个问题，使用模板和库不但可以使得网页制作效率提高，并且在批量修改网页的样式和内容时更具方便性。项目展示用来生成模板的网页效果图（不要求大家做的和样张完全一样，但要尽量模仿）项目展示用模板生成的网页效果图项目目标能理解模板的作用能将现有的网页生成模

2、板能编辑模板能利用模板生成新的网页能更新模板能理解库的作用能创建库项目能修改库项目分析具体工作任务：创建一个网站，主题为“天天美食”。制作一个用来生成模板的网页。编辑模板。利用编辑好的模板制作一个页面。创建一个库项目。在网页中插入库。在模板上插入库后更新模板。实施步骤步骤一：新建站点并按效果图建立建立网页步骤二：创建模板将前面制作的页面另存为模板实施步骤步骤三：编辑模板将需要做调整的位置设置可编辑区域，选择【插入】下拉菜单中的【模板对象】级联菜单中的【可编辑区域】，在弹出的对话框中进行命名，效果如图：实施步骤步骤四：利用模板创建网页选择【文件】下拉菜单中的【新建…】选项，

3、在弹出的对话框中。切换到【模板】选项卡，选中模板名称，单击【创建】按钮，即可从模板新建一个文档，对可编辑区域进行修改，效果如图所示：实施步骤实施步骤步骤五：同样的方法创建其他页面步骤六：创建库项目在每个页面底端添加如图所示的效果，并有热区链接。这也就是大家要建立的库项目。选择【文件】下拉菜单中的【新建…】选项，在弹出的对话框中，选择【基本页】中的【库项目】，然后用前面讲过的方法设计出如图的效果，保存成为库文件。实施步骤步骤七：在网页中插入库单击【资源】面板左侧的最后一个按钮【库】，在如图所示的库面板中，选中库文件单击资源库面板下方的【插入】按钮，即可完成操作。实施步骤步骤

4、八：修改模板打开模板文件，在页面下方再插入一个1行1列的定位表格，然后在这个表格中插入库。这样只要使用这个模板建立的页面，将跟随同时变换。效果如图所示。实施步骤知识链接一、【资源】面板【资源】面板将网页的元素划分为9类，在面板的左侧垂直排列，从上到下依次排列：图像，颜色，链接，FLASH，Shockwave，影片，脚本，模板，库。知识链接二、创建模板模板的扩展名是.dwt。注意：当创建模板文档并将其命名保存后，系统会自动在站点管理器中出现一个保存模板文件的文件夹，一个名称为“Templates”的文件夹，如果站点中有这个文件夹，那么模板将会自动保存在这个文件夹中。知识链接

5、三、创建和删除可编辑区域创建可编辑区域时，可以将整个表格或单独的表格单元格创建为可编辑区域，但不能将多个表格单元格标记为单个可编辑区域。将鼠标指针移到要删除的可编辑区域内，选择【修改】下拉菜单中【模板】级联菜单中的【删除模板标记】命令，即可删除可编辑区域,也可以在编辑窗口中单击可编辑区域的名称标签，然后按退格键或删除键。知识链接四、删除文档中使用的模板打开利用模板创建好的网页文档，选择【修改】下拉菜单中【模板】级联菜单中的【从模板中分离】命令。五、将模板应用到已存在的文档打开要套用模板的网页，从资源面板中选中一个模板，单击下面的【应用】按钮，或者选择【修改】下拉菜单中【模

6、板】级联菜单中的【套用模板到页】命令，在弹出的对话框中选择一个模板，单击【选定】按钮。知识链接六、创建库项目库文件的扩展名是.lbi。注意：当创建库项目文件并将其命名保存时，系统默认的保存目录是一个名称为“Library”的文件夹，当然也可以根据个人选择保存目录。知识链接七、库项目属性面板可以通过库项目属性面板来设置库项目的一些属性。知识拓展项目展示知识拓展制作要点提示创建站点，制作主题为“时尚服装商城”的网页将网页中的【友情链接】这个Flash按钮，设置样式、链接等，最后将其生成一个库项目运用这个页面生成模板，其中，左边两幅图片、右边六幅图片、中间文字部分均为可编辑区域

7、制作风格相类似的其它几个页面，当前是春季的页面，至少再制作出夏季、秋季、冬季的页面小结本项目中主要介绍了如何使用模板和库来提高网页制作效率，其中详细讲解了模板和库的创建、编辑等操作。