《DreamweaverCS3中文版实例教程 09 模板和库.ppt》由会员分享,可在线阅读,更多相关《DreamweaverCS3中文版实例教程 09 模板和库.ppt(17页珍藏版)》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、第9章模板和库本章简介:本章简介:每每个个网网站站都都是是由由多多个个整整齐齐、规规范范、流流畅畅的的网网页页组组成成。为为了了保保持持站站点点中中网网页页风风格格的的统统一一,需需要要在在每每个个网网页页中中制制作作一一些些相相同同的的内内容容,如如相相同同栏栏目目下下的的导导航航条条、各各类类图图标标等等,因因此此网网站站制制作作者者需需要要花花费费大大量量的的时时间间和和精精力力在在重重复复性性的的工工作作上上。为为了了减减轻轻网网页页制制作作者者的的工工作作量量,提提高高他他们们的的工工作作效效率率,将将他他们们从从大大量量重重复复性性工工作作中中解解脱脱出出来来,Dreamweave
2、r CS3提供了模板和库功能。提供了模板和库功能。课堂学习目标“资源资源”控制面板控制面板模板模板库库9.1 “资源”控制面板“资源资源”控制面板用于管理和使用制作网站的各种元素,如控制面板用于管理和使用制作网站的各种元素,如图像或影片文件等。选择图像或影片文件等。选择“窗口窗口 资源资源”命令或按命令或按键,启键,启用用“资源资源”控制面板。控制面板。“资源”控制面板9.2 模板课堂案例课堂案例房产资讯网房产资讯网创建模板创建模板定义和取消可编辑区域定义和取消可编辑区域创建基于模板的网页创建基于模板的网页管理模板管理模板9.2.1课堂案例房产资讯网使用使用“创建模板创建模板”按钮创建模板。使
3、用按钮创建模板。使用“可编辑区域可编辑区域”和和“重复重复区域区域”按钮制作可编辑区域和重复可编辑区域效果。按钮制作可编辑区域和重复可编辑区域效果。效果图9.2.2创建模板 在在Dreamweaver CS3Dreamweaver CS3中创建模板非常容易,如同制作网页一样。中创建模板非常容易,如同制作网页一样。当用户创建模板之后,当用户创建模板之后,Dreamweaver CS3Dreamweaver CS3自动把模板存储在站点的本地自动把模板存储在站点的本地根目录下的根目录下的“TemplatesTemplates”子文件夹中,使用文件扩展名为子文件夹中,使用文件扩展名为.dwt.dwt。
4、如果。如果此文件夹不存在,当存储一个新模板时,此文件夹不存在,当存储一个新模板时,Dreamweaver CS3Dreamweaver CS3将自动生成将自动生成此子文件夹。此子文件夹。创建空模板创建空模板将现有文档存为模板将现有文档存为模板9.2.3定义和取消可编辑区域 创建模板后,网站设计者需要根据用户的需求对模板的内容进行创建模板后,网站设计者需要根据用户的需求对模板的内容进行编辑,指定哪些内容是可以编辑的,哪些内容是不可以编辑的。模板编辑,指定哪些内容是可以编辑的,哪些内容是不可以编辑的。模板的不可编辑区域是指基于模板创建的网页中固定不变的元素,模板的的不可编辑区域是指基于模板创建的网
5、页中固定不变的元素,模板的可编辑模板区域是指基于模板创建的网页中用户可以编辑的区域。当可编辑模板区域是指基于模板创建的网页中用户可以编辑的区域。当创建一个模板或将一个网页另存为模板时,创建一个模板或将一个网页另存为模板时,Dreamweaver CS3Dreamweaver CS3默认将所默认将所有区域标志为锁定,因此用户要根据具体要求定义和修改模板的可编有区域标志为锁定,因此用户要根据具体要求定义和修改模板的可编辑区域。辑区域。对已有的模板进行修改对已有的模板进行修改定义可编辑区域定义可编辑区域定义可编辑的重复区域定义可编辑的重复区域定义可编辑的重复表格定义可编辑的重复表格取消可编辑区域标记
6、取消可编辑区域标记9.2.4创建基于模板的网页 创建基于模板的网页有两种方法创建基于模板的网页有两种方法 ,一是使用,一是使用“新建新建”命令创建命令创建基于模板的新文档;二是应用基于模板的新文档;二是应用“资源资源”控制面板中的模板来创建基于控制面板中的模板来创建基于模板的网页。模板的网页。使用新建命令创建基于模板的新文档使用新建命令创建基于模板的新文档应用应用“资源资源”控制面板中的模板创建基于模板的网页控制面板中的模板创建基于模板的网页9.2.5管理模板 创建模板后可以重命名模板文件、修改模板文件和删除创建模板后可以重命名模板文件、修改模板文件和删除模板文件。模板文件。重命名模板文件重命
7、名模板文件修改模板文件修改模板文件更新站点更新站点删除模板文件删除模板文件9.3 库课堂案例课堂案例热点话题跟踪热点话题跟踪创建库文件创建库文件向页面添加库项目向页面添加库项目更新库文件更新库文件9.3.1课堂案例热点话题跟踪 使用使用“库库”面板添加库项目。使用库中注册的项目制作网页文档。面板添加库项目。使用库中注册的项目制作网页文档。使用使用“文本颜色文本颜色”按钮更改文本的颜色。按钮更改文本的颜色。效果图9.3.2创建库文件 库项目可以包含文档库项目可以包含文档部分中的任意元素,包括文本、部分中的任意元素,包括文本、表格、表单、表格、表单、Java appletJava applet、插
8、件、插件、ActiveXActiveX元素、导航条和图像等。元素、导航条和图像等。库项目只是一个对网页元素的引用,原始文件必须保存在指定的位库项目只是一个对网页元素的引用,原始文件必须保存在指定的位置。置。可以使用文档可以使用文档部分中的任意元素创建库文件,也可新部分中的任意元素创建库文件,也可新建一个空白库文件。建一个空白库文件。基于选定内容创建库项目基于选定内容创建库项目创建空白库项目创建空白库项目9.3.3向页面添加库项目 当向页面添加库项目时,将把实际内容以及对该库项目的引当向页面添加库项目时,将把实际内容以及对该库项目的引用一起插入到文档中。此时,无需提供原项目就可以正常显示。在用一
9、起插入到文档中。此时,无需提供原项目就可以正常显示。在页面中插入库项目的具体操作步骤如下。页面中插入库项目的具体操作步骤如下。(1 1)将插入点放在文档窗口中的合适位置。)将插入点放在文档窗口中的合适位置。(2 2)选择)选择“窗口窗口 资源资源”命令,启用命令,启用“资源资源”控制面板。单控制面板。单击击“库库”按钮,进入按钮,进入“库库”面板。将库项目插入到网页中。面板。将库项目插入到网页中。9.3.4更新库文件 当修改库项目时,会更新使用该项目的所有文档。如果选择当修改库项目时,会更新使用该项目的所有文档。如果选择不更新,那么文档将保持与库项目的关联,可以在以后进行更新。不更新,那么文档
10、将保持与库项目的关联,可以在以后进行更新。对库项目的更改包括重命名项目、删除库项目、重新创建已对库项目的更改包括重命名项目、删除库项目、重新创建已删除的库项目、修改库项目、更新库项目。删除的库项目、修改库项目、更新库项目。重命名库项目重命名库项目删除库项目删除库项目重新创建已删除的库项目重新创建已删除的库项目修改库项目修改库项目更新库项目更新库项目9.4课堂练习节日礼品购物网使用使用“库库”面板添加库项目。使用库中注册的项目制作网页文档。面板添加库项目。使用库中注册的项目制作网页文档。效果图9.5课堂练习啤酒世界 使用可编辑区域制作可编辑区域。使用模板文档制作其他网页使用可编辑区域制作可编辑区域。使用模板文档制作其他网页文档效果。文档效果。效果图9.6课后习题精品汽车网 使用可编辑区域制作可编辑区域。使用模板文档制作其他网页使用可编辑区域制作可编辑区域。使用模板文档制作其他网页文档效果。文档效果。效果图