使用模板和库制作网页.ppt

什么是模板
模板是一种特殊类型的网页文档，只是被加入了特殊的 模板信息，一般用来设计“固定的”页面布局并定义可 编辑区域，只需从模板创建网页并在可编辑区域中进行 编辑即可完成新页面的设计，大大提高了工作效率。简 单地说，模板是一种用来批量创建具有相同结构及风格 的网页的最重要手段；从模板创建的文档与该模板保持 连接状态，修改模板就可以实现基于该模板设计的网页 批量更新。
项目三 布局技术
资源的应用
在Dreamweaver CS3中，可以直接跟踪和预览站点中 存储的资源，如图像、影片、颜色、脚本和链接，还可 以直接拖动某个资源，将其插入到当前文档的某一页中。 还可以通过各种来源获取资源，如在应用程序 （Fireworks或Flash）中创建资源。
项目三 布局技术
ห้องสมุดไป่ตู้
资源面板左侧的各按钮意义
项目三 布局技术
库项目的应用
库项目的创建 库项目是整个网站范围内重新使用或经常更新的元素，每个 库项目作为一个单独的文件（扩展名为.lbi）保存在站点本地 根文件夹下Library文件夹中，其创建方法十分简单多样。 库项目的插入 把库项目插入到文档中，与模板类似能够批量生产风格的页面。 脱离库 文档中由库项目创建的元素，会随着库项目的变化而变化， 如果我们修改了某个库项目，那么由这个库项目创建的页面 元素也会自动更新。我们也可以让文档不受库项目的控制 以便可以自由地编辑。
图像按钮：在资源列表框中显示GIF、JPEG或PNG格式的图像文件。 颜色按钮：在资源列表框中显示文档和样式表中使用的颜色，包括文本颜色、
背景颜色、链接颜色。 URLS按钮：在资源列表框中显示当前文档中使用的外部链接，包括FTP、
模板的重复区域
是模板的一部分，设置该部分可以使模板用户必要时在 基于模板的文档中添加或删除重复区域的副本。重复区 域通常与表格一起使用，但也可以为其他页面元素定义 重复区域。使用重复区域，可以通过重复特定项目来控 制页面布局，例如目录项、说明布局或重复数据行。可 以在模板中插入的重复区域的模板对象有两种：重复区 域和重复表格。
模板创建
模板创建的方法有两种：直接创建模板或者将 普通网页另存为模板。创建模板文件和创建一个普 通页面的方法完全相同，不需要把页面的所有部分 都制作完成，仅需要制作导航条、标题栏等各个页 面的共有部分就可以了。
模板的可编辑区域
为了避免编辑时因误操作而导致模板中的元素发生变化， 模板中的内容默认为不可编辑。模板创建者可以在模板 的任何区域指定可编辑的区域，而且要使模板生效，至 少包含一个可编辑区域，否则该模板没有任何实质意义。 创建可编辑区域的方法： 方法一：单击“常用”选项卡中的“可编辑区域”按钮 方法二：直接在模板空白处单击右键，选择“模板”下 的“新建可编辑区域”选项
利用模板和库制作网页
在进行大量的页面制作时，很多页面会 用到相同的布局、图片和文字等元素。为了 避免重复劳动，可以使用模板和库功能，将 具有相同版面结构的页面制作成模板，将相 同的页面元素制作成库项目，并存储在库文 件中以便随时调用。
学习目标
理解模板和库的作用。 学会将已有网页生成模板的操作方法。 掌握编辑模板和将模板生成新网页的操作 方法。 掌握如何应用库项目制作网页。
应用模板创建网页文档
单击菜单【文件】→【新建】，弹出“新建文档”对话框，在“新建 文档”对话框中选择“模板中的页”标签，选择要使用的模板，然后 单击【创建】按钮，这样将基于这个模板创建一个新的网页。 在基于模板创建的网页中，只有可编辑区域是可以进行编辑的，可编 辑区域之外的区域均被锁定。 若要将文档从模板中分离，方法是执行“修改”菜单下的“模板”中 的“从模板中分离”命令，这就使网页成为一个普通文档，不再与模 板有关系
更新模板的变化
对模板进行修改后，可以将模板的修改应用于所有由模板生成的网页。 操作步骤如下： （1）打开模板文档，对模板进行必须的修改。 （2）单击菜单【修改】→【模板】→【更新页面】，弹出“更新页 面”对话框。
（3）在对话框中设置相应参数，在“查看”下拉列表框中如果选 择“整个站点”，则要选择更新哪个站点，如果选择“文件使用”， 则要选择更新哪个模板文件。如果选中了“显示记录”复选框，则会 在更新之后显示更新记录。
模板用户可以使用重复区域在模板中重制任意次数的指 定区域。要将重复区域中的内容设置为可编辑（如允许 用户在基于模板的文档的表格单元格中输入文本），必 须在重复区域中插入可编辑区域。
保存模板
Dreamweaver CS3将模板文件以文件扩展名.dwt保存在站点本 地根文件夹的Templates文件夹中。如果该文件夹在站点中不存 在， Dreamweaver CS3中将在你保存新建模板时自动创建该文 件夹。
库项目的应用
库是一种特殊的Dreamweaver CS3文件，它其中包含可 以放置到页面中的一组单个资源或资源副本。库中的这 些资源称为库项目，它与模板本质区别在于：模板本质 是一个独立的页面文件，它可以控制大的设计区域以及 重复使用完整的布局，而库项目则只是页面中的某一段 HTML代码。每当编辑某个库项目时，可以自动更新所 有使用该项目的页面，使用库比模板有更大的灵活性。
运行菜单命令“文件/保存”，此时将出现提示信息，告诉我们 文档还未建立可编辑区域，是否继续。单击“确定”按钮则打 开“另存模板”对话框。在“另存为”文本框中输入 “Template1”，这时在模板面板中出现新建的模板。 将文档另存为模板后，文档的大部分区域就被锁定。模板创作 者在模板中插入可编辑区域或可编辑参数，从而指定在基于模 板的文档中哪些区域可以编辑。
库项目的应用
Dreamweaver CS3将库项目存储在每个站点的本地根 文件夹下的Library文件夹中。使用库项目时，页面中 的库是该项目的链接而不是项目本身。也就是说， Dreamweaver CS3在文档中插入的是该项目的HTML源 代码副本，并添加一个包含对原始外部项目的引用的 HTM L注释，库项目的自动更新就是通过这个外部引 用来实现的。