网页设计与制作项目式教程 教学课件 作者 凌云项目八项目八 利用库和模板制作网站二级页面.ppt

《网页设计与制作项目式教程 教学课件 作者 凌云项目八项目八 利用库和模板制作网站二级页面.ppt》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、项目八利用库和模板制作网站二级页面任务一利用库制作网站页首和页脚【知识目标】了解库的基本概念。熟悉库项目的创建方法和基本操作(编辑、删除和重命名等)。掌握库的管理和库项目的应用方法。任务一利用库制作网站页首和页脚【技能目标】能创建库项目。能对库项目进行基本操作。能灵活应用库项目。任务一利用库制作网站页首和页脚【项目描述】网站的页面一般会采用统一的页面结构。如图4-1所示是“GlamorousSky”网站的首页。该页面采用的是传统的上中下结构，也就是将页面分为页首、内容和页脚。对于这一结构我们在制作网站的其他页面时，通常采用保留页首和页脚，仅仅对中间内容部分进行相应制作修改。也就是说在

2、这个网站里面，图中所示的页首和页脚处，是在多个网页页面里面被重复制作的。对于一个网站中被重复的对象，我们就可以把它们制作成库项目。8.1.1项目准备8.1.1.1库和库项目的概念库可以用来存放Web站点中经常重复使用的网页元素，如图像、文本和其他对象等。这些网站页面元素放入库中，我们就称这些元素为库项目。当在一个站点中创建库时，Dreamweaver会在站点目录下自动创建一个名为Library的文件夹。创建的库项目文件后缀为.lbi。8.1.1.2创建库项目创建库项目的方法有两种：直接新建库项目把已有页面元素转换为库项目8.1.1.3库项目的基本操作编辑库项目重命名库项目删除库项目恢

3、复删除的库项目8.1.1.4库项目的使用在文档中插入库项目将已经引用的库项目和源文件分离8.1.2项目实现根据前面所学内容，新建站点在站点中新建一个images文件夹，将本站点使用的图片素材保存到新建的images文件夹中创建页首库项目创建页脚库项目8.1.3知识拓展更新使用指定库项目网页单击菜单【修改】/【库】/【更新页面】命令，打开“更新页面”对话框根据需要在“查看”下拉列表中进行选择选择“显示记录”选项，可以查看站点的更新状态单击“开始”按钮，进行更新8.1.4项目训练利用库的操作，创建图示网页的页首库项目和页脚库项目任务二制作网站二级页面模板【知识目标】了解模板的基本概念。掌

4、握模板和库的区别。掌握模板的创建方法和使用方法。掌握模板的管理方法。任务二制作网站二级页面模板【技能目标】能创建模板。能对模板进行基本编辑。能创建基于模板的网页。任务二制作网站二级页面模板【项目描述】在一个较为复杂的站点中，确保所有页都具有相同布局的最佳方法就是使用模板。如图4-1所示，网站GlamorousSky的基本结构是上中下结构，其中页首和页脚保持不变，每个页面只是改变了中间部分的内容。为提高网站的制作效率以及确保结构统一，可以制作一个网站二级页面模板，将中间部分定义为可编辑区域，而页首和页脚部分内容固定。8.2.1项目准备8.2.1.1模板的概念模板是一种特殊类型的文档，用

5、来设计统一的页面布局。利用模板创建页面，不仅能保持页面布局、页面风格的统一，而且能很大程度上提高网页制作效率。当在一个站点中创建模板时，会在站点目录下自动创建一个名为Templates的文件夹。创建的模板文件后缀为.dwt。8.2.1.2模板和库的区分模板用于批量制作或修改网页，而遇到只是需要网页中的某些元素（如表格、图片等）保持统一，或者某个元素需要大量应用于多个网页的不同位置的情况时，就需要使用库。模板和库都可以通过资源面板查看8.2.1.3创建模板创建模板方法一单击菜单【文件】/【新建】新建类型中选择“空模板”，选择合适的模板类型和布局。单击“创建”按钮。创建模板方法二：单击资

6、源面板中模板面板右下方的新建按钮，新的模板显示在面板中，在“Untitled”处输入模板名称后，双击可进行编辑。创建模板方法三：单击菜单【插入记录】/【模板对象】/【创建模板】。创建模板方法四：编辑一个普通页面，然后单击菜单【文件】/【另存为】，将保存类型选为“模板文件”，单击“保存”。8.2.1.4模板区域的类型模板共有四种类型的模板区域：可编辑区域重复区域：可以在模板中插入的重复区域有两种：重复区域和重复表格。可选区域可编辑标签属性8.2.1.5检查模板语法在保存模板前，为确保模板不存在语法错误，用户可以使用“检查模板语法”命令来检查模板的语法。操作步骤如下：单击菜单【修改】/【

7、模板】/【检查模板语法】。如果语法正确，则会弹出“模板语法正确”的对话框。若存在语法错误，则会弹出相应的语法错误提示对话框，用户只需根据提示修改错误即可。8.2.1.6创建基于模板的网页新建基于模板的网页将模板应用于已有网页的方法当某个网页不需要使用模板时，可以单击菜单【修改】/【模板】/【从模板中分离】，即可将网页和相关联的模板文件脱离关系。脱离模板后的网页就成为一个普通网页，也不再有可编辑区域和不可编辑区域的分别。8.2.1.7更新网页更新基于模板网页