PowerPoint 演示文稿

Download Report

Transcript PowerPoint 演示文稿

第七章
网络多媒体应用设计
返回
学习目标

掌握HTML语言(超文本标记语言)的基本知
识,如标签、文件结构、超链接等,能够利用所
学知识制作简单页面;学会对Web页面的复杂处
理,如使用图象、表和表格。

学会使用FrontPage 2000设计站点和网页;
学会图片工具栏中工具按钮的使用;掌握
FrontPage2000发布方法;掌握制作特殊效果的网
页如创建网页间的过渡效果,在网页中插入视频、
插入Java程序、ActiveX控件等高级元件。
目录
7.1
Web 站点设计基本知识
7.2
HTML 语言
7.3
FrontPage 2000
返回
7.1
Web 站点设计基本知识
1. 什么是WWW
WWW 是“World Wide Web” 的缩写,中文译
名“万维网”,是一个基于 Internet的全球互连、
分布、动态和跨平台的交互超文本信息系统,它
以“超文本”方式将Internet上的数据连接在一起,
让用户能以非常简单的方式浏览世界各地的信息。
返回
2. 什么是Homepage
WWW 服务主要是以一个个的网页来呈
现,所谓网页也就是我们 在浏览器上看到
的画面,而一般进入站点后所看到的第一
个页面通称为Homepage,即主页。主页通
常用来作为一个站点中的目录或索引。
3. 站点就是网页的集合
站点就是一群相关网页的集合。也
就是说,设计者制作了几个网页,并且
经过组织规划,让网页彼此相连,然后
让连上Internet 的人都能看到,这样的
完整结构就称为“站点”。
4. 站点与URL
URL 英文全称是 Uniform Resource
Locator ,中文名称为“统一资源定位器”,
简单地讲就是网络上的一个站点、网页的
完整地址。URL 实际上就起到站点通信地
址的作用。
7.2 HTML 语言
7.2.1
HTML 的基本知识
7.2.2
装饰HTML 文档的界面
返回
7.2.1
HTML 的基本知识
1. HTML 标签
2. HTML 文件
3. HTML 文件结构
4. HTML 超链接
1. HTML 标签
HTML 语言使用标签来指明文档中的
不同内容。标签是区分文本各个组成部分
的分界符,用来把HTML文档划分成不同的
逻辑部分(或结构),如段落、标题和表格
等。
标签描述了文档的结构,它向浏览器
提供该文档的格式化信息,以传送文档的
外观特征。
大部分HTML 标签形式如下:
〈标签名〉相应内容〈/标签名〉
标签的名字用尖括号〈 〉括起来。
HTML 标签一般有起始标签与结束标
签两种,分别放在它起作用的文档两边。
起始标签与结束标签非常相似,只是结束
标签在“〈”号后面多了一个斜杠“/”。
2. HTML 文件
HTML 文件就是普通的文本文件。可
以使用两种基本方法制作HTML 页面:
一种是用文本编辑器,譬如Windows
操作环境下的Notebook,编辑文本及HTML
命令;
另一种是采用可视化软件,譬如
FrontPage,生成HTML 命令。
下面是一份HTML 文件的内容:
• <HTML>
• <HEAD>
•
<TITLE>例一</TITLE>
• </HEAD>
• <BODY>
•
HTML 文件的第一段正文写在这里... ...
•
HTML 文件的第二段正文写在这里... ...
• </BODY>
• </HTML>
图7.1
HTML 文件显示
以上的HTML文件,经过浏览程序解释
后,显示出来的效果图7.1 所示。
窗口只显示一段文字,而HTML原文件
的其它文字符号都不见了,这些没有显示
出来的文字符号,如<HTML>\<HEAD>等,它
们的主要作用是告诉浏览器,如何适当的
将文件内容格式显示排列。
3. HTML 文件结构
任何一份 HTML 文件,都包含了表头
(Header)、本体(Body)、主题(Title)三个
要素,分别以 <HEAD>、<BODY>和 <TITLE>
标签来表示。同时也是为了HTML文件有别
于其它种类的文件, 另外再加上 <HTML>
标签加以强调。
<HTML>标签:<HTML>和</HTML>标签
置于整个文件的起始及结束处,表示文件
是属HTML 语言格式。其余标签都应该位
于该标签里面。
<HEAD>标签:<HEAD>和</HEAD>标签
标明文件的表头段,主要说明本文内容整
体信息,是文章的开场白。所有在表头段
的内容都不会显现在浏览器窗口的本体段
(Client area)里。
<BODY>标签:<BODY>和</BODY>标签
标明文件的本体区段,位于表头段以下的
地方,即是指经浏览器解读后显示在窗口
本体段(Client area)的内容。
<TITLE>标签:<TITLE>标签标明文件
内容的主题,让读者了解文件的主题。
<TITLE>标签里不允许有其它的标签存在。
4. HTML 超链接
在HTML 中使用anchor 标签<a>来建
立链接,它将文本或图形标识为指向其
它HTML 文档、图形、小程序、多媒体效
果或HTML 文档中特定位置。在链接的语
法中必须包含一个参考属性href 和一个
结束标签</a>,如下所示:
<a href=“URL”>here's a link to another page.</a>
在链接语法中,<a></a>定义一个超
链接,here‘s a link to another Page
是超链接对象。href指定了目标URL,URL
是文档在Web或Internet上的地址,它总
是放在引号中。这个URL可以是一个书签、
网页或者站点。
在链接语法中,不仅可以从网页链
接到网页,而且还可以在一个网页内部链
接。所以在HTML中,将链接分成两部分,
一种是标准链接,另一种是页内链接。
超链结文字可有三种不同的显示形态
出现在文件中,这三种超链结显示形态分
别有:未链结、正在链结和已链结。
每种形态的显示颜色可分别设置,
各自的意义和设置属性如表7.2.1 所示。
表7.2.1
链结形态
定义
设置属性
未链结形态
使用者未曾单击过或链结不成功的形态
LINK
正在链结形态
使用者在单击链结时未放开手的形态
ALINK
已链结形态
使用者已单击链结成功的形态
VLINK
7.2.2 装饰HTML 文档的界面
1. 图像和图像映射
2. 列表
3. 表格
1. 图像和图像映射
图形格式
图形格式可分为两种,一种是点阵
图形;另一种是矢量图形。浏览器普遍
支持的图形格式有GIF 和JPEG。
GIF 文件格式的图形的每个像素数
值只用8个字节来表示。因此一张GIF格
式的图形,最多只能包含256种颜色。
GIF 图形格式有两种,分别是87a
和89a,89a 格式是原有87a的增强格式,
有交织(Interlaced)的特性。
JPEG 格式图形有相当高的压缩率
由于JPEG是矢量图,故图形文件比一般
点阵图形,如GIF要小。
一般我们看到的HTML 文件里的图
形,多数为GIF 格式,这是因为GIF 的
显示速度比较好。如果我们要选择高品
质的显示画面,则可以选择JPEG 格式
的图形。
插入图象
HTML文件中,IMG 元素用来插图象。
属性SRC 的主要用途是指定图形资
源的位置,<img src=“URL”>。
属性ALT 是指定图形对应的文字叙
述,其值为任意一串文字,由编写HTML
文件者来设置。ALT 属性的设立主要针对
非图形界面浏览器使用者。但是,这对图
形界面浏览器也有帮助。每当这些浏览器
关闭显示图形功能后,这一串文字就派上
用场了。
图文版面的排列
(1). 图文的基本排列方式
图文对齐排列由IMG 元素的ALIGN 属
性来设置,图与文的对齐排列原则是以文
字的基线(Baseline)为依据。其中排列的
方式有以下几种:
表7.2.2 图文对齐排列方式
图形顶端位置与文字基线对齐
ALIGN=up
图形中间位置与文字基线对齐
ALIGN=middle
图形底端位置与文字基线对齐
ALIGN=bottom(缺省值)
图形顶端位置与文字最高位置对齐
ALIGN=texttop
图形顶端位置与行文字基线对齐
ALIGN=baseline
(2). 浮动图形
图形与文字除了有以上五种排列方式
之外,也有另外两种排列方式,分别为
ALIGN=left和ALIGN=right。
当ALIGN为right时,文字与图形分开排
列,图形漂到文件的右边界;当ALIGN变为
left时,图形告左排列,并把图形底下的文
字往外挤出去,图形像漂至左边界。
(3). 图形配置控制
宽度设置 图形配置宽度的设置是
由WIDTH属性来完成。
高度设置 图形配置高度的设置是
由HEIGHT属性来实现。
例如:要插入的图形原来的尺寸为
100×90大小。如果我们要显示出
200×180大小的图,可将WIDTH和HEIGHT
两种属性分别设置成200和180,如下所示
<IMG SRC=“www.gif” WIDTH=200 HEIGHT=180>
图形映射
图形映射也称为可单击图形,是指在
一个图形中包含多个链接。单击图形映射
的某个部分即可进入该部分所表示的链接
目前有两种图形映射类型,分别是
服务器方和客户机方。两种图形映射的差
别在于过程(访问者的鼠标单击变成对另一
文档的链接)在哪里发生,发生在服务器方
时为服务器方图形映射,发生在访问者的
计算机上时为客户机方图形映射。
在服务器方图形映射中,受到单击的
点坐标传输到服务器计算机中,由其确定
对这个单击所采取的动作,然后服务器再
将住处发送回客户机上,再由客户机发出
对某个文档的请求。服务器计算机计算和
确定客户机要做的工作。
在客户机方图形映射中。图形映射的
标志及其属性见表7.3。
表7.3 图形映射的标志及其属性
标志/属性
用法
USEMAP="…"
命名要用的客户机方映射定义,是<IMG>标志的属性
ISMAP
指定图形使用服务器方图形映射,是<IMG>标志的属性
<MAP>
在HTML文件中标识映射定义块
NAME="…"
提供映射定义块的名称
<AREA>
定义映射区域
SHAPE="…"
将映射区域的形体表示为RECT、CIRCLE或POLY
HREF="…"
指定映射区域的目标,单击该区链接这个URL
NOHREF
指定单击区时不链接任何地方
COORDS="x,y,x1,y1,x2,y2"
标识区域的形体
ALT="…"
提供描述链接的替换文本(或弹出文本)
2. 列表
HTML 语言提供多种表结构的元素,
根据显示外观的不同可分为两类:
词汇表(Glossary List)和规律性
(Regular List)表。
第二类规律性表又可分为两种:
第一种是有序表;第二种是无序表。
定义表(DL)
定义表属于词汇表,它是由一系列
项目和其定义叙述所组成的。一般定义
表的每个项目都列在左边,而其定义则
列在右边或下一行有缩排的段落。
定义表结构块,是则起始标签<DL>
和结束标签</DL>包围形成的,而每一个
项目则以<DT>项目标签和<DD>定义叙述
标签来表示。
实例:
<DL>
<DT>WWW<DD>WWW是全球住处网(World wide web)的缩写,也有人称
之为3W、W3、Web。由欧洲量子物理实验室所开发出来的一套“分散
式超媒体数据库查询”的系统。
<DT>HyperText<DD>HyperText是超文本。文件通过超文本,可链结
到其它地方的数据文件,取得分散到各地的数据。
</DL>
规律性表
规律性表结构是一组序列段落,以
一个特殊记号、序数或空格为分项符号。
它的一般语法为:
<表列元素起始标签>
<表列项目元素>
<表列项目元素>
...............
...............
<表列元素结束标签>
(1). 无序表
典型的无序表的每一个项目前端,
都用一个实心小圆点作为分项符号。
无序表结构块,是由起始标签<UL>和
结束标签</UL>包围形成的,而每一个
项目是以<LI>项目标签来表示。
浏览器为无序表元素添加了属性
TYPE,它的值分别是表的分项符号样式,
其值共有三种:DISC(实心小圆点)、
CIRCLE(虚心小方块)和SQUARE(实心小
方块),缺省为DISC 。
实例:
<UL>
<LI>理解Internet
<LI>访问WWW
<LI>理解Web发布
</UL>
(2). 有序表
有序表的每个项目都有前后顺序之分
多数用数字来表示。有序表结构块,是由
起始标签<OL>和结束标签</OL>包围形成
的。而每一个项目是以<LI>项目标签来表
示。
浏览器为有序表添加了TYPE和START
属性,TYPE属性可提供更多项目识别符号。
它总共提供了五种不同样式的分项符号,
分别如下所列。缺省值为TYPE=1。
<OL
<OL
<OL
<OL
<OL
TYPE=1>
TYPE=A>
TYPE=a>
TYPE=I>
TYPE=i>
数字,如1,2,3...
大写字母,如A,B,C...
小写字母,如a,b,c...
大写罗马字母,如Ⅰ,Ⅱ,Ⅲ...
小写罗马字母,如i,ii,iii...
START属性可设置表项目的初始值,
其值为分项符号样式列中第几个,
如START=5就表示由‘5’、‘E’、‘e’、‘V’、
‘v’开始。
实例:
<H2>打开Web资源的步骤</H2>
<OL>
<LI>在用户浏览器中,输要访问资源的完整URL。
<LI>浏览器把请示发送到正与之通信的服务器。
<LI>用户服务器把该请求转发一在URL中所规定的服务器。
<LI>那个服务器查找资源并把它发回到用户服务器。
<LI>用户服务器把资源发送到用户浏览器。
</OL>
3. 表格
表格在HTML语言中是以TABLE元素来
表示,其对应的标签为<TABLE>,并以
</TABLE>签来结束表格结构的有效性。
基本表格结构
在基本表格结构中,包含项目表头
(TH元素可表示表格项目的表头)和资料
(TD元素可表示资料),并加上了表格的
标题。表格标题是以标签<CAPTION>表
示,并以</CAPTION>结束。表格标题、
项目表头和资料构成了表格基本结构三
个要素。<TR>元素是表示表格的行。
实例:
<table border><caption>Internet应用形态比较</caption>
<tr><th>应用类型\年度</th><th>1993年</th><th>1994年</th>
<th>1995年</th></tr>
<tr><th>当月传输量<br>(Giga Byte)</th><td>5,159</td>
<td>10,294</td><td>19,119</td></tr>
<tr><th>FTP</th><td>2,412</td><td>4,243</td><td>5,784</td></tr>
<tr><th>WWW</th><td>0.122</td><td>269</td><td>3,382<td></tr>
</table>
设置表格
设置有框线表格:
<table border>...</table>
或<table border=1>...</table>
设置无框线表格:
<table>...</table>
或<table border=0>...</table>
设置表格的大小:
<table width=n1 height=n2>
设置表格行数:TR元素表示表格的行
一份表格的行数由<TR>标签个数来决定。
设置表格列数:表格列数由一行中所
包括的TH和TD元素个数来决定。
实际应用
使用内含图象元素IMG、表元素TABLE
制作出一页简单的Homepage。此Homepage
中的表格共分成三个块,Homepage的显示
效果如下图所示。
<html><head><title>动物园简介</title>
<meta name="GENERATOR" content="Microsoft FrontPage 3.0">
</head>
<body><table border="1" width="732">
<tr><td width="229"><ul>
<li><a href="index.htm">动物园简介</a></li>
<li><a href="fingerpost.htm">游园指南</a></li>
<li><a href="story.htm">动物园里的故事</a></li>
<li><a href="friends.htm">动物大使</a></li>
</ul></td>
<td width="265"><img src="dsh02.gif" width="261" height="167"
alt="dsh02.gif (16135 bytes)"></td>
<td width="306"><center><b>独角犀</b></center><br>
独角犀是
亚洲犀牛中最大的一种,主要在尼泊尔及邻近地区、现在数量已很少,是
世界濒危物种,世界上只有少数国家展出。<br>
雌性独角犀现已20岁
,在我园新犀牛馆展出</td>
</tr></table></body></html>
7.3
FrontPage 2000
7.3.1 开始使用FrontPage2000
7.3.2 用FrontPage2000设计站点网页
7.3.3 在FrontPage2000中使用图形
7.3.4 使用FrontPage2000制作特殊效果的网页
7.3.5 发布FrontPage2000
返回
7.3.1
开始使用FrontPage 2000
1. 熟悉FrontPage 2000
FrontPage 首先是一个编辑工具,它
可以编辑Internet上以HTML格式保存的所
有文件,并可以利用Image Composer 和
Microsoft GIF Animator编辑处理图像和
动画,此外还可以在网页中插入各种插件,
包括:Java,ActiveX,JavaScript,产生
各种特殊效果。FrontPage 2000 对动态
HTML 的支持更加完善,无需任何插件,
就可以产生各种动画效果。
FrontPage 2000 是一个管理站点的
工具,可以利用不同的方式查看各个网页
之间的关系,调整站点的组织结构,使整
个站点的条理清晰。
FrontPage 2000 还是一个Internet
出版工具,利用它提供的网络发布工具,
可以轻松完成站点的发布上传过程。
2. 第一次运行
如果FrontPage 2000安装完毕,可以
按下列步骤启动:
(1) 单击“开始”按钮,在“开始”菜单
中单击“程序”。
(2) 在“程序”菜单中单击Microsoft
FrontPage。
(3) 打开的FrontPage 2000图形化用
户界面。
FrontPage 2000的用户界面有六种不
同的形式,由所选择的视图方式而定。
“网页”视图--FrontPage 2000中最常用的
工作界面,如下图所示。
网页的创建、编辑、预览等基本操作都是
在此视图中进行的。该视图窗口底部有三个标
签:“普通”、“HTML”和“预览”,它们分别控制网
页以普通方式、HTML方式进行编辑或是预览网页
的效果。
“文件夹”视图--在“文件夹”视图中,站点
显示为一组文件和文件夹,如下图所示。
“文件夹”视图对于站点的作用与Windows
资源管理器对存储在硬盘上的文件的作用和操
作基本相同。在“文件夹”视图中可以通过拖拽
操作移动文件或文件夹。
“报表”视图--使用“报表”视图可以方便了解
当前站点的文件内容、更新链接情况组件错误、
所有文件列表及变化情况等信息。
当需要得到有关站点文件的详细情况时请
使用“报表”视图。下图显示了“报表”视图中的
“站点总览”报表,若要显示其他内容可在“报表
”工具栏中的“报表”下拉列表中选择所需的报表。
“导航”视图--使用“导航”视图可方便地观察
站点的链接结构。如下图所示,主页位于顶部,
其他的网页归入下面各层中。
在该视图中可以很直观地浏览网站内网页之
间的链接关系,同时也可以通过鼠标将结构图中
的网页拖到新位置来改变链接结构。
“超链接”视图--“超链接”视图将当前站点
显示为链接文件的一个网络,它们表示了站点中
各个网页之间的相互链接关系(见下图)。
“超链接”视图就像一个地图,表明站点中
的超链接路径。显示来自和指向着眼点点中的
每一页的超链接。
“任务”视图--“任务”视图主要用来创建和
管理任务。
在视图中列出了当前站点中的“任务”,即
当前站点中尚未完成的项目。
3.使用模板迅速创建网站
启动FrontPage 2000
之后,就可以在其中建立
一个新站点,或者打开一
个存在的站点。如果要建
立一个新站点,在“文件”
菜单的“新建”子菜单中选
择“站点”命令,打开
“新建”对话框,如右图所
示。
对话框中提供了8种建立新站点的
方法,如下图所示 :
4. 在站点中应用主题
作为一个站点发布者,一个最重要的
任务就是制作站点的图形外观。它由以下
几方面决定。当然也还包括其他因素:
 文本和超链接的颜色
• 背景图形的颜色
• 应用的字体
• 图形和导航栏
在FrontPage 2000中,在“格式”菜单
选择“主题”,即可对主题进行选择。在主
题对话框中,可以在应用主题之前对主题
效果进行预览,如下图。
7.3.2 用FrontPage2000 设计站点
1. 创建站点网页
2. 在网页中添加共享边框
3. 为网页选择背景
4. 在网页中添加文本
5. 更改文本的字体和颜色
6. 创建项目符号和编号
7. 创建表格
1. 创建站点网页
在编辑网页之前,先要转换到
FrontPage 2000的网页视图模式下。
FrontPage 2000的每一个站点网页都是以
模板开始。如果想从零开始,可以选择普
通网页模板。单击“文件”、“新建”、“网页
或是常用工具栏中的新建网页按钮,就可
以建立一个新网页。
当模板选择完毕,网页会立即出现在
网页视图中,这时就可以对其进行编辑。
如果站点中没有应用主题,新网页将完全
是空白的。
2. 在网页中添加共享边框
在FrontPage 2000中,可以创建站点
中所有网页通用的边框区域。单击“格式”、
“共享边框”,就可以看到目前正在使用什
么边框。 如下图所示。
3. 为网页选择背景
选择背景是装饰站点的一个好办法。
背景可以是某种颜色,也可以是图形。选
择“格式”,“背景”弹出网页属性对话框,
选择“背景”选项卡,如下图所示。
4. 在网页中添加文本
打开FrontPage 2000的网页视图,并
在其中键入文本。无论是共享边框还是网
页主体,文字都会出现在光标所在位置。
共享边框在网页中以点划线指明,但是在
浏览器中这些线将不会出现。
在输入文字时,若一行长度超过屏幕
的显示范围,FrontPage会自动换行。若要
输入的是一篇很长的文章,就需要对文章
做适当的段落排列以增加页面的可读性。
在我们输入文字内容时,单击“Enter”键即
可区分段落。
5. 更改文本的字体和颜色
在一个应用了主题的网
页中添加文本,文本会自动套
用主题中正文的字体和颜色。
如果没有应用主题,那么文本
将会使用浏览器加载网页时使
用的默认字体和颜色。如果需
要更改文本的字体和颜色,可
以选中文本,选择单击“格式”
“字体”打开字体对话框。如右
图所示。在这里可以选择新的
字体和颜色。
6. 创建项目符号和编号
网页中的文本一般以段落为单位显示,
并且段落之间没有标志和换行符。另一种
组织网页文本的方式是将其转换为列表,列
表是相关的项目群,每个项目可以是一段
文本或是文本与其他网页元素的结合。网页
中可以显示以下两种列表:
1. 编号,每个项目前都有一个单独的号码
项目符号,项目前为一个符号
单击“项目符号”按钮或者“编号”按钮就
可以将文本转为列表。
7. 创建表格
在FrontPage 2000中创建表格有3种
方法。
(1)使用按钮插入表格
(2)使用菜单命令插入表格
(3)手动绘制表格
表格可以控制网页信息的排列。可以
将网页的不同元素甚至是另一表格放在表
格中,这样创建起来的网页布局可以在任
何浏览览器、显示器和电脑中表现出相同
的外观。
7.3.3
在FrontPage2000 中使用图形
1. 导入图片
只有文字的网页会显得单调,达不到
所需的感官效果。因此在制作网页时,都
要在页面加上适当的图片。
(1)导入当前站点中的图片
(2)导入剪贴画库中的图片
(3)在计算机中选择图片文件
(4)使用Web浏览器来选择网页和文件
(1). 导入当前站点中的图片
如果要插入的图片已经存在于当前的站点
中,可以在当前站点中直接导入图片。
1).将插入点设置在要插入图片的位置。
2).从“插入”菜单的“图片”子菜单中选择
“来自文件”命令。
3).出现“图片”对话框,当前站点中的所有
图片都会显示在文件列表中,如下图所示,选择
所需的图片文件。
(2). 导入剪贴画库中的图片
1)将插入点设置在要插入图片的位置。
2)从“插入”菜单的“图片”子菜单中选择
“剪贴画”命令。
3)出现“剪贴画库”对话框,选中“图片”
选项卡,再选择所需的图片类别,例如选择
“工作人员”类别,如下图所示。
4)显示出“办公室”类别中的所有图片,
单击要导入的图片,在出现的菜单中选择
“插入剪辑”按钮。
(3). 在计算机中选择图片文件
1)将插入点设置在要插入图片的位置。
2)从“插入”菜单的“图片”子菜单中选择
“来自文件”命令。
3)出现“图片”对话框,单击“从计算机上
选择一个文件”按钮。
4)出现“选择文件”对话框,在“搜索”框中
选择图片所在的文件夹,如下图所示。
5)在文件列表中选择所需的图片文件。
6)单击“确定”按钮。选择的图片出现在
插入点位置。
(4). 使用Web浏览器来选择网页和文件
在Internet上有许多专门搜集图片的站点
可以直接连接到这些站点去寻找图片。
1)从“插入”菜单的“图片”子菜单中选择
“来自文件”命令。
2)出现“图片”对话框,单击“使用Web浏览
器来选择网页或文件”按钮。
3)打开FrontPage 2000预设的浏览器,
通常是Internet Explorer和Netscape。在浏览
器中,用鼠标将网页上的图片直接拖拽到所需
位置即可。
在选定的图片上单击鼠标右键,在快捷菜
单中选择“图片属性”命令,在“图片属性”对话
框给图片添加超链接和替代文本。
2. 编辑图片
调整图片大小
在要调整的图片上单击
一下鼠标选定图片,用鼠标按
住图片四周的任一控点进行拖
拽,到达适当大小后,放开鼠
标即可。
也可在选定的图片上单
击鼠标右键,在快捷菜单中选
择“图片属性”命令,选中
“外观”选项卡,在“大小”区域
中调整图片的大小参数。
移动图片的位置
先选定图片,再将图片拖拽到想要放置的
位置,放开鼠标即可。在FrontPage 2000 中的
图片是被看作一般的字体元素,无法自由地放
置在页面上的任一个位置(只能放在文字之间),
所以当页面是完全空白且没有输入任何文字时,
图片就无法进行移动的操作。
3. 使用图片工具栏
选定图片后,在编辑区的下方就会出现
“图片”工具栏,如下图所示。
4. 在网页中加入动态的GIF文件
选定图片后在网页中加入动态的GIF文件就
是一种动态效果,这些GIF文件是由一些软件制作
出来的,其中不仅仅包括图片,还含有关于图片
显示顺序、每幅图片的显示时间、两幅图片之间
的间隔以及循环频率方面的信息。
在FrontPage 2000中,这些文件的扩展名和
其他的GIF文件一致,也是“.gif”,这些文件同样
可以导入,添加到网页中以及重新调整大小。
但在FrontPage 2000中,却不能对其进行编
辑。这是因为,对动态的GIF文件所做的编辑,其
效果会使它还原为单独的图片。
7.3.4
使用FrontPage2000制作特殊效果
1. 创建网页间的过渡效果
在FrontPage 2000 中,最简单的特
殊效果之一就是在网页间加入过渡效果,
选择“格式”、“网页过渡”就可以添加或删
除网页中的过渡效果。
可以在下列四种情况中加入过渡效
果:进入网页、离开网页、进入站点、
离开站点。
2. 在网页中插入视频
插入视频
若要在网页中插入视频,按下列步骤操作。
1)将插入点设置在要插入视频的位置。
2)从“插入”菜单的“图片”子菜单中选择“视频”命
3)出现“视频”对话框,若对话框中没有视频文件,
可单击 “从计算机上选择一个文件”按钮。
4)在“选择文件”对话框中选择所需的视频文件。
5)单击“确定”按钮。
调整视频
用鼠标单击视频图像就会选择该视频图像,
此时视频图像的周围会出现8个控点,使用鼠标
拖动控点可以改变视频图像的大小。
设置视频播放方式
(1)使用鼠标右键单击
视频图像,从快捷菜单中选
择“图片属性”命令。
(2)出现“图片属性”对
话框,选中“视频”选项卡。
(3)“视频源”选项中显
示的是视频文件的名称。
如要插入另外一个视频文件
单击“浏览”按钮,在出现的
“视频”对话框中选择一个视
频文件。若选中“在浏览器
中显示控件”复选框,就会
在浏览器中显示AVI播放控制器。
(4)如果插入的视频文件比较大,选择此项
就可以自己控制视频的播放过程。
(5)在“循环次数”选项栏中可以输入视频文
件重复播放的次数。
(6)如果选中“不限次数”复选框,打开网页
之后视频文件会一直重复播放。
(7)在“循环延迟”选项栏中输入的数值可以
控制两次播放之间的停顿时间,这个值的单位是
毫秒。
(8)“播放”区域中的两个选项控制视频开始
播放的条件,如果希望进入网页时就自动播放视
频文件,需选中“打开文件时”复选框;如果希望
当用鼠标单击视频图像时开始播放,应选中“当
鼠标悬停于其上时”复选框。
3. 制作动态HTML效果
1)选取要制作动态HTML效果的文字。
2)从“格式”菜单中选择“动态HTML效果”命令,显
示“DHTML效果”工具栏。
3)单击“开启”选项栏的下拉箭头,在下拉列表
中选择一个事件,如单击、双击、鼠标悬停
或网页加载。
4)当在“开启”选项中选择“单击”事件后,“应用
选项被激活,单击“应用”选项栏的下拉箭头,
在下拉列表中选择应用效果,如选择可以使
文字有飞出效果的“飞出”选项,如下图所示。
5)当在“应用”选项中选择了效果后,“选择
设置”选项被激活,单击“选择设置”选项栏的下拉
箭头,在下拉列表中选择一种动态效果,如选择
“到左下部”选项,使文字向左下方移动。设置了
DHTML效果的文字显示在蓝色的边框内。单击窗口
底部的“预览”标签,切换到“预览”视图,用鼠标
单击具有DHTML效果的文字,此文字就会向左下方
移动,直到在网页中消失。
如果对文本的动态HTML效果不满意,单击
“DHTML效果”工具栏上的“删除效果”按钮,可以将
DHTML效果删除。
4. 插入高级元件
插入HTML
从“插入”菜单的“高级”子菜单中选择
“HTML”命令,就会出现“HTML标记”对话框,
在对话框中可以直接加入HTML标签,如下
图所示。
插入Java程序
Java是一种程序语言,而Java程序则是利用
Java语言开发出来的一种特殊程序。只要浏览者的
浏览器支持Java程序,就可直接在网页中加入Java
程序并执行。下载Java程序的最佳站点是
Sun Microsystems公司的Java主页,它的URL是:
http://java.sun.com/applesInternet
1)将插入点设置在要插入Java程序的位置。
2)从“插入”菜单的“高级”子菜单中选择
“Java小程序”命令。
3)出现“Java小程序属性”对话框,在
“Java小程序源”文本栏中输入Java程序的名称,
输入时要注意大小写。
4)在“含有Java小程序的URL”
文本栏中输入站点名称。
5) 在“浏览器不支持Java时
显示的消息”文本栏中可
以输入一些文字替代Java
程序。
6)在“布局”区域中可以设置
Java程序在网页中的位置
7)在“大小”区域中可以设置
Java程序的范围大小。
8)单击“确定”按钮,网页中
插入了一个Java程序。
插入ActiveX控件
ActiveX控件是一些具有特定功能的软件,
在网页中加入一些不同功能的ActiveX控件,可
以播放Avi视频文件、显示试算表内容等等。
在FrontPage 2000里面提供了很多现成的
ActiveX控件。如果想知盗更多一些ActiveX控件
的相关功能,可以访问站点
http://activex. microsoft.com
1)将插入点设置在要插入ActiveX控件的位
置。
2)从“插入”菜单的“高级”子菜单中选择
“ActiveX控件”命令。
3)出现“插入ActiveX控件”对话框,在“选择
列表”框中选择所需的ActiveX控件。
4)单击“确定”按钮,ActiveX控件出现在网页中。
5)若要设置此控件关联的文件,用鼠标双击网页
中的控件。
6)出现“选项”对话框,选中“参数”选项卡。
7)在“属性名称”列表中选择“Filename”选项,
然后单击“修改”按钮。
8)出现“编辑对象参数”对话框,在“值”区域中
选择“网页”选项,然后单击“浏览”按钮,在
“选择文件”对话框中选择所需的视频文件。
9)单击“确定”按钮,返回到“选项”对话框,视频
文件的路径及文件名出现在“值”列表中。
10)单击“确定”按钮。单击窗口底部的“预览”标签,
切换到“预览”视图就会看到控件播放的视频效
果。
7.3.5
发布FrontPage 2000
1. 发布站点的条件
当我们精心建立了自己的Web站点后,
就可以向Internet或Intranet上发布自己
的成果,以实现信息共享。不过站点发布
应该具备下面几个条件:
与Internet的连接
网页存放空间
是否支持FrontPage Server Extension
发布软件
2. 发布站点
1)在FrontPage 2000中,打开想要发布的
站点。
2)在“常用”工具栏中单击“发布站点”按钮,
或者从“文件”菜单中选择“发布站点”命令。
3)出现“发布站点”对话框,在“指定发布
站点的位置”文本框中输入要发布站点的位置,
如下图所示。如果没有站点建立提供商,可以
单击“WPP”按钮,启动浏览器并打开微软提供的
一个地址,凡是在这里登记ISP都可以完全支持
FrontPage 2000提供的各种扩展工具 。
4)单击“选项”按钮,可以选择发布所需的
选项,如下图所示,如果是第一次发布这个站点,
可以使用默认选项“只发布更改过的网页”,当下
一次发布同一站点时,将只发送更改过的网页,
这样可以节省上网更新时间。
5)设置好发布地址,单击“发布”按钮,
FrontPage 2000开始检测WWW服务器的状态。
6)FrontPage与服务器连接成功后,就会
出现“要求提供用户名和密码”对话框,要求
输入用户名和密码,这些内容都是你申请站点
时ISP提供给你的信息。
7)设置完毕后,单击“确定”按钮。
本章小结
本章介绍了HTML语言,超文本标记语言HTML
(Hyperlink Text Markup Language)是一种描述
文档结构的语言,使用HTML语言,可以完成比较
简单的网页的制作。
FrontPage 2000是Office 2000家庭的新成
员,它是目前使用最为广泛的所见即所得的网页
制作软件。本章着重介绍了FrontPage 2000的使
用方法,共5小节:FrontPage 概述;编辑网页;
导入及处理图片;制作特殊效果的网页;站点的
管理与网页的发布。