8.1.1 创建模板的方法(课件）-高二《网页设计与制作》同步教学（中国人民大学出版社）

第8章 模板与库 教学任务： 理解模板和库在网页制作中的作用及价值； 学习模板和库的创建； 能够运用模板和库制作风格统一的网页。 教学重点与难点： 模板的创建方法、可编辑区域、重复区域、可选区域等； 库的创建方法、插入库的方法、对库项目进行编辑更改等。 8.1 统一网页风格的模板 在建设一个大规模的网站时，通常需要制作很多的页面，而且还要保证这些页面的风格统一。为了提高网站建设与更新的工作效率，避免重复操作，这就要用到Dreamweaver CS4中的模板。本节就来学习如何创建和使用模板。 模板的最大作用就是用来创建有统一风格的网页，省去了重复操作的麻烦，提高工作效率。它是一种特殊类型的文档，文件扩展名为“.dwt”。 在设计网页时，可以将网页的公共部分放到模板中。要更新公共部分时，只需要更改模板，所有应用该模板的页面都会随之改变。 在模板中可以创建可编辑区域，应用模板的页面只能对可编辑区域内进行编辑，而可编辑区域外的部分只能在模板中编辑。 使用模板的优点： （1）提高设计者的工作效率。 （2）更新站点时，使用相同模板的网页文件可同时更新。 （3）模板与基于该模板的网页文件之间保持连接状态，对于相同的内容可保证完全的一致。 8.1.1 创建模板的方法 模板的制作与普通网页的制作相同，是用来制作网页的公共部分。设计者可以根据需要，直接创建空白的模板，也可以将已有文档转换为模板。 要使模板生效，其中至少还要创建一个可编辑区域，否则基于该模板的页面是不可编辑的。 为了便于管理，最好将创建的模板存放在站点根目录下的“Templates”文件夹中，使用文件扩展名为“.dwt”。若该文件夹不存在，则当存储一个新模板时，Dreamweaver CS4会自动生成此文件夹。 1、直接创建模板 直接创建空白模板有以下三种方法： （1）通过【资源】面板，创建空模板 在【资源】面板中单击左侧竖排的【模板】按钮，此时进入【模板】子面板。然后单击下方的【新建模板】按钮，创建空模板。此时新的模板添加到【资源】面板的【模板】子面板的列表中，为该模板输入名称，如下图所示。 （2）鼠标右击，创建空模板 也可以通过在【资源】面板的【模板】子面板的列表区域，单击鼠标右键，在弹出的右键菜单中选择【新建模板】命令，如图所示。 （3）通过【插入】面板，创建模板 在打开的文档窗口中单击【插入】面板的【常用】模式中的【创建模板】按钮，将当前文档转换为模板文档，如图所示。 2、将已有文档转换为模板 除了直接创建模板外，在Dreamweaver CS4中还可以将已有文档转换为模板，具体操作步骤如下： （1）在菜单栏中选择【文件】→【打开】命令，弹出【打开】对话框，选择要作为模板的网页，然后单击【打开】按钮，如图所示。 （2）在菜单栏中选择【文件】→【另存为模板】命令，弹出【另存模板】对话框，输入模板名称，如图所示。 （3）单击【保存】按钮，此时窗口标题栏显示“ <<模板>> ”字样，表明当前文档是一个模板文档，如图所示。 3、对空模板进行修改 如果要修改新建的空模板，则先在“模板”列表中选中该模板，然后单击【资源】面板右下方的【编辑】按钮。如果重命名新建的空模板，则单击【资源】面板右上方的菜单铵钮 ，从弹出的菜单中选择【重命名】命令，然后输入新名称，如图所示。 $$