FrontPage教程

124 第五章 FrontPage

第五章 FrontPage .................................................... 124

实验5.0 FrontPage的启动与建立站点 ............................... 124

任务1 FrontPage的启动与关闭 ................................. 124

任务2 建立站点 .............................................. 126

实验5.1 网页制作1 ............................................... 129

任务1 新建、打开与保存网页................................... 129

任务2 文本格式编辑 .......................................... 131

任务3 插入对象 .............................................. 135

作业5.1 ..................................................... 138

实验5.2 网页制作2 ............................................... 140

任务1 网页属性设置 .......................................... 140

任务2 图片操作及动态HTML效果 ................................ 143

任务3 表格操作 .............................................. 145

作业5.2 ..................................................... 149

实验5.3 网页制作3 ............................................... 151

任务1 书签超连接 ............................................ 151

任务2 超连接 ................................................ 154

作业5.3 ..................................................... 157

实验5.4 框架网页 ................................................ 158

任务1 创建与保存框架网页 .................................... 158

任务2 框架属性 .............................................. 161

任务3 编辑框架中的网页 ...................................... 165

作业5.4 ..................................................... 169

实验5.0 FrontPage的启动与建立站点

任务1 FrontPage的启动与关闭

⒈ 启动FrontPage，查看网页编辑的三种工作环境；

操作步骤

⑴ 【开始】→【程序】→【Microsoft FrontPage】，出现FrontPage窗口，窗口界面的主要功能见图5.1。

125

说明

程序启动后，自动进入“网页管理器”工作视图窗口，并建立名为new_page_1.hrm的网页文件。

⑵ 分别单击【普通】、【HTML】、【预览】三个标签，查看各窗口。

说明

⑴ 由于当前打开的是一个空白网页，所以【普通】、【预览】两个窗口无内容，在以后的操作中我们会在【普通】窗口中进行网页的编辑工作，经常会使用【预览】窗口查看网页制作的效果。

⑵ 【HTML】窗口中出现的是用HTML语言编写的网页的源代码。可以直接编写、修改源代码，同样可以达到编辑网页的目的。

⒉ 关闭FrontPage，返回WINDOWS。

操作步骤

选【文件】→【退出】；（或：单击窗口右上方“×”按钮），返回WINDOWS。

如果当前窗口中的内容在最近的一次保存后已经有所改变，这时会出现“确认”对话框（图5.2），要求用户选择，可以根据自己的目的选相应的按钮即可。 图5.2 确认对话框 在编辑网页时有3种显示方式： 【普通】：用于编辑网页，最常用；

【HTML】：查看、编辑网页文件的HTML代码；

【预览】：观察网页的显示效果。

图5.1 FrontPage窗口 可以单击其它管理器图标切换到相应窗口 视图窗口,默认是“网页”管理器

当前所选管理器的工作窗口 自动建立名为new_page_1.hrm的空白网页

126 任务2 建立站点

⒈ 在A盘创建一个名为“FPLX”的站点，站点模板为“只有一个网页的站点”；

操作步骤

⑴ 【文件】→【新建】→【站点】，出现“新建”对话框；

⑵ 在“站点”页面中选“只有一个网页的站点”，在“指定新站点的位置”文本框中输入“A:\FPLX”，【确定】（图5.3）。

实验与思考

在FrontPage中，用【打开】或【打开站点】命令观察A盘根目录，用“资源管理器”观察A盘根目录，在两种方式下观察到的刚建立的站点的显示方式有何不同（图5.4）？请分析FrontPage中创建站点FPLX与用“资源管理器”建立“FPLX”文件夹的不同。 图5.3创建站点 ⑴选“站点”页面

⑵选“只有一个网页的站点”模板 ⑶输入站点位置和名称：A:\FPLX

127

说明

打开站点文件夹FPLX，在文件夹中包含了两个文件夹_privata、images。_privata一般用来存放一些私人的文件，这些文件不希望别人使用。Images用来存放图像文件。站点中还包含2个隐含文件夹，用来存放一些特殊的文件。

⒉ 将FP1文件夹中的全部素材文件导入“FPLX”站点中；

操作步骤

⑴ 【文件】→【打开站点】，在“打开站点”对话框中选A盘、FPLX→【打开】（图5.5）；

⑵ 【文件】→【导入】，出现“导入”对话框，单击“添加文件”按钮，出现“将文件添加到文件列表”对话框（图5.6）；

⑶ 选A盘、FP1文件夹中全部文件，单击【打开】按钮，返回“导入”对话框。

⑷ 此时，“导入”对话框中出现fp1文件夹中的文件，并且【确定】按钮不再灰化，单击【确定】。 图5.4 查看FPLX站点 在FrontPage中用【打开】或【打开站点】命令看到的FPLX站点

在“资源管理器”中，看到的FPLX站点

图5.5 打开已建站点 ⑴选A盘FPLX站点

⑵打开

128

⒊ 查看站点结构。

操作步骤

⑴ 单击视图窗口中的【文件夹】图标，在文件夹列表框内逐一查看各文件夹的内容，了解站点的整体结构（图5.7）。

再回到【网页】窗口，逐一查看各文件夹内容，体会各窗口的不同之处。

说明

① 如果在【网页】查看中没有出现“文件夹列表”栏，可以在【查看】菜单中单击【文件夹列表】命令,即可出现“文件夹列表”栏；

② 在站点中包含了自身的文件以及文件夹的管理，使用非常方便。

⑵ 分别单击【报表】、【导航】、【超连接】、【任务】等图标，查看各窗口信息。

说明

由于是一个新站点，许多地方都还没有内容。 ⑴单击“添加文件”按钮→“将文件添加到文件列表”对话框

图5.6 导入文件 ⑵选FP1文件夹中全部文件→打开，返回“导入”对话框

⑶出现FP1中的文件→确定

图5.7查看站点结构

129 实验5.1 网页制作1

任务1 新建、打开与保存网页

打开站点“FP1”，完成以下操作，并按照题目要求保存文件，样文见图5.8。

打开站点操作：

【文件】→【打开站点】，在“打开站点”对话框中选FP1文件夹，【打开】。

⒈ 新建一个模板名称为“带有两个边栏的一栏正文”的网页。将网页的标题设置为“我的网页”并以文件名FP1RW1a.htm保存在“FP1”站点中。

操作步骤

⑴ 【文件】→【新建】→【网页】，出现“新建”对话框（图5.9），

⑵ 在【常规】页面中选择题目要求的一种网页模板，【确定】。

⑶ 在“标题”框中输入“我的网页”（图5.10）。

当完成了所有的编辑后，即可存盘保存。 图5.8 任务1样文

图5.9选择网页模板 ⑴选择“常规”页面

⑵选择“带有两个边栏的一栏正文”模板。同时，预览框中会显示所选模板的样式

⑶确定

图5.10在网页模板中输入标题 在标题框中输入“我的网页”。还可以在相应的框中输入用户自己的信息。

130 ⑷【文件】→【另存为】，出现“另存为”对话框（图5.11），

⑸ 设定：保存位置FP1、文件名类型WEB、文件名FP1RW1a后单击【保存】按钮保存。

注意：

① 由于是新建的网页，故选【另存为】，即使选【保存】系统也会自动跳出【另存为】对话框！

② 由于我们在新建网页前，已经打开站点FP1，所以【另存为】对话框中保存位置自动设为“FP1”站点（文件夹）。

⒉ 打开与保存已建网页

打开站点“FP1”中名为FP1RW1a.htm的网页，将网页标题改为“我的网页A”。将编辑后的网页以原文件名保存在“FP1”站点中。

操作步骤

⑴ 当我们需要修改已经建立的网页，就先要用“打开”命令将文件打开。

方法1：【文件】→【打开】，出现“打开”对话框（见图5.12），选择文件后，单击【打开】按钮，出现图5.13(A)界面。

方法2：在“我的电脑”或“资源管理器”中选中该网页文件，右击，在快捷菜单中选【编辑】命令，出现图5.13(A)界面。

注意：

选择方法2时，选中网页文件后，千万不能象打开WORD或EXCEL文件那样双击该文件名（FP1RW1.htm），因为双击网页文件名是运行该网页，而非编辑！

我们在编辑开始时，已经打开“FP1”站点，而FP1RW1a.htm是保存在FP1站点内的。因此使用方法1时，在“打开文件”对话框的“查找范围”文本框已经定位在FP1，只图5.12 打开已建网页 ⑴在“查找范围”下拉列表框中选择文件夹FP1

⑵选中FP1RW1a.htm文⑶打开 ⑵保存类型为WEB,与默认扩展名一致，不必修改。 ⑴在站点打开时，系统自动给出FP1，否则要设置为FP1！

⑶将系统自动给出的文件名改为：FP1RW1a

扩展名.htm不必输入！系统会自行添加。

⑷保存

图5.11另存为操作