实验九 利用模板和库设计网页

《实验九 利用模板和库设计网页》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、《网页设计与制作》上机实验(九)实验九利用模板和库设计网页一、实验目的1．掌握1）模板的原理2）创建、使用和管理模板以及利用模板更新网页的方法3）创建、管理库项目和利用库项目维护网页的方法2．熟悉1）如何创建嵌套模板3．了解1）模板、库文件及可编辑区域的HTML代码2）可选区域和重复区域的作用二、实验要求1．理解模板和库的作用2．学会在DreamweaverCS4中创建、使用、和管理模板，以及用模板更新网页3．学会在DreamweaverCS4创建库项目、管理库项目以及用库维护网页三、实验内容和步骤说明：本实验中用到的素材均在09文件夹中。操作

2、题一、把现有的文档保存为模板----例如：把“index.htm”网页保存为模板1．在DreamweaverCS4中打开“index.htm”网页。2．选择“文件”à“另存为模板…”，或者单击插入“模板”面板上的“创建模板”按钮，打开“另存为模板”对话框，如图9.1。《网页设计与制作》上机实验(九)图9.13．在“站点”下拉列表框中选择站点名称，在“另存为”文本框中输入模板名称。如果选择“现存的模板”列表中的模板，则可以用新的模板覆盖已有的模板。4．单击“保存”按钮，把当前页面保存为模板。系统将自动在站点根目录下创建Templates文件夹，并

3、将创建的模板文件保存在该文件夹中，扩展名为.dwt，如图9.2。图9.2操作题二、创建新模板方法一：通过资源面板创建新模板1．选择“窗口”à“资源”命令，打开“资源”模板2．单击左边的“模板”按钮，打开“资源”面板的模板类别。面板的上方是模板的预览，下方是模板文件列表，如图9.3。《网页设计与制作》上机实验(九)图9.33．单击“资源”面板右下角的“新建模板”按钮，这时在模板列表中添加了一个无标题的模板，如图9.4。图9.44．输入模板名称，并保存模板，即创建了一个空白模板。5．单击“资源”面板右下角的“编辑”按钮，即可在“文档”窗口打开该模板

4、文档。方法二：通过菜单创建新模板1．执行“文件”à“新建”命令，打开新建文档对话框，在左侧选择“空白页”，在页面类型中选择“HTML模板”，布局选择“无”。如图9.5《网页设计与制作》上机实验(九)图9.52.单击“创建”按钮，创建一个空白模板页。根据自己的设计完成模板页。3.完成设计后，单击“文件”à“保存”，进行保存。操作题三、在“index”网页模板中定义可编辑区域1．打开index.dwt文件。2．在“文档”窗口中选择想要设置为可编辑区域的文本或内容，或者将插入点放在想要插入可编辑区域的地方3．选择“插入”à“模板对象”à“可编辑区域”

5、命令，或者点击插入“模板”面板上的“可编辑区域”按钮。4．在“名称”文本框中输入该区域名称，注意不能对特定模板中的多个可编辑区域使用相同的名字，也不要在“名称”栏中使用特殊字符，例如：双引号、单引号、尖括号和符号&等。在DreamweaverCS4默认的区域名称为EditRegion1、EditRegion2等。5．单击“确认”按钮，如图9.6“zhengwen”所标示的区域。《网页设计与制作》上机实验(九)图9.6操作题五、删除可编辑区域1．单击可编辑区域左上角的选项卡以选中它。2．按Delete键，即可删除该可编辑区域；如果选择“修改”à“

6、模板”à“删除模板标记”命令，可以删除可编辑区域的标记，但是区域还保留。操作题六、创建基于模板的新页面1．选择“文件”à“新建”命令，打开新建文档对话框，左边选择“模板中的页”标签，在中间选择站点名称，右侧选择需要用到的模板文件。如图9.7图9.7《网页设计与制作》上机实验(九)2．单击“创建”按钮，创建新的网页。操作题七、将模板应用到现有文档1．打开aa.htm。2．在“文档”窗口中单击，然后选择“修改”à“模板”à“应用模板到页...”命令，打开“选择模板”对话框。选择所需的站点，并从“模板”列表中选择一个模板并单击“选定”按钮。如图9.8

7、图9.83．如果文档中有不能自动指定到模板区域的内容，则会出现“不一致的区域名称”对话框，如图9.9。对话框中列出了可以应用到模板中的所有可编辑区域，可以通过这些可编辑区域来为内容选择目标。《网页设计与制作》上机实验(九)图9.94．单击“取消”按钮，可以取消将模板应用到文档的操作。操作题八、管理模板的相关操作（一）重命名模板将站点中的untitled.dwt模板重命为lx.dwt。写出自己的操作步骤。（二）删除模板删除lx.dwt，写出自己的操作步骤。（二）将文档与模板分离1．打开使用了模板的文档。2．选择“修改”à“模板”à“从模板中分离”

8、命令，即可将文档与模板分离。文档与模板分离后，文档中再没有锁定区域，所有的地方都是可编辑的。一旦文档与模板分离，就再不能按模版进行更新了。操作题九、利