《Dreamweaver8和Flash8案例教程》第6章 模板、命令、

《《Dreamweaver8和Flash8案例教程》第6章 模板、命令、》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、第6章模板、命令、“资源”面板和外部插件【案例18】“硬件超市”模板和“硬件超市”网页6.1【案例19】“时尚外设展示”网页6.2【案例20】“Word的基本操作”网页6.36.1【案例18】“硬件超市”模板和“硬件超市”网页6.1.1学习目标“硬件超市”模板的显示效果如图6-1-1所示，使用“硬件超市”模板制作的“硬件超市”网页的显示效果如图6-1-2所示。图6-1-1“硬件超市”模板图6-1-2“硬件超市”网页模板就是网页的样板，它有可编辑区和不可编辑区。不可编辑区的内容是不可以改变的，通常为标题栏、网页图标、框架结构、链接文字和导航栏等

2、。可编辑区的内容可以改变，通常为具体的文字和图像内容，例如，“文字区1”栏和“图片区1”栏。通常在一个网站中有成百上千个页面，而且每个页面的布局也常常相同，尤其是同一层次的页面，只有具体文字或图像内容不同。将这样的网页定义为模板后，相同的部分都被锁定，只有一部分内容可以编辑，避免了对无须改动部分的误操作。6.1.2操作过程1．创建模板和可编辑区域（1）创建新模板单击“文件”→“新建”菜单命令，弹出“新建文档”对话框，选中“类别”栏内的“模板页”选项，再选中“模板页”栏内的“HTML模板”选项，如图6-1-3所示。然后单击“创建”按钮，即可创建

3、一个新模板页。6.1.3相关知识编辑完成后，单击“文件”→“另存为模板”菜单命令，弹出“另存模板”对话框，如图6-1-5所示。在“另存为”文本框中输入要保存的模板名称后，单击“保存”按钮，即可保存该模板。单击“插入”（模板）栏中的“创建模板”按钮，弹出“另存模板”对话框，如图6-1-5所示。然后在“站点”下拉列表框内选择本地站点的名字，再在“另存为”文本框内输入模板的名字，最后单击“保存”按钮，即可完成模板的保存。（2）设置模板网页的可编辑区域模板网页的编辑主要是设置可编辑区域，其方法是：单击“插入”→“模板对象”→“可编辑区域”菜单命令，或

4、单击“插入”（常用）栏“模板”快捷菜单中的“可编辑区域”按钮，弹出“新建可编辑区域”对话框，如图6-1-4所示。在“名称”文本框中输入一个名称，单击“确定”按钮，即可插入一个可编辑区域。（3）将已有的HTML文件创建为模板在Dreamweaver8中打开一个网页。定义可编辑区域：将光标置于需要增加可编辑区域的地方（右下部分），单击“插入”（常用）栏中的“模板”快捷菜单中的“可编辑区域”按钮，弹出Dreamweaver提示信息：“Dreamweaver将自动将此文档转换为模板”。单击“确定”按钮，弹出“新建可编辑区域”对话框，如图6-1-4所示

5、。在“名称”文本框中输入可编辑区域的名称，再单击“确定”按钮，这样，就新建了一个的可编辑区域。单击“文件”→“另存为模板”菜单命令，弹出“另存模板”对话框，如图6-1-5所示。然后，在“站点”下拉列表框内选择本地站点的名字，再在“另存为”文本框内输入模板的名字，最后单击“保存”按钮，即可完成模板的保存。（1）使用模板创建新网页单击“文件”→“新建”菜单命令，弹出“新建文档”对话框，单击“模板”标签，“新建文档”对话框变为“从模板新建”对话框。在“模板用于”列表框中，选择一个站点名称选项，在中间的列表框中选择要使用的模板名称，即可在“预览”栏内

6、看到模板的缩略图，如图6-1-6所示。2．使用模板制作网页图6-1-6“从模板新建”对话框如果选中了“当模板改变时更新页面”复选框，模板被修改后，所有应用该模板的页面将会自动更新。单击“创建”按钮，即可用选定模板制作网页。以后就可以在该网页的可编辑区域内插入相应的内容，单击“文件”→“保存”菜单命令，弹出“另存为”对话框，选择路径和文件名，再单击“保存”按钮，即可完成网页的制作。另外，单击“修改”→“模板”→“应用模板到页”菜单命令，弹出“选择模板”对话框，如图6-1-7所示。再选择新模板，单击“选定”按钮。图6-1-7“选择模板”对话框（2

7、）在页面内使用新模板在模板所在站点的文件夹内创建一个新的HTML网页。单击“窗口”→“资源”菜单命令，弹出“资源”面板，单击该面板中的“模板”按钮，再单击模板文件的名称，此时的“资源”面板如图6-1-8所示。图6-1-8“资源”面板用鼠标拖曳“正文”文件到页面中或单击“资源”面板中的“应用”按钮，网页将自动套用“正文”模板的内容。如果打开一个使用了模板的网页，但是该网页使用的模板与新模板中可编辑区域的名字不相同，则系统会弹出一个如图6-1-9所示的对话框，要求用户选择将页面的内容放到新模板的哪个可编辑区域中。单击可编辑区域的名称，再在下边的“

8、将内容移到新区域”下拉列表框中选择可编辑区域的名称，然后单击“确定”按钮，即可完成替换。图6-1-9“不一致的区域名称”对话框6.2.1学习目标“时尚外设展示”网页