当前位置:首页 >> 高中教育 >>

第6章 FrontPage


网页制作软件 FrontPage 2003 (一)

1

网页制作软件FrontPage 2003
? 1 FrontPage 2003概述 ? 2 网页基本元素编辑

2

一、FrontPage 2003的启动和退出
1.启动FrontPage 2003 启动FrontP

age 2003主要有以下两种方法: (1)单击“开始”按钮,然后在弹出的“开始”下 拉菜单中选择“所有程序”→“Microsoft Office”→“Microsoft Office FrontPage 2003”命令, 即可启动FrontPage 2003。 2.退出FrontPage 2003 退出FrontPage 2003应用程序可采用以下3种方法: (1)选择“文件”→“退出”命令。 (2)单击窗口右上角的“关闭”按钮。 (3)双击窗口左上角的控制按钮。
3

1

FrontPage 2003概述
? 1.1 功能特点
? 1.2 窗口界面 ? 1.3 基本操作

4

1.1 功能特点
? FrontPage让初学者无需掌握HTML语言或具备编程基础知识

便能够编写出界面优美、功能完善的网站。下面简单介绍一 下FrontPage的特点。 ? “所见即所得”的网页编辑环境,也就是说,用户在网页编 辑窗口中看到的效果就是浏览器中显示的效果。 ? 易学易用的操作界面,像其它Office套件一样,在 FrontPage中集成了大量的网页模板和网站向导,让用户很 方便快捷地制作出优美的网页。 ? 功能强大的新版本FrontPage融合了网页管理、网页编辑、 网页发布和网站维护等多种功能,利用FrontPage制作的网 页支持最新的网页标准,比如DHTML、XML、CSS2等等。
5

1.2 窗口界面
? FrontPage 2003主界面主要由菜单栏、工具栏、视图栏、状

态栏、主编辑窗口和任务窗格等6大部分组成。

6

二、FrontPage 2003工作窗口
FrontPage 2003的窗口主要由标题栏、菜单栏、工具栏、 状态栏、任务窗格、编辑区、网页视图切换区组成。 1.标题栏 标题栏位于窗口的最顶端,由“控制”按钮、窗口标识和 窗口按钮3部分组成。“控制”按钮.位于标题栏的最左侧, 单击该按钮可弹出控制下拉菜单,在该下拉菜单中选择相 应的命令,可以对窗口进行最小化、最大化、移动、关闭 等操作;窗口标识位于控制按钮右侧,用于显示当前打开 或新建网页的名称和路径;窗口按钮位于标题栏最右侧, 主要包括“最小化”按钮 “最大化”按钮。、“关闭” 按钮。 2.菜单栏 FrontPage 2003的菜单栏中有“文件”、“编辑” 、“视 图”、 7

“插入”、“格式” 、“工具”、“表格”、“数据”、 “框架”、“窗口”和“帮助”11个菜单项,选择菜单中 的命令,可执行相应的操作。 3.工具栏 FrontPage 2003的工具栏包括“常用”工具栏和“格式工 具栏,使用工具栏中提供的各种工具按钮,可以帮助用户 快速地完成操作。 在工具栏中单击鼠标右键,在弹出的快捷菜单中选择相应 的选项。 4.编辑区 编辑区指窗口中的空白区域,用来显示或内容。 5.任务窗格 任务窗格是FrontPage 2003新增的功能,
8

它将FrontPage 2003中一些常用的任务组合在一起放置在 该窗格中,可以方便用户使用,用户可以按“Ctrl+F1”快 捷键来打开任务窗格。 6.网页视图切换区 网页视图切换区中有“设计”、“拆分”、“代码”和 “预览”4个按钮,用来切换FrontPage 2003网页的显示 方式。 7.状态栏 状态栏位于窗口的最下方,用于显示FrontPage 2003的各 种状态。
?
9

“网页”视图
? 选择【视图】【网页】命令,打开网页视图。 ? 网页视图是FrontPage中最常用的工作界面,网页的创建、 编辑、预览等基本操作都是在此视图中进行的。网页视图窗 口底部有4个标签:“设计”、“拆分”、“代码”和“预 览”,它们分别控制着网页的4种显示模式。在设计模式下, 能够以“所见即所得”的方式编辑网页;在代码模式下,可 以查看或编辑网页的HTML的源代码;在预览模式下,可以预 览网页的效果;在拆分模式下,能够同时编辑网页和查看或 编辑网页的HTML的源代码。

10

“文件夹”视图
? 单击 “视图” 栏中的“文件夹” 图标或选择【视 图】【文件夹】 命令,打开文件 夹视图。 ? 在文件夹视图下, 网站显示为一组 文件和文件夹。 在此视图下可以 对网站中的文件 夹和各种文件进 行管理。
11

“报表”视图
? 单击“视图”栏中的“报表”图标或选择【视图】【报表】命 令,打开报表视图。 ? 通过报表视图,可以在运行报表查询后分析网站内容。

12

“导航”视图
? 单击“视图”栏 中的“导航”图 标或选择【视图】 【导航】命令, 打开导航视图。 ? 导航视图用于管 理网站中各网页 的层次关系结构 图。可以通过鼠 标将结构图中的 网页拖到新位置 来改变链接结构。
13

“超链接”视图
? 单击“视图”栏中“超链接”图标或选择【视图】【超链接】 命令。 ? 超链接视图用于管理网站中网页的超链接。

14

“任务”视图
? 单击“视图”栏中的“任务”图标或选择【视图】【任务】命 令,可打开任务视图。 ? 任务视图可以实现网站任务的管理。网站的任务是指网站管理 人员维护网站的任务,包括网页的更新和网站的检查等。

15

“远程网站”视图

? 可以使用“远程网站”视图发布整个网站,或有选择 地发布个别文件。还可以在两个或多个位置之间同步 文件,即确保包含相同内容的网站都包含最新的更改。

16

1.3基本操作
? 1.网站的规划 ? 2.网站的基本操作 ? 3.网页的基本操作

17

网站的规划
? 首先要明确建立网站的目的。 ? 其次要明确网站的浏览者群。 ? 最后要考虑到如何能够便于网站的日常维护。

18

网站的基本操作
? 1) 创建网站 ? 创建一个Web网站有两种方法。第一种方法是利用FrontPage 的Web网站模板和向导,这种方法操作简单、速度快,比较适 合建立大、中型的Web网站。第二种方法是逐个地创建网页文 件,然后创建它们之间的链接关系,这种方法适合于网页数 量不多的小型网站。 ? 使用FrontPage模板创建网站的步骤: ? 启动FrontPage应用程序; ? 选择【文件】【新建…】命令,打开“新建”任务窗格; ? 选择网站模板,在“新建网站”栏选择“由一个网页组成的 网站…”,打开“网站模板”对话框,在“指定新网站的位置” 文本框中输入新网站的位置及名称,然后单击“确定”按钮。
19

网站的基本操作
? ? ? ? ? 2)关闭网站 选择【文件】【关闭网站】命令。 关闭网站即关闭网站及该网站下的所有网页。 3)打开网站 选择【文件】【打开网站】命令,“打开网站”对 话框。 ? 选择网站名称,然后单击“打开”按钮。

20

网页的基本操作

? 1)新建网页 ? 在FrontPage 2003中可以直接创建一个空白网页,也 可以利用网页模板和网页向导来创建。 ? 在某网站中创建新网页,在此网站的文件夹视图和导 航视图方式下单击视图窗口右上角的“新建网页”按 钮。 ? 创建不属于某网站的新网页,在任何视图方式下,选 择【文件】【新建…】命令,打开“新建”任务窗格, 可在新建任务窗格中,选择一种合适的模板新建网页; 或者单击常用工具栏上的“新建”按钮 。
21

网页的基本操作
? 2)打开网页 ? 打开当前网站中的网页,在任何视图中双击该网页图标或文 件名即可打开网页。 ? 打开其它网站中的网页,选择【文件】【打开】命令,在 “打开文件”对话框中选择具体网页文件打开。 ? 3)保存网页 ? 保存当前网站中的网页,单击工具栏中的保存按钮,或【文 件】【保存】命令即可。如果网页中有图片,则会弹出“保 存嵌入式文件”对话框,提示保存图片文件。 ? 保存不属于当前网站中的网页,则需要指定保存路径。 ? 4)关闭网页 ? 选择【文件】【关闭】命令。这种方式关闭的仅是当前网页, 22 要注意与关闭网站的区别。

2

网页基本元素编辑

? 2.1 文本编辑 ? 2.2 图像编辑 ? 2.3 超链接创建

? 2.4 Web组件

23

2.1文本编辑
? 1.文本添加
? 2.设置段落和文本格式 ? 3.插入水平线

? 4.设置网页属性

24

文本添加
? 在网页中添加文本与在Word中添加文本的操作基 本相同。此外,在网页中输入文本时,如果已经 达到网页边界,则文本会自动回滚到下一行继续 输入,这种换行方式并不会产生新行或是一个新 段落,随着网页边界的变化或是编辑窗口的调整, FrontPage 2003会自动调整这个回滚位置。 ? 按下<Shift>+<Enter>键将产生新行,即换行, 新行与上一行之间没有回滚关系。 ? 按下<Enter>键产生一个新段落。
25

设置段落和文本格式
? 可以使用格式工具栏(如图7.2.1所示)或“字 体”和“段落”对话框对文本和段落的格式进行 设置。其操作方法跟Word基本相同。

26

插入水平线
? 为了修饰页面,明显区分开标题与正文,可选择【插入】 【水平线】命令在当前光标点插入一条水平线。双击水平 线或选择【格式】【属性】命令弹出“水平线属性”对话 框,可对水平线的高度、宽度、颜色和对齐方式进行设置。

27

设置网页属性
? 网页属性是一个网页整体的属性,记录关于网页的非 页面部分的相关信息。适当的设置可以达到增加网页 美观和缩减网页文件大小的效果。 ? 方法一:右击页面,从弹出的快捷菜单中选择“网页 属性”命令。 ? 方法二:选择【格式】【背景】命令; ? 方法三:选择【文件】【属性】命令;

28

2.2图像编辑
? 1.插入图像 ? 2.编辑图像 ? 3.设置图片属性

29

插入图像
? 插入一幅关于“背景”的剪贴画的操作步骤: ? 将插入点定位在需要插入图片的位置; ? 选择【插入】【图片】【剪贴画】命令,打开“剪贴画” 任务窗格,如图所示; ? 在任务窗格中,用户可在“搜索文字”文本框中输入剪 贴画的关键字“背景”; ? 单击“搜索”按钮开始搜索,在任务窗格下方列表框中 列出了搜索到的剪贴画; ? 单击剪贴画右侧的下三角按钮,弹出剪贴画的快捷菜单, 单击“插入”命令即可。
30

插入图像
? 插入来自文件的图片的操作步骤: ? 将插入点定位在需要插入图片的位置; ? 将插入点定位在需要插入图片的位置; ? 选择【插入】【图片】【来自文件】命令,或单击“常用” 工具栏中“插入图片”按钮; ? 打开“图片”对话框,选择所需文件,单击“插入”按钮。

31

编辑图像
? 在网页中插入图像后,还可对图像进行编辑。用鼠标单 击选取图像,在屏幕上就会出现“图片”工具栏。利用 “图片”工具栏可对图片进行旋转、剪裁、冲蚀,设置 凹凸效果、透明背景色,调整亮度、对比度以及在图片 中加入文字等。选中图片后,拖动图片周围的控点可改 变图片大小。

32

设置图片属性
? 选定所需的图片,单击鼠标右键,从快捷菜单中选择 “图片属性”命令,弹出“图片属性”对话框。在对话 框的“常规”和“外观”两个选项卡中进行设置,可以 做出各种图文混排的页面效果。

33

2.3 超链接创建
? 1.选择链接的载体
? 2.选择链接的目标 ? 3.指定目标窗口

? 4.验证超级链接
? 5.设置超链接的状态颜色 ? 6.图像映射

34

2.3 超链接创建
? 超链接是从一个网页指向另一个目的地的指针, 这个目的地可以是另一个网页或同一个网页中的 其他位置,也可以是一个电子邮件、一个Word文 档或者是一个应用程序。 ? 创建超链接的步骤: ? 选择链接的载体; ? 选择链接的目标; ? 指定目标窗口。
35

选择链接的载体
? 链接的载体是显示链接的页面元素。将鼠 标指针移到包含超链接的文字或图像上时, 鼠标指针就会变成形状,当浏览者单击此 文本串或图像,浏览器将打开相应地址的 网页。 ? 选定链接的载体后,单击“常用”工具栏 上“插入超链接”按钮,或选择【插入】 【超级链】命令,打开“插入超链接”对 话框。

36

选择链接的目标
? 链接的目标包括原有文件或网页、本文档中的位置(书签)、 新建文档、电子邮件等。根据跳转目的地的不同,网页中链 接可分为4种类型。 ? 1)原有文件或网页直接跳转到已经存在的某一网页或文件。 ? 如果是本网站内的网页,可用光标在“插入超链接”对话框 列表文件中选择。 ? 如果是本机上其它网站中的网页,则选择“插入超链接” 对话框中的按钮,或从“查找范围”中选择相应的网站,再 选择所需网页。 ? 如果是Internet上其它网站的某一网页,可单击按钮打开浏 览器找到该页面后,该页面的网址会自动出现在“地址”栏; 也可以直接在地址栏文本框中输入该网页的地址。
37

选择链接的目标
? 2)本文档中的位置是直接跳转到本网页中的某 书签标志的位置。要进行此链接操作,必须先 用【插入】【书签】命令在网页中的某些位置 插入书签; ? 在“插入超链接”对话框中单击“本文档中的 位置”,然后选择该网页上的书签,将会在书 签位置创建一超链接。

38

选择链接的目标

? 3)新建文档可以将当前选中的链接的载体链接 到一个新建的页面上。单击“新建文档”按钮, 在“新建文档名称”栏填写该网页的名称。

39

指定目标窗口
? 链接的目标网页选定后,可以指定目标网页是在本窗口中显 示还是在新打开的浏览器窗口中显示。单击“插入超链接” 对话框中“目标框架”按钮,打开“目标框架” 对话框,。 指定链接的目标网页的目标窗口,默认是在当前窗口中打开 目标网页。 ? “公用的目标区”列表框选项含义如下: ? 相同框架:链接的目标网页显示在包含该超链接的同一个框 架内。 ? 整页:将框架展开为全窗口后显示链接的目标网页。 ? 新建窗口:另外打开一个浏览窗口显示链接的目标网页。 ? 父框架:如果是一页套一页的框架网页,选择父框架可以回 到上一层框架显示链接的目标网页。
40

验证超级链接
? 上面的三个步骤设置完成后,超链接的创建便完成 了。接下来有必要验证一下超链接是否正确,可用 如下的方法来验证: ? 网页的设计视图中,把鼠标移到已经创建了超链接 的载体上(文字、图像),鼠标变成手状,按下 <Ctrl>键,然后单击鼠标,便可验证链接目的地。 ? 在网页的预览视图中,用鼠标单击创建了链接的载 体,便可验证链接目的地。

41

设置超链接的状态颜色
? 在浏览器中浏览网页时, 已经访问过的超链接、 尚未访问过的超链接和 正在访问的超链接应有 不同的颜色显示,使浏 览者一目了然。 ? 设置超链接的状态颜色 方法:选择【格式】 【背景】命令,打开 “网页属性”对话框。 选中“背景”选项卡, 对与超链接有关的部分 进行设置。

42

图像映射

视图-工具栏-图片

? 图像映射也称MAP技术,是指在一幅图像上建立不同形状的热 点区域,每一个区域都是一个超链接。制作步骤如下: ? 选定要制作图像映射的图片,此时屏幕会显示出“图片”工具 栏,在“图片”工具栏上有5个专门是为图像映射功能设置的。 ? 单击“图片”工具栏中一种热点形式,并将光标移到要制作图 像映射的图片中,光标变成铅笔形状然后用鼠标在图片中拖动 出一个矩形区域。 ? 松开鼠标后,出现“创建超链接”对话框,从中可设置该热点 的链接目标。

43

2.4 Web组件
? 1.字幕
? 2.横幅广告

44

字幕

? 字幕是在浏览器中能够水平滚动的文字,其文字具有动态特点, 可以用于发布网站的通知和提示信息。其操作步骤如下: ? 选择插入字幕的位置; ? 选择【插入】【Web组件】命令; ? 选择“选择一种效果”列表中的“字幕”选项,然后单击“完 成”按钮,打开“字幕属性”对话框; ? 设置字幕属性,如在文本框中输入滚动的文字,选择滚动方向 等,然后单击“确定”按钮,便完成滚动字幕的插入; ? 切换到预览视图,观看滚动字幕的效果。 ? 更改字幕属性,在网页设计视图下双击该字幕,或选中字幕单 击鼠标右键,在弹出的快捷菜单中选择“字幕属性…”,便可 弹出字幕属性对话框。
45

横幅广告
? 横幅广告的动画形式就像一幅不停变换着的广告牌。 ? 在网页中插入横幅广告的操作步骤: ? 选择插入位置; “工具”菜单-“自定义”-命令-“插入”-“横幅广告管理器” 选择【插入】【横幅广告管理器】命令,打开“横幅广告 管理器属性”对话框; ? 选择属性对话框中的“添加…”按钮,添加要显示的图片 (至少要有两幅图片才能变换显示); ? 高度、宽度属性设置图片的显示框的大小;过渡效果设置 图片的显示效果。 ? 切换到预览视图,查看横幅广告的效果。
46


相关文章:
FrontPage 2003
第六章 网页制作软件 FrontPage2003 FrontPage2003 是 MicrosoftOmce 家族的成员之一,是 Microsoft 公 司推出的网页制作与开发、建立 WeL 网站、编写 Web 页的工具...
江苏高中信息技术学业水平测试《计算机基础第六章》
江苏高中信息技术学业水平测试《计算机基础第六章》_其它课程_高中教育_教育专区。...( ) A、FrontPage B、Authorware C、Notepad D、Dreamweaver 本题答案:C 考生...
第六章网络与多媒体
第六章FrontPage网络多媒体... 50页 免费 第6章 网络多媒体与网站制... 38...第六章 网络与多媒体自从产生了计算机,就有了计算机技术与通信技术的结合。这种...
教案:第6章 绘图和使用多媒体(二)
第6 章 绘图和使用多媒体(二)授课时间:2004 授课时间:2004 年 10 月 06 ...III.提问: (时间:10 分钟)(1)如何在 Frontpage2000 中使用绘图和艺术字? (...
六年级教案FRONTPAGE
年级教案FRONTPAGE_其它课程_小学教育_教育专区。教案FRONTPAGE第最 简 二单 的...那好,我们本章就来学习如何制作。 首先我们运行 Frontpage2000,并且打开一个站点...
第六章_信息集成与信息交流教案
第六章_信息集成与信息交流教案_理学_高等教育_教育专区。第六章 信息集成与信息...介绍常见的信息集成工具,具体以 学习 FrontPage 通过讲授使学 FrontPage 2000 ...
FrontPage2003练习题一(含答案)张祥刚老师编写20150109
A、Microsoft B、Sun C、Borland D、IBM 5、在网页制作中,常选用经过压缩,且容量较小的图片格式是( ) A、PDF B、BMP C、JPG D、PNG 6、在 FrontPage2003...
第六章 信息集成与信息交流
第六章《信息集成与信息交流》知识点 6.1 信息集成 一、信息集成一般过程 1、...在 FrontPage2000 中编辑网页时,对 JPEG 格式的图片可以进行的操作是 ( )。 ...
frontpage测试题
Frontpage 2000 中有 任务等种视图。 4. 在 Frontpage 2000 中,设置表格中单元格背景图片可以在“ 的“ ”命令里设置。 命令。 ”“、” ”可以 可以让...
第六章 信息集成与信息交流
第六章《信息集成与信息交流》 第六章《信息集成与信息交流》知识点 6.1 信息...需要注意的是: 需要注意的是:在用 Frontpage 发布网页时,提供主页空间的网站...
更多相关标签:
frontpage | frontpage网页制作 | frontpage 2003 | microsoft frontpage | frontpage官方下载 | frontpage 2013 | frontpage2003下载 | frontpage下载 |