网页设计与制作 第6章 模 版.ppt

1、2020/7/15，第6章模板，创建6.1模板6.2模板创建可编辑区域6.3模板创建可编辑区域6.4模板创建可选区域6.5嵌套模板6.6模板应用，创建2020/7/15，6.1模板，使用6.1.1现有页面创建模板6.1.2菜单命令创建模板6.1.3模板(3)选择菜单命令另存为“文件”模板，然后弹出“另存为模板”对话框。(4)单击“保存”按钮时，将在站点文件下自动创建一个存储模板index.dwt的新文件夹templates。使用2020/7/15，6.1.2菜单命令创建模板，选择菜单命令“新建文件”，从“类别”列表框中选择“模板页面”，然后从右侧的“模板页面”列表框中选择相应的模板类型。使用2

2、020/7/15，6.1.3模板子面板创建模板，(1)使用快捷键F11，或选择菜单命令“窗口资源”打开“资源”面板。(2)您可以通过单击左侧的“模板”按钮，右键单击下面的空白区域，然后从弹出菜单中选择“新建模板”选项来创建新模板。(3)将为便于记忆而创建的模板重命名为new.dwt。创建2020/7/15，6.2模板可编辑区域，创建模板，然后按如下方式划分模板的可编辑区域：(1)文件列表中刚刚创建的模板index.dwt双击。(2)在文档中选择可编辑区域。(3)选择菜单命令“插入模板对象可编辑区域”，然后弹出“新建可编辑区域”对话框。(4)在“名称”文本框中，输入可编辑区域的名称。(5)单击“

3、确定”按钮，在当前模板中创建名为“编辑区域3”的可编辑区域。(6)如上所示，可编辑区域由虚线包围，显示可编辑区域的名称。(7)选择可编辑区域并切换到代码视图，以查看可编辑区域的起始标签代码。(8)使用相同的方法，使样板index.dwt最右侧表格中的储存格成为可编辑区域。创建2020/7/15，6.2模板可编辑区域，(9)保存模板，关闭当前页面(10)菜单命令“文件”“新建”“从模板新建”，从刚创建的模板中选择站点，然后选择刚创建的模板的名称。(11)单击“创建”按钮时，刚创建的模板将创建新页面。(12)选择并删除“可编辑单元格”中的第一个表格，只保留“最新动态”表格。(13)选择并删除“右侧

4、可编辑区域”中的所有内容，输入新内容，然后修饰。(14)index . htm刚刚创建的页面；以保存。(15)切换到“代码”视图，查看代码，所有不可编辑的代码都是灰色的，将光标移到灰色代码中时也不能进行修改、删除等操作。创建2020/7/15，6.3模板重复区域，创建6.3.1重复区域6.3.2重复表格，创建2020/7/15，6.3.1重复区域，(1)；(2)选择“右侧可编辑区域”将其删除，然后创建模板重复区域。(3)在刚刚删除的单元格中，如图6-13所示创建内容。(4)如图6-13所示，表中的第1、3、5、7行重复。如果网站上有很多这样的页面，更新当前行的内容时必须操作每个页面。使用模板的

5、重复区域可以更容易地解决问题。(5)选择重复行，然后选择菜单命令“插入模板对象重复区域”以弹出对话框(如图6-14所示)。(6)在文本框中输入“重复区域1”并单击“确定”按钮后，将在模板中创建重复区域，如图6-15所示。2020/7/15，6.3.2创建重复表格，(1)插入1行1列表格。(2)选择菜单命令“插入模板对象重复表”，弹出“插入重复表”对话框，然后在对话框中设置每个参数属性，如图6-16所示。(3)单击“确定”按钮将重复的表格成功插入到文档中，如图6-17所示。(4)您可以通过选择菜单“保存文件”，弹出“另存为模板”对话框并设置模板的名称和说明来保存新创建的模板。在2020/7/15

6、，6.4模板中创建可选区域，使用模板创建的可选区域包含可选区域：(1)可选区域：您可以直接设置是否显示用户无法编辑其内容的标记区域。(2)“可编辑的选项”区域：可以直接设置是否显示尺寸，也可以在此区域内编辑内容。6.4.1创建可选区域6.4.2创建可编辑可选区域，创建2020/7/15，6.4.1可选区域，(1)打开要在其中创建可选区域的文件，然后选择要设置为可选区域的元素。(2)选择菜单命令“插入模板对象可选区域”，或从工具栏中选择“模板”类别，然后单击“可选区域”按钮(请参阅图6-18)。(3)弹出“新建可选区域”对话框，然后将名称设置为“可选区域”，如图6-19所示。(4)单击“高级”选

7、项卡转到新可选区域的高级选项，然后设置是否显示可选区域，如图6-20所示。(5)单击“确定”按钮在文档中创建可选区域，如图6-21所示。(6)您可以返回到“文档”视图，选择可选区域，然后单击“属性”面板中的“编辑”按钮修改可选区域的名称和条件，如图6-22所示。(7)单击“保存”按钮时，文档将自动另存为模板。2020/7/15，6.4.2创建可编辑可选区域，(1)将光标置于要插入可选区域的位置。(2)选择菜单命令“插入模板对象”“可编辑可选区域”，或单击“常规”工具栏上的“选择可编辑可选区域”按钮，打开“新建可选区域”对话框，然后在“基本”和“高级”两个选项卡上设置如图6-23和6中所示的参数

8、(3)“确定”，2020/7/15，6.5嵌套模板，创建6.5.1嵌套模板6.5.2防止传递可编辑区域，创建2020/7/15，6.5.1嵌套模板，(1)；(2)右键单击，然后从弹出快捷方式中选择“从模板创建”选项。(3)文档窗口中打开了名为“Untitle-1”的HTML文档，文档左侧窗格中出现了“template: index_o”的黄色标记，表明该模板是从index_o.dwt模板创建的(4)；图6-27所示(5)弹出“另存为模板”对话框，然后在对话框中设置“说明”和“另存为”参数，如图6-28所示。2020/7/15，6.5.2防止发送可编辑区域，并防止根据需要将可编辑区域传递到嵌套模

9、板。(1)打开默认模板文件，然后切换到代码视图以查找要阻止传递的可编辑区域。(2)使用显示()环绕可编辑区域即可。，应用2020/7/15，6.6模板，应用6.6.1模板分离6.6.2模板，应用2020/7/15，6.6.1模板，(1)选择菜单命令(2)单击“创建”按钮，然后单击index_o(3)编辑文档内的可编辑区域，如图6-30所示。(produnct.htm文档；中选择另一种天花板类型。应用2020/7/15，6.6.1模板，(5)打开index_o.dwt模板在导航中创建链接并保存模板后，将出现“更新链接文件”对话框，如图6-31所示(6)单击“更新”按钮后，将出现index_o.dwt(7)通过在对话框中选中“显示记录”复选框，您可以查看更新的详细记录，如图6-33所示。(8)单击“关闭”按钮完成页面更新。分离2020/7/15，6.6.2模板，应用基于模板创建的网页，有时需要编辑网页中的不可编辑