Part医学网站的建立与FRONTPAGE的使用

《Part医学网站的建立与FRONTPAGE的使用》由会员分享，可在线阅读，更多相关《Part医学网站的建立与FRONTPAGE的使用（99页珍藏版）》请在装配图网上搜索。

1、FRONTPAGE20021Part 3 医学网站的建立与医学网站的建立与FRONTPAGE2002的使用的使用计算机医学实用技术计算机医学实用技术生物医学工程研究所生物医学工程研究所 张玉华张玉华FRONTPAGE20022Chapter 13 FrontPage2002基础知识基础知识w13.1 必备的必备的Internet知识概述知识概述w13.2 FrontPage2002功能简介功能简介w13.3 FrontPage2002界面界面w13.4 基本的文件操作基本的文件操作w13.5 基本的站点操作基本的站点操作FRONTPAGE2002313.1 必备的必备的Internet知识概述

2、知识概述wInternet的各种服务的各种服务WWW：world wide webE-mailFTP:文件传输协议（文件传输协议（File Transfer Protocol）,下载文件，在下载文件，在Internet的两台主机之间传递文件。的两台主机之间传递文件。Telnet：远程登录：远程登录(Remote Logon)FRONTPAGE20024w万维网万维网(WWW)和和Web页页 为为Internet核心，由一个个互联互通的网站所组成的信息核心，由一个个互联互通的网站所组成的信息的海洋。的海洋。网站的灵魂就是网页（网站的灵魂就是网页（Web页）。页）。Web页面：是包含了超文本标记的

3、一种文本文件，它和页面：是包含了超文本标记的一种文本文件，它和其他普通文档的不同之处在于该文本文件还包含了与许其他普通文档的不同之处在于该文本文件还包含了与许多图形文件和其他多图形文件和其他Web页面间相互链接的页面间相互链接的URL标记和其标记和其他格式化信息。可以综合许多种元素，如图片、文本、他格式化信息。可以综合许多种元素，如图片、文本、视频等。视频等。Web页面必须通过页面必须通过Web浏览器来解释执行。浏览器来解释执行。w Microsoft Internet Explorerw Netscape navigator。FRONTPAGE20025Web页面的工作原理：页面的工作原理：

4、WWW是是Client/Server（客户（客户/服务器）体系结构服务器）体系结构w客户端（客户端（Client）即访问者计算机上的）即访问者计算机上的web浏览器向浏览器向web服务器发出请求信息服务器发出请求信息wWeb服务器接收客户端的请求，并调用服务器端的处服务器接收客户端的请求，并调用服务器端的处理程序将客户端的请求处理后发送回客户端浏览器理程序将客户端的请求处理后发送回客户端浏览器（Web服务器通过向浏览器传递服务器通过向浏览器传递HTML代码来响应浏代码来响应浏览器发出的请求）览器发出的请求）w浏览器将返回的信息解释后将结果显示在屏幕上浏览器将返回的信息解释后将结果显示在屏幕上H

5、TML（超文本标识语言）是一种标识语言，它（超文本标识语言）是一种标识语言，它告诉浏览器每个页面元素的排列位置与风格。告诉浏览器每个页面元素的排列位置与风格。FRONTPAGE2002613.2 FRONTPAGE2002 功能简介功能简介wFrontPage 2002 是是OFFICE XP家族成员之一，为家族成员之一，为创建和管理极具专业水准的创建和管理极具专业水准的Web站点提供了妥善的站点提供了妥善的解决方案，无需编程即可拥有极具专业水准的解决方案，无需编程即可拥有极具专业水准的Web站点。站点。wFrontPage能够解释和生成能够解释和生成web页面的页面的HTML代码，代码，利用

6、利用FrontPage，网页制作人员不需要学习、书写，网页制作人员不需要学习、书写HTML源代码即可快速并轻松地设计出各种专业网源代码即可快速并轻松地设计出各种专业网站，同时能够对整个站点的内容和结构进行高效的站，同时能够对整个站点的内容和结构进行高效的管理。管理。w既适用于缺少既适用于缺少HTML知识的入门者，也同样适用于知识的入门者，也同样适用于有经验的网页制作专业技术人员，建设专业品质有经验的网页制作专业技术人员，建设专业品质Internet和和Intranet网站的最佳工具。网站的最佳工具。FRONTPAGE20027wFrontPage2002的特点：的特点：简单易用简单易用 与与

7、Word相似的界面，所见即所得地创作。相似的界面，所见即所得地创作。工具增强工具增强站点管理站点管理 可在短时间内配置和更改所有文件，所有的站可在短时间内配置和更改所有文件，所有的站点管理工具、文件、设置等都可轻松访问、轻松管理。点管理工具、文件、设置等都可轻松访问、轻松管理。数据库集成数据库集成 轻松实现浏览和发送信息到数据库。轻松实现浏览和发送信息到数据库。丰富的主题丰富的主题 轻松自定义站点样式，并可控制站点网页颜轻松自定义站点样式，并可控制站点网页颜色、字体、图像、项目符号等属性。色、字体、图像、项目符号等属性。交互性内容交互性内容 轻松在网页内插入图片、音乐和视频。内置轻松在网页内插

8、入图片、音乐和视频。内置对动画技术的支持，如对动画技术的支持，如DHTML，轻松创建简单动画。，轻松创建简单动画。HTML源代码编辑源代码编辑 FrontPage允许直接进行允许直接进行HTML代码代码编辑。编辑。FRONTPAGE2002813.3 FRONTPAGE2002 界面界面w启动启动FrontPage 2002：“开始开始”菜单中的菜单中的“程序程序Microsoft FrontPage”w界面：界面：标题栏、菜单栏、工具栏、状态栏标题栏、菜单栏、工具栏、状态栏“视图视图”工具栏：在窗口的左侧工具栏：在窗口的左侧文件夹列表：视图栏右边，显示当前打开站点的文件夹文件夹列表：视图栏右

9、边，显示当前打开站点的文件夹结构。结构。“视图视图文件夹列表文件夹列表”编辑窗口：中间，用来进行网页的编辑和网站的管理，编辑窗口：中间，用来进行网页的编辑和网站的管理，根据所选视图模式的不同，包含的具体内容也不相同。根据所选视图模式的不同，包含的具体内容也不相同。任务窗格：最右面，可快速地执行一些常用的命令，分任务窗格：最右面，可快速地执行一些常用的命令，分为为“新建网页或站点新建网页或站点”、“剪贴板剪贴板”（24次）、次）、“搜索搜索”三部分，三部分，“视图视图任务窗格任务窗格”FRONTPAGE20029图13-1 FrontPage 2002的操作界面FRONTPAGE200210w视

10、图，视图，6种视图帮助完成站点创作、发布与管理的全部任务种视图帮助完成站点创作、发布与管理的全部任务网页视图：创建和编辑网页，编辑框中显示当前页，编辑框顶部显网页视图：创建和编辑网页，编辑框中显示当前页，编辑框顶部显示网页文件名，编辑框顶部的选项卡在多个打开的文件间进行切换示网页文件名，编辑框顶部的选项卡在多个打开的文件间进行切换w“普通普通”标签下：所见即所得地编辑网页，标签下：所见即所得地编辑网页，w“HTML”标签下：直接查看、编辑及修订标签下：直接查看、编辑及修订HTML代码代码w“预览预览”标签下：用标签下：用FrontPage仿真浏览器环境预览当前网页的实际效仿真浏览器环境预览当前

11、网页的实际效果果文件夹视图文件夹视图报表视图报表视图导航视图导航视图超链接视图超链接视图任务视图：用来指定、分配与协调工作，并藉以掌控不同网页目前任务视图：用来指定、分配与协调工作，并藉以掌控不同网页目前的进度。的进度。FRONTPAGE200211图13-2“HTML”标签下的网页视图FRONTPAGE20021213.4 基本的文件操作基本的文件操作13.4.1 新建网页新建网页w单击工具栏上的按钮，单击工具栏上的按钮，FrontPage将自动创建一个空将自动创建一个空白页，第一个空白页的文件名自动设为白页，第一个空白页的文件名自动设为new_page_1.htm。w利用网页模板来创建新网

12、页利用网页模板来创建新网页模板是模板是FrontPage预设的若干个内置的页面，它已经按照一预设的若干个内置的页面，它已经按照一定的格式设置好，用户可根据实际需要利用现成的模板快速定的格式设置好，用户可根据实际需要利用现成的模板快速建立自己所需要的网页，大大提高开发效率。建立自己所需要的网页，大大提高开发效率。“任务窗格任务窗格”“网页模板网页模板”，打开，打开“网页模板网页模板”对话框对话框w“常规常规”：共提供了：共提供了27个常规类型的网页模板个常规类型的网页模板w“框架网页框架网页”w“样式表样式表”FRONTPAGE20021313.4.2 打开文件打开文件w 打开一个已有的文件打开

13、一个已有的文件文件位于当前已打开站点上：在任一视图下，双击该文件图标或文件名就可文件位于当前已打开站点上：在任一视图下，双击该文件图标或文件名就可以打开该文件。以打开该文件。文件位于另一个站点或是本地计算机的文件夹：单击文件位于另一个站点或是本地计算机的文件夹：单击“文件文件打开打开”或或“常常用用”工具栏上的工具栏上的“打开打开”按钮，在弹出的按钮，在弹出的“打开文件打开文件”对话框中查找需要打对话框中查找需要打开的文件。开的文件。w 打开最近使用过的文件打开最近使用过的文件单击单击“文件文件最近使用的文件最近使用的文件”从弹出菜单中选择想要的文件。从弹出菜单中选择想要的文件。w 打开其他类

14、型的文件打开其他类型的文件 如超文本模板、超文本样式表、如超文本模板、超文本样式表、RTF格式、文本文件、格式、文本文件、Word文件、文件、Excel文件等，并自动将原有的文件转成类似于文件等，并自动将原有的文件转成类似于HTML格式的文件，然后可以像通格式的文件，然后可以像通常一样修改和编辑这些文件。常一样修改和编辑这些文件。当在当在Web中打开一个文件时，中打开一个文件时，FrontPage总是使用与这些文件相关联的编总是使用与这些文件相关联的编辑器来打开它。可以单击辑器来打开它。可以单击“工具工具选项选项”，在弹出的对话框中选，在弹出的对话框中选“配置编辑配置编辑器器”选项卡来改变默认

15、的设置。选项卡来改变默认的设置。FRONTPAGE200214w13.4.3 保存文件保存文件 保存已打开的文件时，选择保存已打开的文件时，选择“文件文件保存保存”或单击工或单击工具栏上的保存按钮。具栏上的保存按钮。保存新建的文件时，选择保存新建的文件时，选择“文件文件保存保存”或单击工具或单击工具栏上的保存按钮，在打开的栏上的保存按钮，在打开的“另存为另存为”对话框中进行设对话框中进行设置。保存类型，网页标题，置。保存类型，网页标题，“更改标题更改标题”按钮按钮 当在页面中插入图像、音频或视频等多媒体文件时，按当在页面中插入图像、音频或视频等多媒体文件时，按“保存保存”按钮后，出现按钮后，出

16、现“保存嵌入式文件保存嵌入式文件”对话框，询对话框，询问是否保存该多媒体文件，可以选择重命名或改变保存问是否保存该多媒体文件，可以选择重命名或改变保存的文件夹，以及设置保存操作选项，在一般情况下，你的文件夹，以及设置保存操作选项，在一般情况下，你需要保存这些图像或其他多媒体文件。需要保存这些图像或其他多媒体文件。FRONTPAGE20021513.5 基本站点操作基本站点操作w所谓站点，就是一些网页和程序的集合。各个网页所谓站点，就是一些网页和程序的集合。各个网页之间通过超链接联系在一起，所有的网页和文件保之间通过超链接联系在一起，所有的网页和文件保存在一个文件夹中，通过站点把这些文件和网页统

17、存在一个文件夹中，通过站点把这些文件和网页统一起来。所以说，建立一个新站点，事实上就是建一起来。所以说，建立一个新站点，事实上就是建立一个单独的文件夹，然后在这个文件夹中建立各立一个单独的文件夹，然后在这个文件夹中建立各个网页文件，并且把它们链接在一起。个网页文件，并且把它们链接在一起。w站点中会自动建立两个固定的文件夹：站点中会自动建立两个固定的文件夹：_private文件夹：存储隐含的文件。该文件夹下的文件对文件夹：存储隐含的文件。该文件夹下的文件对于站点访问者来说是不可见的。于站点访问者来说是不可见的。images文件夹：存储图象文件，保持文件夹：存储图象文件，保持web站点的整洁。站点

18、的整洁。FRONTPAGE200216w13.5.1 新建站点新建站点 选择选择“文件文件新建新建网页或站点网页或站点”，从任务窗格中选择，从任务窗格中选择“Web站站点模板点模板”，或用新建普通网页按钮弹出，或用新建普通网页按钮弹出“Web站点模板站点模板”对话框。对话框。在在“站点站点”选项卡中，共提供了选项卡中，共提供了10种站点模板。它们都根据各自的种站点模板。它们都根据各自的用途提供了完整的站点结构和巧妙的页面组织。使用这些模板，用用途提供了完整的站点结构和巧妙的页面组织。使用这些模板，用户可以十分方便地建立一个专业站点的完整框架，大大减轻了用户户可以十分方便地建立一个专业站点的完整

19、框架，大大减轻了用户的工作量。的工作量。w 常用的站点模板：常用的站点模板：空白站点；只创建相应的空白站点；只创建相应的Web文件夹，不包含任何文件夹，不包含任何web页和资源。页和资源。只有一个网页的站点；该模板将创建一个有一空白网页的新站点。只有一个网页的站点；该模板将创建一个有一空白网页的新站点。导入站点向导：创建一个站点，并将本地计算机目录或远程系统中的文档导入站点向导：创建一个站点，并将本地计算机目录或远程系统中的文档 添加到这个新建的站点中。添加到这个新建的站点中。公司展示站点：用来为公司或企业创建一个专业的公司展示站点：用来为公司或企业创建一个专业的Internet展示。展示。客

20、户支持站点：创建一个提供客户支持服务的站点，通过该站点提供公司简客户支持站点：创建一个提供客户支持服务的站点，通过该站点提供公司简介、产品信息、软件下载，还可以提供一个用于客户支持的讨论组，该站点介、产品信息、软件下载，还可以提供一个用于客户支持的讨论组，该站点尤其适用于软件公司作为软件产品的技术支持站点。尤其适用于软件公司作为软件产品的技术支持站点。个人站点：快速创建一个个人站点，包含兴趣爱好、照片和喜好。个人站点：快速创建一个个人站点，包含兴趣爱好、照片和喜好。讨论站点向导；创建一个带有线索、目录和全文搜索能力的讨论组，讨论站点向导；创建一个带有线索、目录和全文搜索能力的讨论组，该该讨论组

21、可以让访问者留下信息或回答信息，并以有关的线索组织信息讨论组可以让访问者留下信息或回答信息，并以有关的线索组织信息 FRONTPAGE200217w选择了相应的向导或模板后，在选择了相应的向导或模板后，在“指定新站点的位指定新站点的位置置”下拉列表中指定新站点所在的文件夹，可手工下拉列表中指定新站点所在的文件夹，可手工输入也可以单击输入也可以单击“浏览浏览”按钮进行选择。按钮进行选择。w指定了新站点的位置后，还可以指定是否要将新站指定了新站点的位置后，还可以指定是否要将新站点作为子站点添加到当前已打开的点作为子站点添加到当前已打开的Web站点，如果站点，如果选择了选择了web服务器作为新站点的

22、位置，那么还可选服务器作为新站点的位置，那么还可选择是否需要择是否需要“安全的链接安全的链接(SSL)”来保护你的站点安来保护你的站点安全。全。w单击单击“确定确定”按钮，系统就会自动建立起相应的文按钮，系统就会自动建立起相应的文件和文件夹，下面就可以双击文件进行编辑和修改件和文件夹，下面就可以双击文件进行编辑和修改网页了。网页了。FRONTPAGE20021813.5.2 打开站点打开站点w单击单击“文件文件打开站点打开站点”或按工具栏上的或按工具栏上的“打开打开”按钮边上的下拉标志，从下拉菜单按钮边上的下拉标志，从下拉菜单中选中选“打开站点打开站点”，在弹出的，在弹出的“打开站点打开站点”

23、对话框中找到需要打开的站点后按对话框中找到需要打开的站点后按“打开打开”按钮即可。按钮即可。w如想在每次启动如想在每次启动FrontPage时自动打开上次时自动打开上次打开的站点，可以从打开的站点，可以从“选项选项”对话框的对话框的“常常规规”选项卡中选择选项卡中选择“在启动在启动FrontPage时，时，自动打开上次打开的站点自动打开上次打开的站点”。FRONTPAGE200219第第14章章 网页编辑的基础知识网页编辑的基础知识 14.1 设置文本格式设置文本格式 14.2 创建超链接创建超链接14.3 图像处理图像处理 14.4 插入水平线插入水平线14.5 应用表格应用表格FRONTP

24、AGE20022014.1 设置文本格式设置文本格式 14.1.1文字格式和段落格式文字格式和段落格式 文字格式文字格式 包括：字体、字形、字号、字体颜色、包括：字体、字形、字号、字体颜色、字符间距和应用一些特殊效果等。字符间距和应用一些特殊效果等。w格式工具栏上相应的工具按钮格式工具栏上相应的工具按钮w“格式格式字体字体”，“字体字体”对话框对话框 段落格式段落格式 包括：段落对齐、段落缩进、行间距、包括：段落对齐、段落缩进、行间距、段落间距等。段落间距等。w格式工具栏上相应的工具按钮格式工具栏上相应的工具按钮w“格式格式段落段落”，“段落段落”对话框对话框FRONTPAGE20022114

25、.1.2 使用文本样式使用文本样式内置了多种文本样式，利用它可以快速地设置文内置了多种文本样式，利用它可以快速地设置文本的格式，包括：标题、地址、目录列表、编号本的格式，包括：标题、地址、目录列表、编号列表、菜单列表、项目符号列表、默认字符样式。列表、菜单列表、项目符号列表、默认字符样式。应用样式应用样式 “格式格式”工具栏工具栏“样式样式”选择框下拉按钮选择框下拉按钮FRONTPAGE200222修改样式修改样式 “格式格式样式样式”，“样式样式”对话框对话框新建样式新建样式 “样式样式”对话框中单击对话框中单击“新建新建”按钮按钮 可在可在“格式格式”栏栏“样式样式”下拉列表中应用新建样下

26、拉列表中应用新建样式。式。FRONTPAGE20022314.1.3 使用列表格式使用列表格式在网页设计过程中内容按条目来说明在网页设计过程中内容按条目来说明每一条前加一圆点、方块、圆圈、图片或其他符每一条前加一圆点、方块、圆圈、图片或其他符号，叫做号，叫做项目符号项目符号。按先后顺序来说明问题，在每一条前加数字序号，按先后顺序来说明问题，在每一条前加数字序号，叫叫编号编号。编号和项目符号统称编号和项目符号统称列表列表，利用列表来设计网页，利用列表来设计网页可使页面排版美观，内容清晰。可使页面排版美观，内容清晰。项目符号与编号混合使用，称为项目符号与编号混合使用，称为多级列表多级列表。FRON

27、TPAGE200224利用格式工具栏上的利用格式工具栏上的“编号编号”和和“项目符号项目符号”按按钮可以快速地在网页中添加列表格式。钮可以快速地在网页中添加列表格式。选择不同的项目符号和数字格式选择不同的项目符号和数字格式 “格式格式项目符号和编号项目符号和编号”，“列表属性列表属性”对对话框话框w“编号编号”选项卡选项卡w“无格式项目列表无格式项目列表”选项卡选项卡w“图片项目符号图片项目符号”选项卡选项卡FRONTPAGE20022514.1.4 插入注释文字插入注释文字便于编辑维护页面。便于编辑维护页面。插入方法：插入方法：“插入插入注释注释”，“插入注释插入注释”对话对话框框注释文字只

28、在编辑状态显示，在浏览器中浏览网注释文字只在编辑状态显示，在浏览器中浏览网页时不显示。页时不显示。FRONTPAGE20022614.2 创建超链接创建超链接w超链接是从一个网页指向另一个目的端的链超链接是从一个网页指向另一个目的端的链接，通过超链接很方便地从一个页面（或网接，通过超链接很方便地从一个页面（或网站）漫游到另一个页面（或网站）。站）漫游到另一个页面（或网站）。w超链接包括两部分：超链接包括两部分：链接的链接的载体载体（指包含超链接的文字或图像），根（指包含超链接的文字或图像），根据链接载体的不同，超链接分为据链接载体的不同，超链接分为图像超链接图像超链接和和文文字超链接字超链接。

29、链接的链接的目的地址目的地址（单击超链接后所显示的内容），（单击超链接后所显示的内容），它可以是一个网页，也可是另一个网站或电子邮它可以是一个网页，也可是另一个网站或电子邮件地址。件地址。FRONTPAGE20022714.2.1建立超链接建立超链接选中要建立超链接的选中要建立超链接的文字文字或或图像图像单击常用工具栏中的单击常用工具栏中的“插入超链接插入超链接”按钮或单击按钮或单击“插入插入超链接超链接”菜单命令，打开菜单命令，打开“编辑超链接编辑超链接”对话框对话框w 链接到站点内的其他网页链接到站点内的其他网页 对话框左面对话框左面“链接到链接到”框中的框中的“原有原有文件或文件或Web

30、页页”按钮；单击按钮；单击“屏幕提示屏幕提示”按钮，定义鼠标指向超按钮，定义鼠标指向超链接时显示的提示文字。链接时显示的提示文字。w 链接到其他网站链接到其他网站 “原有文件或原有文件或web页页”按钮，按钮，在在“地址地址”框中框中直接输入网址；在直接输入网址；在“浏览过的页浏览过的页”列表中选择一个网址；单击列表中选择一个网址；单击“浏览浏览web页页”按钮浏览需要链接到的网站。按钮浏览需要链接到的网站。w 链接到新网页链接到新网页 单击单击“新建文档新建文档”按钮。按钮。w 链接到电子邮件链接到电子邮件 单击单击“电子邮件地址电子邮件地址”按钮。按钮。FRONTPAGE20022814.

31、2.2 创建图像热点链接创建图像热点链接图像热点链接就是在一个图像之上建立多个不同的链接，每一个链图像热点链接就是在一个图像之上建立多个不同的链接，每一个链接分别对应一圆形、矩形或多边形的区域，每一个区域就叫做一个接分别对应一圆形、矩形或多边形的区域，每一个区域就叫做一个“热点热点”。当鼠标移到该热区域内单击鼠标时，就可以直接跳转到。当鼠标移到该热区域内单击鼠标时，就可以直接跳转到该链接所指的网页中。该链接所指的网页中。建立图像热点链接的操作：建立图像热点链接的操作：w 选定图像，选定图像，w 单击单击“图片图片”工具栏右边的长方形热点、圆形热点或多边形热点按钮，工具栏右边的长方形热点、圆形热

32、点或多边形热点按钮，在图像上拖曳鼠标画出相应的形状在图像上拖曳鼠标画出相应的形状;w 松开鼠标打开松开鼠标打开“插入超链接插入超链接”对话框，创建一个超链接。对话框，创建一个超链接。w 重复以上操作，在一个图像上建立起多个热点链接。如图重复以上操作，在一个图像上建立起多个热点链接。如图13-1所示的研所示的研究所主页由图片组成，在图片上创建了两个矩形的热点，分别覆盖了显究所主页由图片组成，在图片上创建了两个矩形的热点，分别覆盖了显示示“中文版中文版”和和“英文版英文版”文字的区域，并把这两个热点分别链接到站文字的区域，并把这两个热点分别链接到站点内的中文版主页（点内的中文版主页（chinese

33、/index1.htm）和英文版主页）和英文版主页（english/index1.htm）。）。图图14-16 突出显示的两个热点图突出显示的两个热点图14-15 在在网页上创建的两个热点网页上创建的两个热点w 热点形状重叠在图像上不易时，点击图片工具栏上的热点形状重叠在图像上不易时，点击图片工具栏上的“突出显示热点突出显示热点”按钮，将图像内容隐藏起来，只显示热点形状。按钮，将图像内容隐藏起来，只显示热点形状。FRONTPAGE20022914.2.3 建立指向书签的超链接建立指向书签的超链接书签是网页中被标记的位置，可作为同一页面或书签是网页中被标记的位置，可作为同一页面或其他页面中的超链

34、接的目标。其他页面中的超链接的目标。书签的一个常见用法是将一个内容较长的网页的书签的一个常见用法是将一个内容较长的网页的各个标题定义为书签，然后在网页开头创建目录，各个标题定义为书签，然后在网页开头创建目录，目录中的项目是分别指向不同书签的超链接。单目录中的项目是分别指向不同书签的超链接。单击目录中的项目可快速定位到相应内容所在的位击目录中的项目可快速定位到相应内容所在的位置，方便访问者浏览网页。置，方便访问者浏览网页。FRONTPAGE200230建立指向书签的超链接建立指向书签的超链接 的方法：的方法：w单击单击“插入插入书签书签”菜单命令，打开菜单命令，打开“书签书签”对话框，对话框，在

35、在“书签名书签名”文本框中给书签起个名字文本框中给书签起个名字w单击单击“确定确定”按钮，目的地前方出现表示此处为一书签按钮，目的地前方出现表示此处为一书签的符号的符号w回到网页开头，选取欲作为书签超链接的文字或图片设回到网页开头，选取欲作为书签超链接的文字或图片设置超链接，在置超链接，在“插入超级链接插入超级链接”对话框中单击右边的对话框中单击右边的“书签书签”按钮，在打开的按钮，在打开的“在文档中选择位置在文档中选择位置”对话框对话框中选择目的书签名称，按中选择目的书签名称，按“确定确定”完成。完成。FRONTPAGE20023114.3 图像处理图像处理14.3.1 网页中使用的图像格式

36、网页中使用的图像格式网页中广泛使用的图像格式有网页中广泛使用的图像格式有GIF和和JPEG，两种图像格式之间有差别，但，两种图像格式之间有差别，但它们存储的图像信息都是经过压缩处理的，体积都较小，适于在网上传输。它们存储的图像信息都是经过压缩处理的，体积都较小，适于在网上传输。GIF（图像交换格式），缺点是最多只能用（图像交换格式），缺点是最多只能用 256 种不同的颜色来显示数据。种不同的颜色来显示数据。w 用于保存和压缩基于文字的图像、线条和剪贴画等，这些图像类型不需要百万色，用于保存和压缩基于文字的图像、线条和剪贴画等，这些图像类型不需要百万色，很容易存成非常小的很容易存成非常小的 GI

37、F 文件。文件。w 用来做动画，因其可以保存多个图像。用来做动画，因其可以保存多个图像。JPEG-由联合摄影专家组（由联合摄影专家组（Joint Photographic Experts Group）开发，）开发，24 位图像格式（真彩色，支持位图像格式（真彩色，支持 16 百万色）。百万色）。w 是在是在 Internet 上展现实景图像的标准格式，可将大型图像压缩得非常小，同时能上展现实景图像的标准格式，可将大型图像压缩得非常小，同时能够保留图像的整体质量。够保留图像的整体质量。w 最大缺点是图像压缩的越多，信息就丢失的越多。将文件保存为最大缺点是图像压缩的越多，信息就丢失的越多。将文件保

38、存为 JPEG 时，在压时，在压缩率与质量之间求得一个平衡至关重要。缩率与质量之间求得一个平衡至关重要。FrontPage所支持的图像格式还包括：所支持的图像格式还包括：BMP、EPS、MAC、MSP、PCD、PCX、RAS、TIFF、WMF和和WPG等。等。使用这些图像格式时使用这些图像格式时FrontPage把它们自动转成把它们自动转成GIF（256种颜色以内的种颜色以内的图像）或图像）或JPEG格式（格式（256种颜色以上的图像）种颜色以上的图像）。FRONTPAGE20023214.3.2 插入图像插入图像插入当前站点中的图像插入当前站点中的图像w 将光标移到插入图像的位置将光标移到插

39、入图像的位置w 单击单击“插入插入图片图片来自文件来自文件”菜单命令或常用工具栏中的菜单命令或常用工具栏中的“插插入文件中的图片入文件中的图片”按钮，打开按钮，打开“图片图片”对话框，系统将自动打开对话框，系统将自动打开当前站点，选择所需的图像文件。如果选取的图像不在当前站点当前站点，选择所需的图像文件。如果选取的图像不在当前站点中保存时，程序将提醒图像文件的保存路径。中保存时，程序将提醒图像文件的保存路径。插入剪贴画插入剪贴画单击单击“插入插入图片图片剪贴画剪贴画”命令，出现命令，出现“插入剪贴画插入剪贴画”任务窗格。任务窗格。在在“搜索文字搜索文字”中输入要搜索的剪贴画名称，选择合适的中输

40、入要搜索的剪贴画名称，选择合适的“搜索范搜索范围围”和和“结果类型结果类型”，单击，单击“搜索搜索”按钮，显示出要查找的图片，按钮，显示出要查找的图片，单击图片，就可插入到当前网页中。单击图片，就可插入到当前网页中。直接单击下方的直接单击下方的“剪辑管理器剪辑管理器”打开剪辑库浏览器，从中浏览并选打开剪辑库浏览器，从中浏览并选择所需的剪贴画图片。择所需的剪贴画图片。FRONTPAGE20023314.3.3 编辑图像编辑图像调整图像大小和位置：调整图像大小和位置：w 单击选中图像，在图像周围出现控制点，用鼠标按住任一控制点单击选中图像，在图像周围出现控制点，用鼠标按住任一控制点拖动，改变图像的

41、大小。拖动，改变图像的大小。w 单击选中图像，拖动图像到新的位置释放鼠标，可将图像移动到单击选中图像，拖动图像到新的位置释放鼠标，可将图像移动到新的位置。新的位置。w 右键单击图像，在弹出菜单中选择右键单击图像，在弹出菜单中选择“图片属性图片属性”命令，打开命令，打开“图图片属性片属性”对话框。对话框。处理图片：在已经创建的图片上单击左键，出现处理图片：在已经创建的图片上单击左键，出现“图片图片”浮动工具栏，所有图标按钮都可对图像进行操作处理。浮动工具栏，所有图标按钮都可对图像进行操作处理。绘图工具：绘图工具：w 利用绘图工具，方便绘制简单图形利用绘图工具，方便绘制简单图形w“视图视图工具栏工

42、具栏绘图绘图”菜单命令，打开绘图工具栏菜单命令，打开绘图工具栏 FRONTPAGE20023414.3.4 设置图像背景设置图像背景将一些精美的图片作为网页的背景以美化页面。将一些精美的图片作为网页的背景以美化页面。用图像作为网页背景的操作是：单击用图像作为网页背景的操作是：单击“格式格式背景背景”菜单命令，打菜单命令，打开开“网页属性网页属性”对话框，选背景图片对话框，选背景图片”选项，单击选项，单击“浏览浏览”按钮，按钮，选择所需的背景图像。选择所需的背景图像。如想用任意颜色作为网页的背景色，需单击如想用任意颜色作为网页的背景色，需单击“背景背景”右边的下拉按右边的下拉按钮，选择所需的颜色

43、。钮，选择所需的颜色。14.3.5 建立图片库建立图片库帮助建立一个包含众多图片的网页。帮助建立一个包含众多图片的网页。单击单击“插入插入图片图片新建图片库新建图片库”菜单命令，打开菜单命令，打开“图片库属性图片库属性”对话框；单击对话框；单击“图片图片”选项卡的选项卡的“添加添加”按钮，选择按钮，选择“图片来自文图片来自文件件”选项并选中要添加到网页中的图片，选项并选中要添加到网页中的图片，“上移上移”和和“下移下移”按钮按钮可调节图片出现的顺序。在可调节图片出现的顺序。在“布局布局”选项卡中可选择图片的布局样选项卡中可选择图片的布局样式。式。浏览时单击图片缩略图就可显示图片库中的图像浏览时

44、单击图片缩略图就可显示图片库中的图像。FRONTPAGE20023514.4 插入水平线插入水平线w建立页面层次建立页面层次通过不同级别的标题通过不同级别的标题通过用列表方式通过用列表方式通过插入水平线通过插入水平线w插入水平线方法插入水平线方法“插入插入水平线水平线”，在页面的当前位置插入一条水平线。，在页面的当前位置插入一条水平线。默认情况下，水平线的宽度与浏览器中页面宽度相同，默认情况下，水平线的宽度与浏览器中页面宽度相同，w更改水平线的属性更改水平线的属性双击水平线打开双击水平线打开“水平线属性水平线属性”对话框。对话框。FRONTPAGE20023614.5 应用表格应用表格 w表格

45、是网页制作中用处非常广泛的一种页面表格是网页制作中用处非常广泛的一种页面元素元素使网页内容排列整齐使网页内容排列整齐进行排版网页进行排版网页w表格分为表格分为行行和和列列，每个方格为一个，每个方格为一个单元格单元格。w表格和单元格由四个边框组成，左边和上边表格和单元格由四个边框组成，左边和上边的边框称为的边框称为亮边框亮边框，右边和下边的边框称为，右边和下边的边框称为暗边框暗边框。FRONTPAGE20023714.5.1 创建表格创建表格使用常用工具栏中的使用常用工具栏中的“插入表格插入表格”工具按钮工具按钮使用使用“表格表格插入插入表格表格”菜单命令，出现菜单命令，出现“插插入表格入表格”

46、对话框。对话框。手工绘制表格：手工绘制表格：w程序自动生成规则的表格，手工绘制更复杂的表格，程序自动生成规则的表格，手工绘制更复杂的表格，w“表格表格绘制表格绘制表格”，表格工具栏，鼠标变成铅笔的，表格工具栏，鼠标变成铅笔的形状，在编辑窗口中拖动鼠标绘制表格形状，在编辑窗口中拖动鼠标绘制表格w表格工具栏上还有擦除、插入行、插入列、删除单元表格工具栏上还有擦除、插入行、插入列、删除单元格、合并单元格、拆分单元格等功能按钮。格、合并单元格、拆分单元格等功能按钮。FRONTPAGE20023814.5.2 编辑表格编辑表格插入表格、行、列或单元格插入表格、行、列或单元格w 将光标移到某一单元格中，单

47、击将光标移到某一单元格中，单击“表格表格插入插入”，在子菜单中选，在子菜单中选择相应的命令选项。如选择择相应的命令选项。如选择“标题标题”命令，就会在表格的上方出命令，就会在表格的上方出现插入点，即标题行，可输入表格的标题。现插入点，即标题行，可输入表格的标题。合并、拆分单元格合并、拆分单元格w 选中要合并的多个单元格，单击选中要合并的多个单元格，单击“表格表格合并单元格合并单元格”菜单命令。菜单命令。w 将光标移到要拆分的单元格中或选中要拆分的几个单元格，单击将光标移到要拆分的单元格中或选中要拆分的几个单元格，单击“表格表格拆分单元格拆分单元格”菜单命令，出现菜单命令，出现“拆分单元格拆分单

48、元格”对话框，对话框，选择要拆分的样式和行数即可。选择要拆分的样式和行数即可。平均分布行或列平均分布行或列w 将表格行或列平均分配大小，用将表格行或列平均分配大小，用手工调整手工调整麻烦，不精确，选中需麻烦，不精确，选中需要平均分配大小的行或列，然后单击要平均分配大小的行或列，然后单击“表格表格自动调整自动调整平均分平均分布行布行”或或“平均分布列平均分布列”菜单命令即可。菜单命令即可。FRONTPAGE200239自动套用表格样式自动套用表格样式w 内置了很多种表格样式，将光标移到表格内，单击内置了很多种表格样式，将光标移到表格内，单击“表格表格表格表格自动套用格式自动套用格式”菜单命令，出

49、现菜单命令，出现“表格自动套用格式表格自动套用格式”对话框。对话框。表格转换表格转换w 表格转换成文本：选中表格后单击表格转换成文本：选中表格后单击“表格表格转换转换表格转换成文表格转换成文本本”w 文本转换成表格：选中要转换的文本，单击文本转换成表格：选中要转换的文本，单击“表格表格转换转换文本文本转换成表格转换成表格”，在打开的对话框中选择合适的文本分隔符。，在打开的对话框中选择合适的文本分隔符。精细设置精细设置(大小、边框和背景等大小、边框和背景等)w 选中整个表格或某一个单元格，单击选中整个表格或某一个单元格，单击“表格表格表格属性表格属性单元格单元格（表格）属性（表格）属性”命令，打

50、开命令，打开“表格属性表格属性”或或“单元格属性单元格属性”对对话框。话框。FRONTPAGE20024014.5.3 利用表格进行网页布局利用表格进行网页布局通常网页的布局使用：通常网页的布局使用：w 表格表格w 框架框架使用表格构造网页的版面，可将页面中的各种内容放在使用表格构造网页的版面，可将页面中的各种内容放在不同的位置上。不同的位置上。有经验的用户常会把表格作为主要的页面布局工具，这有经验的用户常会把表格作为主要的页面布局工具，这是因为表格几乎被所有的是因为表格几乎被所有的Web浏览器支持，从而可保证浏览器支持，从而可保证设计的网页能在浏览器中正确显示，设计的网页能在浏览器中正确显示

51、，表格的框架特性使用户可直接控制页面元素的位置，并表格的框架特性使用户可直接控制页面元素的位置，并使其按照所需要的方式显示。使其按照所需要的方式显示。FRONTPAGE200241使用表格规划网页布局时应遵循的原则是：使用表格规划网页布局时应遵循的原则是：w在开始网页设计前，先画一草图，对网页中各元素的在开始网页设计前，先画一草图，对网页中各元素的位置进行大致的布局，然后开始设计；位置进行大致的布局，然后开始设计；w应从外到内开始工作，先创建外部最大的表格，然后应从外到内开始工作，先创建外部最大的表格，然后根据需要合并单元格或在单元格中插入嵌套表格。根据需要合并单元格或在单元格中插入嵌套表格。

52、FRONTPAGE200242表格边框设为表格边框设为0，使看不，使看不到边框。到边框。图14-37 以表格形式布局的山东大学主页FRONTPAGE200243第第15章章 网页制作高级技巧网页制作高级技巧 w15.1 应用框架实现网页布局设计应用框架实现网页布局设计w15.2 应用表单制作交互式网页应用表单制作交互式网页w15.3 制作动态网页制作动态网页w15.4 插入插入FrontPage组件组件w15.5 在网页中加入多媒体在网页中加入多媒体w15.6 应用应用FrontPage主题设定网站整体风格主题设定网站整体风格FRONTPAGE20024415.1 应用框架实现网页布局设计应用

53、框架实现网页布局设计w框架网页框架网页:特殊的特殊的HTML网页，将浏览器窗口分成称为框架网页，将浏览器窗口分成称为框架的不同区域，每个区域都可以显示不同的网页。的不同区域，每个区域都可以显示不同的网页。常用于目录、文章或信息列表、或任何其他的网常用于目录、文章或信息列表、或任何其他的网页上页上框架网页本身并不包含可见内容，它只用来指定框架网页本身并不包含可见内容，它只用来指定要显示的其他网页及其显示方式。要显示的其他网页及其显示方式。在一个框架中单击超链接会在另一个框架在一个框架中单击超链接会在另一个框架(目标目标框架框架)中显示相应网页。中显示相应网页。FRONTPAGE200245一个框

54、架网页的创建过程比较复杂，需经过如下一个框架网页的创建过程比较复杂，需经过如下步骤：步骤：w 选择框架模板选择框架模板w 修改框架布局修改框架布局w 设置框架包含的网页设置框架包含的网页w 组织框架间的调用关系组织框架间的调用关系w 保存框架网页保存框架网页w 保存框架中显示的网页保存框架中显示的网页FRONTPAGE200246一个框架网页的创建步骤一个框架网页的创建步骤1：15.1.1 选择框架模板选择框架模板在在“网页模板网页模板”对话框中选择对话框中选择“框架网页框架网页”选选项卡，在列表框中选择要使用的框架网页模板项卡，在列表框中选择要使用的框架网页模板“说明说明”区域为该模板的描述

55、，区域为该模板的描述，“预览预览”区域区域为框架网页布局的预览图。为框架网页布局的预览图。FRONTPAGE200247一个框架网页的创建步骤一个框架网页的创建步骤2：15.1.2 修改框架布局修改框架布局调整框架大小调整框架大小w 手动调整，通过拖动框架的边框调整框架大小。手动调整，通过拖动框架的边框调整框架大小。w 通过修改框架属性来精确设定框架的大小。选择通过修改框架属性来精确设定框架的大小。选择“框架框架框架属框架属性性”菜单命令，出现菜单命令，出现“框架属性框架属性”对话框，在对话框，在“框架大小框架大小”区域区域中，调整中，调整“列宽列宽”和和“高度高度”设置。设置。拆分框架（内容

56、保存在原始框架中，并创建一新框架）拆分框架（内容保存在原始框架中，并创建一新框架）w 拖动框架边框来拆分框架：打开要修改的框架网页，同时按住拖动框架边框来拆分框架：打开要修改的框架网页，同时按住Ctrl键，并拖动框架的任一边框，将一个框架平均拆分成两个分键，并拖动框架的任一边框，将一个框架平均拆分成两个分开的行或列。开的行或列。w 通过菜单拆分框架：通过菜单拆分框架：“框架框架拆分框架拆分框架”命令，出现命令，出现“拆分框架拆分框架”对话框中。对话框中。删除框架删除框架w 选择要删除的框架，单击选择要删除的框架，单击“框架框架删除框架删除框架”命令。命令。FRONTPAGE200248一个框架

57、网页的创建步骤一个框架网页的创建步骤3：15.1.3 设置框架包含的网页设置框架包含的网页框架网页是网页的集合，需设置每个框架对应的网页内容。框架网页是网页的集合，需设置每个框架对应的网页内容。把现有网页分配到框架中：把现有网页分配到框架中：w 在其中某个框架中，单击在其中某个框架中，单击“设置初始网页设置初始网页”按钮，出现按钮，出现“插入超链接插入超链接”对话框对话框w 对话框中设置链接的网页，单击对话框中设置链接的网页，单击“确定确定”按钮，该网页出现在框架内。按钮，该网页出现在框架内。如初始网页还没建立：如初始网页还没建立：w 单击单击“新建网页新建网页”按钮开始建立。按钮开始建立。改

58、变框架中的初始网页：改变框架中的初始网页：w 选择要改变初始网页的框架选择要改变初始网页的框架w “框架属性框架属性”对话框中的对话框中的“初始网页初始网页”文本框中输入新网页的名称和文本框中输入新网页的名称和位置，或者单击位置，或者单击“浏览浏览”按钮，从文件列表中选择。按钮，从文件列表中选择。FRONTPAGE200249一个框架网页的创建步骤一个框架网页的创建步骤4：15.1.4 组织框架间的调用关系组织框架间的调用关系在使用框架时一定会遇到如何处理框架间的调用关系的问题，即点在使用框架时一定会遇到如何处理框架间的调用关系的问题，即点击一个框架中的超链接后，目的页面将会出现在哪一个框架内

59、，或击一个框架中的超链接后，目的页面将会出现在哪一个框架内，或是新打开一个浏览器窗口。是新打开一个浏览器窗口。在在“编辑超链接编辑超链接”窗口的右侧单击窗口的右侧单击“目标框架目标框架”按钮，出现的按钮，出现的“目目标框架标框架”对话框，在这个对话框中，可以直接在对话框，在这个对话框中，可以直接在“当前框架网页当前框架网页”框中选择一个框架作为目的框架，也可以选择框中选择一个框架作为目的框架，也可以选择“公共目标区框公共目标区框”中中的选项来确定目标页面的出现形式：的选项来确定目标页面的出现形式：w 网页默认值（网页默认值（main）：目标页面将出现在默认目的框架中，默认目的框）：目标页面将出

60、现在默认目的框架中，默认目的框架可以在框架的页面属性设置窗口中设置。如果不加以说明，系统将按架可以在框架的页面属性设置窗口中设置。如果不加以说明，系统将按照默认目的框架调用目标页面。照默认目的框架调用目标页面。w 相同框架：目标页面将出现在同一框架中，也就是覆盖调用页面。相同框架：目标页面将出现在同一框架中，也就是覆盖调用页面。w 整页：目标页面将覆盖整个框架页面，独立地出现在浏览器窗口中。整页：目标页面将覆盖整个框架页面，独立地出现在浏览器窗口中。w 新建窗口：目标页面将出现在新打开的一个浏览器窗口中，而在原来的新建窗口：目标页面将出现在新打开的一个浏览器窗口中，而在原来的浏览器窗口中不发生

61、任何变化。浏览器窗口中不发生任何变化。FRONTPAGE200250图15-6“目标框架”对话框FRONTPAGE200251一个框架网页的创建步骤一个框架网页的创建步骤5：15.1.5 保存框架网页保存框架网页若要保存包含内容的框架网页，执行下列操作：若要保存包含内容的框架网页，执行下列操作：w打开要保存的框架网页，单击打开要保存的框架网页，单击“文件文件另存为另存为”菜单菜单命命令令w在在“另存为另存为”对话框中会显示框架网页布局的缩略图，对话框中会显示框架网页布局的缩略图，因为你正在保存框架网页，所以所有的区域都会用深因为你正在保存框架网页，所以所有的区域都会用深蓝色的框突出显示，表明这

62、是正在保存的内容。蓝色的框突出显示，表明这是正在保存的内容。在在“文件名文件名”框中，键入突出显示的框架网页的名称，框中，键入突出显示的框架网页的名称，选择要保存网页的位置，单击选择要保存网页的位置，单击“保存保存”按钮。按钮。FRONTPAGE200252一个框架网页的创建步骤一个框架网页的创建步骤6：15.1.6 保存框架中显示的网页保存框架中显示的网页在框架网页中选择一个要保存的框架，再单击在框架网页中选择一个要保存的框架，再单击“框架框架另存为网页另存为网页”；在在“另存为另存为”对话框中会显示框架网页布局的缩对话框中会显示框架网页布局的缩略图，深蓝色的框指明了突出显示框架中要保存略图

63、，深蓝色的框指明了突出显示框架中要保存的当前网页。键入文件名，选择保存位置后，单的当前网页。键入文件名，选择保存位置后，单击击“保存保存”按钮。按钮。若框架中所显示的网页已经保存过，可单击若框架中所显示的网页已经保存过，可单击“框框架架保存网页保存网页”以原来的名字保存。以原来的名字保存。FRONTPAGE20025315.2 应用表单制作交互式网页应用表单制作交互式网页w普通网页只是让访问者去观看，少了访问者本身的普通网页只是让访问者去观看，少了访问者本身的参与。参与。w交互式网页通过表单来向服务器传送一些用户的交交互式网页通过表单来向服务器传送一些用户的交流信息，服务器通过数据库查询等方法

64、进行处理，流信息，服务器通过数据库查询等方法进行处理，返回用户感兴趣的内容，从而建立了一种与用户的返回用户感兴趣的内容，从而建立了一种与用户的交流。论坛、留言板就是采用的这种形式，这将会交流。论坛、留言板就是采用的这种形式，这将会更加吸引访问者。更加吸引访问者。w表单的作用就是搜集用户输入的信息，如收集客户表单的作用就是搜集用户输入的信息，如收集客户的个人资料，并输入到数据库中，或设计一个订货的个人资料，并输入到数据库中，或设计一个订货单，让用户指定自己要购买的商品名称、型号和数单，让用户指定自己要购买的商品名称、型号和数量等。量等。FRONTPAGE20025415.2 应用表单制作交互式网

65、页应用表单制作交互式网页15.2.1 表单域的类型表单域的类型表单域指表单上用以收集信息的单个域。每一类型的域都有不表单域指表单上用以收集信息的单个域。每一类型的域都有不同的操作方式，因此用户必须根据站点访问者输入信息的方同的操作方式，因此用户必须根据站点访问者输入信息的方式选择表单域。一个表单中可以具有如下表单域：式选择表单域。一个表单中可以具有如下表单域：文本框：用于让访问者输入一行文字。文本框：用于让访问者输入一行文字。选项按钮：也称为单选按钮，浏览者只能从一组选项中选择一个选选项按钮：也称为单选按钮，浏览者只能从一组选项中选择一个选项。项。文本区：收集多行的文本，例如注释。它可以滚动以

66、容纳不同数量文本区：收集多行的文本，例如注释。它可以滚动以容纳不同数量的文本。的文本。下拉框：为网页浏览者提供一个选择列表。它与使用一组选项按钮下拉框：为网页浏览者提供一个选择列表。它与使用一组选项按钮类似，但其所占用的表单空间较小。可以将下拉框设置为允许一个类似，但其所占用的表单空间较小。可以将下拉框设置为允许一个或多个选项。或多个选项。复选框：网页浏览者可以从一组选项中选择一个、多个或全部选项，复选框：网页浏览者可以从一组选项中选择一个、多个或全部选项，也可一个都不选。也可一个都不选。FRONTPAGE200255按钮：使用按钮可以让网页浏览者在填好表单后提交该表单、重置按钮：使用按钮可以让网页浏览者在填好表单后提交该表单、重置表单或运行自定义脚本。你也可以在表单中添加图片，用作提交按表单或运行自定义脚本。你也可以在表单中添加图片，用作提交按钮。填写表单之后，网页浏览者可以单击图片以提交该表单，然后钮。填写表单之后，网页浏览者可以单击图片以提交该表单，然后表单上的数据，包括图片域名称，就会发送到表单处理程序。表单上的数据，包括图片域名称，就会发送到表单处理程序。高级按钮：通过在表单