新编Dreamweaver CS3动态网页设计与制作教程第13章

《新编Dreamweaver CS3动态网页设计与制作教程第13章》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、13.1创建模板13.2创建库项目13.3课堂综合训练13.4小结习题第13章模板和库1．操作步骤用户在DreamweaverCS3中创建模板有多种方法，现将各种创建方法的操作步骤介绍如下。1)直接创建模板的操作步骤(1)选择【文件】→【新建】菜单命令，在弹出的【新建文档】对话框中选择【空白页】→【HTML模板】→【无】，新建一空白模板，如图13.1所示。13.1创建模板图13.1空白模板(2)单击【创建】按钮，进入新建模板编辑状态，如图13.2所示。(3)在模板编辑窗口中按常规网页的编辑方法制作合适的页面，一般可以先使用表格划分网页布局，然后添加页眉、导航菜单栏、页脚等公共元素。(

2、4)设置完成后，选择【文件】→【保存】命令。此时如果模板中没有设定可编辑区域，将弹出警告对话框，如图13.3所示。图13.2新建模板图13.3警告对话框(5)可以暂不设定可编辑区域，单击【确定】按钮打开模板命名对话框，如图13.4所示。(6)在对话框中输入模板的名称及所属的站点，单击【保存】按钮即可完成模板创建。图13.4【另存模板】对话框2)将已有网页文档另存为模板的操作步骤(1)在DreamweaverCS3窗口中，点击【文件】→【打开】命令，打开已经存在的网页文档，如图13.5所示。(2)点击【文件】→【另存为模板】命令，如图13.6所示。图13.5打开已经存在的网页文档图13

3、.6【另存为模板】命令(3)执行命令后，弹出【另存模板】对话框，如图13.7所示。(4)在【另存为】文本框中输入“tmp1”，单击【保存】按钮，即可创建模板。3)在资源面板中创建模板的操作步骤(1)点击【窗口】→【资源】命令，如图13.8所示。(2)单击模板按钮【】，切换到【模板】界面，如图13.9所示。图13.7【另存模板】对话框图13.8【资源】窗口图13.9【模板】界面(3)单击【资源】面板底部的【新建模板】按钮【】，新建一个模板网页。(4)单击【修改】→【页面属性】命令，弹出【页面属性】对话框，将“上、下、左、右”边距都设置为0，如图13.10所示。图13.10页面属性(5)

4、单击【确定】按钮。执行【插入】→【常用】→【表格】命令，在弹出的【表格】对话框中将“行数”设置为4，“列数”设置为2，如图13.11所示。(6)单击【确定】按钮，插入表格，记为“表1”。将光标置于“表1”的第1行第1列单元格中，执行【插入】→【常用】→【图像】命令，弹出【选择图像源文件】对话框，如图13.12所示。图13.11【表格】对话框图13.12【选择图像源文件】对话框(7)在上述对话框中选择图像index1.gif，单击【确定】按钮，插入图像，如图13.13所示。(8)将光标置于“表1”第1行第2列单元格中，插入图像index3.gif，如图13.14所示。(9)选中“表1”

5、第2行第1列至第2列并右击该区域，在弹出的快捷菜单中选择【表格】→【合并单元格】命令，如图13.15所示。图13.13插入图像视图(1)图13.14插入图像视图(2)图13.15【合并单元格(M)】命令(10)将光标置于“表1”第2行单元格，插入1行9列的单元格，记为“表2”，并在“表2”中插入相应的图像，如图13.16所示。(11)将光标置于“表1”的第3行第1列单元格中，插入7行1列的单元格，记为“表3”，并在此表的第1行中插入图像，如图13.17所示。(12)在“表3”的第2行至第7行单元格中依次输入文字，如图13.18所示。图13.16插入相应图像视图(1)图13.17插入相

6、应图像视图(2)图13.18输入文字视图(13)将“表1”第4行单元格合并，插入图像，如图13.19所示。(14)执行【文件】→【保存】命令，弹出信息提示框，单击【确定】按钮，即完成模板的制作。图13.19单元格合并后插入图像视图2.相关知识点模板的创建方法；模板的保存路径；模板的可编辑区与锁定区；利用模板更新网页；从模板中分离网页。3.知识拓展：创建可编辑区域在创建好模板之后，只有定义可编辑区域，才能将模板应用到网站的页面中。模板文档分为可编辑区域和锁定区域。对于需要经常改动的文字、图像及链接等网页元素，可以将其设置成可编辑区域，以便在网页中进行修改；对于不需改变的页面布局

7、则可构成模板的锁定区域。设置可编辑区域需要在制作模板时完成，可以将网页上任意选中的区域设置为可编辑区域，但是最好是基于HTML代码的，这样有利于更新。创建可编辑区域的具体操作步骤如下：(1)在DreamweaverCS3窗口下，打开如图13.19所示的模板。(2)将光标置于要插入可编辑区域的位置，执行【插入记录】→【模板对象】→【可编辑区域】命令，如图13.20所示。图13.20【可编辑区域】命令(3)在弹出的【新建可编辑区域】对话框的【名称】文本框中输入