网页制作4【荐】.docVIP

第三章 Dreamweaver网页设计 实验3.4 模板的使用 【相关知识】 1. 模板是一种特殊的文档。可以按照模板创建新的网页。模板可以反复使用，减少了一些重复的工作，大大提高了网页制作的效率。而且使网页具有统一的风格。 2. 模板中应包含一个或多个可编辑区域。使用模板创建网页后，模板部分不能编辑，只能在可编辑区域中添加网页元素。 一、实验目的和要求 1. 掌握创建模板的方法。 2. 掌握使用模板创建新文档的方法。 3. 掌握在现有文档上应用模板的方法。 二、实验步骤 1. 创建新模板 （1）单击【文件】→【新建】菜单命令，打开【新建文档】对话框。切换到【常规】选项卡下。 （2）在【类别】列表框中选择“模板页”；在【基本页】列表框中选择“HTML模板”。 （3）单击【创建】按钮，新建一个模板。 2. 编辑模板 （1）单击【常用插入栏】上的【表格】按钮，打开【表格】对话框。设置【行数】为“1”；【列数】为“1”；【表格宽度】为“700像素”。单击【确定】按钮，在网页上插入一个表格。 （2）选中表格，在属性面板中设置【背景颜色】为“#00CCFF”；在【对齐】下拉列表中选择“居中对齐”。 （3）将光标放在网页上要插入可编辑区域的位置上。单击【插入】→【模板对象】→【可编辑区域】菜单命令，打开【新建可编辑区域】对话框。在【名称】文本框中输入可编辑区域的名称为“EditRegion1”。单击【确定】按钮，在网页上插入一个可编辑区域。 （4）单击【标准工具栏】上的【保存】按钮，打开【另存为模板】对话框。在【站点】下拉列表中选择站点名称；在【另存为】文本框中输入模板的名称为“master”。单击【确定】按钮，保存模板。 3. 使用模板创建新文档 （1）单击【文件】→【新建】菜单命令，切换到【模板】选项卡下。打开【从模板新建】对话框。 （2）在【模板用于】列表中选择包含模板的站点；在【站点】列表中选择站点中的模板文件。如果选中【当模板改变时更新页面】复选项，则保存修改后的模板时，将自动提示更新使用该模板创建的页面。 （3）单击【创建】按钮，创建一个基于模板的新文档。 4. 在现有文档上应用模板 打开要应用模板的已有文档。执行以下操作之一： 单击【修改】→【模板】→【套用模板到页】菜单命令，打开【选择模板】对话框。在【站点】下拉列表中选择站点名称；在【模板】列表中选择需要的模板。单击【选定】按钮。即可将该模板应用到打开的文档。 打开【文件】浮动面板，切换到【资源】选项卡下。单击【模板】图标，打开模板列表，选中需要的模板。单击【应用】按钮，或者将模板直接拖动到文档窗口中即可。 【操作技巧与注意事项】 模板应包含可编辑区域。基于模板创建的网页可以在这些区域中进行编辑。 实验3.6 表格的应用 【相关知识】 1. 表格是简明、快捷地展示数据的常用方式。 2. 利用Dreamweaver提供的导入、导出功能，可以使网页中的表格与其他软件（例如Word、Excel）中的表格式数据相互转换。 3. 利用表格对网页布局是网页制作中的常用手段。 【实验3.6-1】 一、实验目的和要求 1. 掌握创建和编辑表格的方法。 2. 掌握对表格进行格式化的方法。 3. 掌握排序表格的方法。 二、实验步骤 1. 新建一个网页文档 启动Dreamweaver。单击【文件】→【新建】菜单命令，新建一个网页文档。 2. 插入表格 （1）将光标放在网页中要插入表格的位置上。单击【插入】→【表格】菜单命令，或单击【常用插入栏】上的【表格】按钮，打开【表格】对话框。 （2）在对话框中，设置【行数】为“2”；设置【列数】为“3”；设置【表格宽度】为“600像素”；设置【边框粗细】为“2”。 （3）单击【确定】按钮，插入一个2行3列的表格。 3. 在单元格插入内容 （1）将光标放在第2行第1列的单元格中，输入“轿车”。 （2）将光标放在第2行第3列的单元格中，单击【插入】→【图像】菜单命令，插入一幅轿车的图片。 4. 编辑表格 （1）将光标放在第1列单元格的上方。当鼠标变成箭头形状时，单击鼠标，选中第1列所有的单元格。在属性面板的【宽】处输入“100像素”。用同样的方法将第3列所有单元格的宽度设置为“70像素”。 （2）将光标放在第2行第2列的单元格中，单击鼠标右键，在弹出的快捷菜单中选择【表格】→【拆分单元格】菜单命令，打开【拆分单元格】对话框。在【把单元格拆分】处选中“行”；设置【行数】为“2”。 （3）选中拆分后的2个单元格，在属性面板的【高】处输入“50像素”。并分别在单元格中输入“通用”、“大众”。 （4）将光标放在第2列的单元格中，单击鼠标右键，在弹出的快捷菜单中选择【表格】→【插入列】菜单命令，在表格中插入一列。在该列第