大学IT

Report
第
网
八
页
章
制
作
第八章 网页制作
目 录
上一页
下一页
8.1
8.2
8.3
8.4
8.5
8.6
概述
HTML简介
网页制作
网页布局
创建表单页面
网页的发布
结 束
2015/7/21
计算机文化基础
1
8.1
目 录
8.1.1
8.1.2
8.1.3
8.1.4
8.1.5
概
述
网站
服务器与浏览器
网页
网页制作工具
网页设计的相关计算机语言
上一页
下一页
结 束
2015/7/21
计算机文化基础
2
8.1.1 网站
目 录
上一页
下一页
结 束
2015/7/21
网站是一组相关网页和有关文件的集合,
一般有一个特殊的网页作为浏览的起始点,
称为主页(Homepage),用来引导用户访问
其他网页。
网站中的内容通常包括网页和相关的文
件,一般被存储在同一个目录中,并根据网
站栏目或资源类型进行分类,分别存放在不
同的子目录中。本地网站在制作完成后,不
经过发布是不能被其他浏览者访问的。发布
就是将本地网站的内容传输到连接Internet的
Web服务器上。网站发布后,即获得一个网
站地址。
计算机文化基础
3
8.1.2 服务器与浏览器
网站通常位于Web服务器上,Web服务器又称WWW服务
器、网站服务器或站点服务器。从本质上讲,Web服务器就是
一个软件系统,它通过网络接收HTTP请求,然后提供HTTP响
应给请求者。HTTP响应一般包含一个HTML文件,但也可以包
含文本文件、图像或其他类型的文件。要使一台计算机成为一
台Web服务器,就需要安装专门的服务程序 。
目 录
上一页
下一页
结 束
2015/7/21
要浏览Web页面,必须在本地计算机上安装浏览器软件。
浏览器就是Web客户端,它是一个应用程序,用于与Web服务
器建立连接,并与之进行通信。
浏 览 器 和 服 务 器 之 间 通 过 超 文 本 传 送 协 议 ( HyperText
Transfer Protocol,HTTP)进行通信。
计算机文化基础
4
8.1.3 网页
目 录
上一页
网页一般又称为HTML文件,是一种可
以在WWW上传输,能被浏览器认识和翻
译成页面并显示出来的文件。通常用户看
到的网页大多是以.htm和.html为扩展名的
文件。
下一页
结 束
2015/7/21
计算机文化基础
5
8.1.3 网页
1. 网页内容
一般来说,网页主要由文字、图片、动画、
超链接和特殊组件等元素构成。
2. 静态网页和动态网页
目 录
上一页
下一页
根据网页的生成方式,大致可以分为静态网
页和动态网页两种。
结 束
2015/7/21
计算机文化基础
6
8.1.4 网页制作工具
1. 网页制作三剑客
Dreamweaver、Flash、Fireworks被称为网页制作“三剑客” 。
(1)Dreamweaver是美国著名的软件开发商Macromedia公司
推出的一个所见即所得的可视化网站开发工具,该软件同
时适用于初学者和专业网页设计师。
目 录
上一页
下一页
(2)Fireworks也是由Macromedia公司开发的一种工具,它
以处理网页图片为特长,并可以轻松创造GIF动画。
(3)Flash是当今Internet最流行的动画作品的制作工具,并
成为事实上的交互式矢量动画标准。
结 束
2015/7/21
计算机文化基础
7
8.1.4 网页制作工具
2. Microsoft FrontPage 2003
目 录
上一页
FrontPage 2003是微软公司推出的Microsoft
Office 2003家族的成员之一,与Office的其他组件
高 度 融 合 ,界面友好 ,功能强大 , 易学易用 。
FrontPage 2003的主要功能是设计、制作、管理网
页或站点。
下一页
结 束
2015/7/21
计算机文化基础
8
8.1.5 网页设计的相关计算机语言
1. HTML
HTML是Hypertext Markup Language的缩写,
是 WWW 技 术 的 基 础 , 它 使 用 一 些 约 定 的 标 记
(Tag)对文本进行标注,定义网页的数据格式,
描述Web页中的信息,控制文本的显示。
目 录
上一页
下一页
结 束
2015/7/21
我们把用HTML语言编写的文件称为HTML
文件,把HTML文档称为网页(Web Page)。用
HTML语言编写的网页实际上是一种文本文件,
它以.htm或.html为扩展名。
计算机文化基础
9
8.1.5 网页设计的相关计算机语言
2. XML
目 录
上一页
下一页
结 束
2015/7/21
XML是Extensible Markup Language的缩写,
中文名为可扩展标记语言。其主要用途是在
Internet上传递或处理数据。XML与HTML不是
并列的概念,它可以说是HTML的补丁,以弥补
HTML的不足。比如,在HTML中不允许用户自
定义控制标识符,而在XML中允许用户这样做。
XML文件的扩展名为.xml。
计算机文化基础
10
8.1.5 网页设计的相关计算机语言
3. CSS
目 录
上一页
下一页
结 束
2015/7/21
CSS是Cascading Style Sheets的缩写,中文名
为层叠样式表,主要用来对网页数据进行编排、
格式化、显示、特效等。传统的HTML不能对网
页数据进行随心所欲的格式化,而CSS语言却满
足了这种要求,它对网页的特殊显示、特殊效果
提 供 了 很 大的帮助 。 目前 ,大多数网页都用了
CSS。
计算机文化基础
11
8.1.5 网页设计的相关计算机语言
4. DHTML
目 录
上一页
下一页
结 束
2015/7/21
DHTML是动态的HTML,这种技术要求网
页具备动态功能,如动态交互、动态更新等。事
实上,这是要求我们应该掌握Web中所包含的对
象、对象集,以及对象的属性、方法、事件等,
然后用程序处理这些对象相关的属性、方法,让
事件去完成一定的处理程序,以达到网页的动态
效果。
计算机文化基础
12
8.1.5 网页设计的相关计算机语言
5. 脚本语言
目 录
上一页
下一页
结 束
2015/7/21
脚本(Script)语言是嵌入到HTML代码中的
程序,根据运行的位置不同把它分为客户端脚本和
服务器端脚本。客户端脚本是运行在客户端的程序,
服务器端脚本是运行在服务器端的程序。这里所说
的客户端指的是浏览器,服务器端指的是Web服务
器。
目 前 较 为 流 行 的 脚 本 语 言 有 JavaScript 和
VBScript。
计算机文化基础
13
8.2 HTML简介
HTML文件是一种纯文本文件,我们可以使用
任何文本处理软件(如记事本)来创建或处理
HTML文件。
8.2.1 HTML语言概述
目 录
上一页
8.2.2 常用的HTML标记
下一页
结 束
2015/7/21
计算机文化基础
14
8.2.1 HTML语言概述
HTML语言是由世界性的标准化组织W3C
(World Wide Web Consortium)制定的,通过
浏览http://www.w3.org可以了解到HTML标准的
最新动态。
目 录
上一页
下面介绍HTML文件的基本构成和层次结构。
下一页
结 束
2015/7/21
计算机文化基础
15
8.2.1 HTML语言概述
目 录
上一页
下一页
结 束
2015/7/21
1. HTML文件标记
Internet中的每一个HTML文件都包括文本内容
和HTML标记两部分。其中,HTML标记负责控
制文本显示的外观和版式,并为浏览器指定各种
链接的图像、声音和其他对象的位置。多数
HTML标记的书写格式如下:
<标记名>文本内容</标记名>
标记名写在“< >”内。多数HTML标记同时具有
起始和结束标记,并且成对出现,但也有些
HTML标记没有结束标记。另外,HTML标记不
区分大小写。
计算机文化基础
16
8.2.1 HTML语言概述
某些HTML标记还具有一些属性,这些属性指定
对象的特性,如背景颜色、文本字体及大小、对齐方
式等。属性一般放在“起始标记”中,格式如下:
<标记名 属性1=值1 属性2=值2 …> 文本内容 </标记
名>
目 录
上一页
其中标记名和属性之间用空格分隔。如果标记有
多种属性,属性之间也要用空格分隔。
下一页
结 束
2015/7/21
计算机文化基础
17
8.2.1 HTML语言概述
2. HTML网页的结构
目 录
上一页
下一页
结 束
2015/7/21
现 在 我 们 先 看 一 个 简 单 的 HTML 文 件 , 从 中 体 会 用
HTML语言编写网页时的层次结构。
【例8-1】用HTML语言编写一个简单的网页。
<html>
<head>
<title>我的第一个Web页</title>
</head>
<body>
<h1>欢迎进入HTML世界!</h1>
<p>这里我们首先介绍HTML语言的基本知识和语法。
然后,讲授如何使用HTML语言编写您的Web页面。
</p>
</body>
</html>
计算机文化基础
18
8.2.1 HTML语言概述
将上述代码用文本编辑器编辑并保存为一个
扩展名为.htm的文件,双击该文件图标,在浏览
器中看到如下图所示的结果。
目 录
上一页
下一页
结 束
图9-1
2015/7/21
计算机文化基础
19
8.2.1 HTML语言概述
目 录
上一页
下一页
结 束
2015/7/21
从 上 例 可 以 看 出 , 一 般 HTML 文 件 都 是 以
<html>开头,以</html>结束。其文件结构由以下
两部分组成:
1)头部(Head)
HTML文件的头部由<head>和</head>标记定
义。通常情况下,文件的标题、语言字符集信息
等都放在头部信息中。最常用到的标记是
<title>…</title>,它用于定义网页文件的标题,
当该网页文件被打开后,网页文件的标题将出现
在浏览器的标题栏中。
计算机文化基础
20
8.2.1 HTML语言概述
目 录
上一页
下一页
结 束
2)正文主体(Body)
正文主体是HTML文件的核心内容,由<body>和
</body>标记定义。<body>标记具有一些常用的属性,
格式如下:
<body bgcolor=#n color=#n>…</body>
其中,bgcolor为背景颜色,color为文本颜色。n为六
位十六进制数。
如果网页使用背景图像,格式如下:
<body background="路径/图片文件名">…</body>
HTML对格式的要求并不严格,当HTML文件被
浏览器扫描时,所有包含在文件中的空格、回车等均
被忽略。因此你可以将一行写成两行或多行,在浏览
器中结果是相同的。
返 回
2015/7/21
计算机文化基础
21
8.2.2 常用的HTML标记
1. 文本布局
目 录
上一页
下一页
结 束
2015/7/21
1)段落标记<p>
<p>…</p>标记指定文档中一个独立的段落。通过设置
align属性,控制段落的对齐方式,其值可以是left、
center、right、justify,分别表示左对齐、居中、右对
齐和两端对齐,默认值为左对齐。
使用格式如下:
<p align=对齐方式> … </p>
2)换行标记<br>
<br>标记可以强制文本换行。该标记只有起始标记。
3)水平线标记<hr>
水平线标记<hr>用于在网页中插入一条水平线。
计算机文化基础
22
2. 文字格式
目 录
上一页
下一页
HTML语言中用于文字格式化的标记有:
1)标题标记<hn>
格式为:<hn 属性=属性值> 标题文字内容 </hn>
其中n说明大小级别,取值范围为1到6的数字。把
标题分为 6级,即h1~h6,其中h1文字最大,h6文
字最小。
结 束
2015/7/21
计算机文化基础
23
2)字体标记<font>
目 录
上一页
下一页
结 束
2015/7/21
字体标记用来对文字格式进行设置,主要具有以下属性:
(1)size属性:控制文字的大小,格式如下:
<font size=n>…</font>
其中n的取值范围为1~7的数字,默认值为3。
<font>标记和<hn>标记都可以控制文字的大小。一般情况下,
文章的标题最好由<hn>标记控制,而其余的文字由<font>标
记控制。相比较而言,<font>对字体的控制更加灵活。
(2)color属性:控制文字的颜色,格式如下:
<font color=#n或英文表示的颜色>…</font>
其中n是一个十六进制的六位数。
(3)face属性:指明文字使用的字体,格式如下:
<font face=字体名>…</font>
其中字体名的选择由Windows操作系统安装的字体决定。如:
宋体、楷体_GB2312、Times New Roman、Arial等。
计算机文化基础
24
3)字形标记
字形标记用于设置文字的粗体、斜体、
下划线、上标、下标等,如表所示:
目 录
上一页
下一页
标记格式
字形
<b>…</b>
粗体
<i>…</i>
斜体
<u>…</u>
下划线
<sup>…</sup>
上标
<sub>…</sub>
下标
结 束
2015/7/21
计算机文化基础
25
3. 图片
目 录
上一页
下一页
结 束
2015/7/21
<img>标记将图片插入网页中,用于设置图片的大小以及
相邻文字的排列方式。该标记具有以下属性:
(1)src属性:指明图片文件所在的位置。格式如下:
<img src =URL>
其中URL指图片文件存放的位置。
(2)alt属性:图片的文字说明,当鼠标指针指向图片时,
该图片的说明性文字弹出。格式如下:
<img src =URL alt =说明文字>
(3)width和height属性:设置图片显示区域的宽度和高度。
格式如下:
<img src =URL width =n1 height =n2>
其中width和height属性的取值n1和n2,可以是像素数或百
分比。
计算机文化基础
26
(4)border属性:设置图片文件的边框。格式
如下:
<img src =URL border =n>
其中n为像素数。
目 录
上一页
下一页
(5)align属性:设置图片相对于文本的位置关
系。格式为:<img src =URL align =对齐方式>
对齐方式可以是:top(顶端对齐)、middle
(相对垂直居中)、bottom(相对底边对齐)、
left(左对齐)、right(右对齐)、texttop(文
本上方)等。
结 束
2015/7/21
计算机文化基础
27
4. 超链接
目 录
上一页
下一页
结 束
2015/7/21
在HTML语言中,<a>和</a>标记用于设置网页中
的超链接,href属性指明被超链接的文件地址。格
式如下:
<a href=URL>超链接文本</a>
用于表示超链接的文本一般显示为蓝色并且加下
划线。在浏览器中,当鼠标指针指向该文本时,箭
头变为手形,并在浏览器的状态栏中显示该超链接
的地址。
若使用图片做超链接,可使用如下格式完成:
<a href=URL1><img src=URL2></a>
计算机文化基础
28
5. 表格
目 录
上一页
下一页
结 束
在网页中插入一个表格,需要用到一组
HTML标记。定义表格的有关标记如下:
<table> … </table> 定义表格区域。
<caption> … </caption>定义表格标题。
<th> … </th>
定义表格头。
<tr> … </tr>
定义表格行。
<td> … </td>
定义表格单元格。
返 回
2015/7/21
计算机文化基础
29
表格属性
目 录
上一页
下一页
结 束
2015/7/21
常用的标记属性中,border属性用
于设置表格边框的宽度;width、height
属性用于设置表格或单元格的宽度、高
度;cellspacing和cellpadding属性分别用
于设置单元格之间的间隙和单元格内部
空白;align属性用于设置表格或单元格
的对齐方式;bgcolor和background属性
分别用于设置表格的背景颜色和背景图
像。
计算机文化基础
30
8.3 网 页 制 作
目 录
8.3.1
8.3.2
8.3.3
8.3.4
8.3.5
FrontPage 2003概述
创建站点
网页编辑
插入对象
创建超链接
上一页
下一页
结 束
2015/7/21
计算机文化基础
31
8.3.1 FrontPage 2003概述
FrontPage 2003可以按下列方法启动:单
击“开始”按钮,在“开始”菜单中指向“程
序 ” → “ Microsoft Office”→“Microsoft Office
FrontPage 2003”;通过创建FrontPage 2003的快
捷方式启动。
目 录
上一页
下一页
FrontPage 2003的退出可以使用以下几种方
式:选取“文件”菜单中的“退出”;单击窗口
右上角的“关闭”按钮;按快捷键Alt+F4等。
结 束
2015/7/21
计算机文化基础
32
8.3.1 FrontPage 2003概述
启动FrontPage 2003后,可以看到以下几种视图,用户可以在不同
的视图中进行相应的操作。
1. 网页视图
网页视图是FrontPage 2003中最常用的工作界面,网页的创建、编辑、
预览等基本操作都是在此视图中进行的。
FrontPage 2003提供了四种网页视图模式,即设计、拆分、代码、预
览。
2. 文件夹视图
文件夹视图用于管理文件和文件夹,使用它可以直接处理文件和文
目 录
件夹以及组织网站内容。在此视图中,可以创建、删除、复制和移动文
上一页
件夹,具体操作与在Windows资源管理器中类似。
下一页 3. 远程网站视图
远程网站视图用于站点和站点内文件的发布。在远程网站视图中查
结 束
看文件时,文件将用图标和描述性文字进行标记以表示发布状态 。
2015/7/21
计算机文化基础
33
8.3.1 FrontPage 2003概述
目 录
上一页
下一页
结 束
4. 报表视图
报表视图用于查看站点的各种情况,如文件内容、更新链接、
文件列表及变化情况等。
5. 导航视图
利用导航视图可以清晰地看到当前站点的主页和其他网页的
链接关系,也可以设置站点的导航结构或添加、删除网页。
6. 超链接视图
超链接视图将当前站点显示为链接文件的一个网络,它们表
示了站点中各个网页之间的相互链接关系。利用超链接视图可
以管理站点中各个网页的超链接。
7. 任务视图
任务视图主要用于创建和管理任务。任务视图以列格式显示
网站中的所有任务,并在各个标题下提供有关各项任务的当前
信息。
2015/7/21
计算机文化基础
34
8.3.2 创建站点
目 录
上一页
下一页
结 束
2015/7/21
使用FrontPage 2003的模板和向导,用户可以轻松地创
建出各种用途和风格的站点。
新建站点时,可以根据自己的需求选择不同的模板和
向导。对于不同的模板和向导,其新建站点的步骤略有
不同。
下面以“由一个网页组成的网站”模板为例,介绍新
建站点的方法。
(1)单击“文件”菜单的“新建”命令,在“新建”任
务窗格中选择“新建网站”中的“由一个网页组成的网
站”;
(2)在弹出的“网站模板”对话框的“指定新网站的位
置”框中输入新站点要保存的位置,也可使用“浏览”
按钮指定新站点的位置;
计算机文化基础
35
(3)单击 “确定”按钮,新建站点如下图所
示
目 录
上一页
下一页
结 束
返 回
2015/7/21
该站点只有一个空白网页index.htm(主页)和用
于存储图片的文件夹images,你可以打开
index.htm进行编辑,也可以进一步根据网站规划
创建文件夹和新建其他网页。
选择“文件”菜单的“退出”命令,可以关闭
FrontPage 2003。
计算机文化基础
36
8.3.3 网页编辑
目 录
上一页
下一页
结 束
返 回
2015/7/21
1. 新建网页
要根据“网页模板”创建一个新的网页,可以按下
面的步骤:
(1)单击“文件”菜单的“新建”命令,在“新建”
任务窗格中选择“新建网页”中的“其他网页模板”。
(2)在弹出的“网页模板”对话框中选择所需的网
页模板,可以在“说明”及“预览”区域查看该模板
的说明及预览图。
(3)单击“确定”按钮,系统新建一个基于所选模
板的网页。
(4)单击“文件”菜单,选择“保存”命令,弹出
“另存为”对话框。在此对话框中,输入文件名进行
保存。
计算机文化基础
37
8.3.3 网页编辑
目 录
上一页
下一页
结 束
2. 打开/保存网页
FrontPage 2003中,编辑某个网页之前,需要先
打开该网页。打开网页的方法有多种,常用的有以
下几种:
(1)使用“文件”菜单的“打开”命令,或“常
用”工具栏的“打开”按钮,在弹出的“打开文件”
对话框中选择相应的网页;
(2)如需要打开的文件已在打开的网站中,在文
件夹视图中双击该网页图标即可将其打开。实际上,
在其他视图中双击网页图标,同样会打开指定网页。
要保存一个网页,可以使用“文件”菜单的“保
存”命令,或“常用”工具栏的“保存”按钮,如
需另存可使用“文件”菜单的“另存为”命令。
返 回
2015/7/21
计算机文化基础
38
8.3.3 网页编辑
3. 预览网页
目 录
网页制作过程中,用户可以切换到“预览”视图预
览网页,也可以使用“文件”菜单的“在浏览器中预
览”命令预览网页。使用后者,系统会打开浏览器显
示网页,如果该网页尚未保存,会弹出对话框提示用
户保存网页。
上一页
下一页
结 束
返 回
2015/7/21
计算机文化基础
39
8.3.3 网页编辑
4. 设置文字格式
同其他Microsoft Office组件一样,在网页中可以输入文字,
复制、剪切和粘贴文字,设置文字格式,查找和替换文字等。
在FrontPage 2003中,对文字的格式提供了相当完整的设定
功能,文字格式的变化也因此多种多样。可以使用工具栏上的工
具按钮或菜单命令快速地改变文字的外观。
目 录
上一页
下一页
结 束
设置文字格式的一般操作步骤是:选中文字,单击“格式”
菜单的“字体”命令,在弹出的“字体”对话框中设置字体的各
种属性,也可以使用“格式”工具栏中相应的命令按钮。
虽然可以设置各种美观的字体,但是由于用户只能使用本地
计算机中安装的字体显示网页,因此还是使用常见的字体为好。
返 回
2015/7/21
计算机文化基础
40
8.3.3 网页编辑
目 录
上一页
下一页
结 束
返 回
5. 设置段落格式
文字段落的格式编排对于一个网页的外观是至关重
要的。FrontPage 2003通过按Enter键划分段落。值得
注意的是,段落之间插入了一个空行。如果只是需要换
行,而不是另起一个段落,按Shift+Enter键即可。实际
上,按Enter键在HTML代码中插入的是<p>标记,而
按Shift+Enter键则插入的是<br>标记。
段落格式主要包括对齐方式、缩进和段落间距等。
设置段落格式的一般方法如下:
将插入点移动到要设置格式的段落中,或是选中该
段落,单击“格式”菜单的“段落”命令,在弹出的
“段落”对话框中进行各种段落格式属性的设置。
2015/7/21
计算机文化基础
41
8.3.3 网页编辑
6. 设置网页属性
目 录
网页属性包括网页的标题、格式、页边距等。要
设置网页属性,用户可以使用“文件”菜单的“属性”
命令,或者在网页的任意地方单击鼠标右键,在弹出
的 右 键 菜 单 中 选 择 “ 网 页 属 性 ” 命 令 , FrontPage
2003将显示“网页属性”对话框。
上一页
下一页
结 束
2015/7/21
计算机文化基础
42
6. 设置网页属性
1)“常规”属性
目 录
上一页
下一页
结 束
要设置网页的“常规”属性,单击“网页属性”
对话框的“常规”选项卡。“标题”框用于给出网页
的标题,网页标题将显示在浏览器的标题栏中。“背
景音乐”框用于指定网页的背景音乐,当用浏览器打
开网页时,将自动播放背景音乐 。背景音乐区域的
“位置”框用于指定声音文件的位置,用户可以使用
“浏览”按钮选择一个声音文件;“循环次数”框用
于指定声音要反复播放的次数,如果选中“不限次数”
复选框,表示一直不停地播放。
2015/7/21
计算机文化基础
43
6. 设置网页属性
2)“格式”属性
要设置网页的背景、颜色,可以使用“网页属性”对
话框的“格式”选项卡。
目 录
上一页
下一页
结 束
用户可以选中“背景图片”复选框,指定一个图片
作为网页的背景图片。如果要将图片按水印形式添加,
需要选中“使其成为水印”复选框。通过单击相应的
下拉列表框,可以设置网页的背景颜色、文本颜色以
及超链接文字的颜色。当同时设置背景图片和背景颜
色时,背景图片将覆盖背景色。
返 回
2015/7/21
计算机文化基础
44
8.3.4 插入对象
1.插入水平线
在网页中输入文本内容后,还可在不同的段落、
行之间添加水平线,水平线将网页分割成几个部分,
使得网页更具条理性。具体操作步骤如下:
(1)在准备插入水平线的位置设置插入点;
(2)单击“插入”菜单的“水平线”命令,插入水
平线。
目 录
要 修 改水 平 线 的外 观 , 可以 双 击 水平 线 , 打开
上一页
“水平线属性”对话框。“宽度”框用于设置水平线
的宽度,“高度”框用于设置水平线的高度,“对齐
下一页
方式”用于设置水平线在网页内水平对齐的方式,
结 束
“颜色”列表框用于设置水平线的颜色,选中“实线
返 回
(无阴影)”复选框时,水平线将被设成实心线。要
计算机文化基础
2015/7/21为线条指定自定义样式或其他格式,可以使用“样式”
45
8.3.4 插入对象
2. 插入图片
图片可以使网页变得生动活泼,并能吸引用户的注意。
1)图片文件的格式
在WWW上常用的图像文件格式是JPEG和GIF,它们都是压缩
的图像格式,文件的信息量小,适合于网络传输,因此被广泛
地应用在Web站点的设计中。
目 录
上一页
下一页
结 束
GIF(Graphical Interchange Format,图形交换格式)采用无损
压缩方式,其主要特征是支持动画、透明度、图形渐进,但GIF
图像包含的颜色不能超过256种。
JPEG(Joint Photograph Expert Group,联合图像专家组)格
式是专为有几百万种颜色的照片和图形设计的,它采用有损压
缩方式,以牺牲图片质量换取大的压缩比例。JPEG格式支持真
彩色(24位色),并且在压缩大的图像方面已被证明很有效。
2015/7/21
计算机文化基础
46
2. 插入图片
2)插入图片和设置图片属性(方法同Word)
3)编辑图片
利用“图片”工具栏能够完成一些常用的图像编
辑功能。
4)保存图片
目 录
上一页
下一页
插入图片后保存网页,如果图片不在网站文件
夹中,将出现“保存嵌入式文件”对话框。如果图
片在网站文件夹中,就不会出现此对话框。
结 束
2015/7/21
计算机文化基础
47
8.3.4 插入对象
目 录
上一页
下一页
结 束
2015/7/21
3. 插入字幕
在制作网页时,可以将网页中的文字做成由左至右,
或由右至左移动的动态效果,使网页更加形象生动。
具体操作步骤如下:
(1)将插入点设置在要插入移动字幕的位置或者
选中作为移动字幕的文本,单击“插入”菜单的
“Web组件”命令,弹出“插入Web组件”对话框,
在对话框的“组件类型”列表框中选择“动态效果”,
在“选择一种效果”列表中选择“字幕”,单击“完
成”按钮, 打开“字幕属性”对话框。
计算机文化基础
48
3. 插入字幕
(2)如果已经选择了作为移动字幕的文本,此文本就会出现在
“文本”框中,如果没有选择文本,可在“文本”框中输入作为
移动字幕的文本。
下一页
(3)“方向”区域用于指定文本的移动方向。“速度”区域用
于指定文字的滚动速度,“延迟”框中的数值表示字幕滚动一步
的时间间隔是多少毫秒,“数量”框中的数值表示字幕滚动一步
的距离是多少像素。“表现方式”区域用于指定文字的表现方式。
选中“重复”区域的“连续”复选框,移动字幕将连续滚动;若
要设置字幕滚动有限次,可以取消选中“连续”复选框并输入字
幕重复的次数。“背景色”列表框用于设置移动字幕的背景颜色。
“大小”区域用于设置字幕的宽度与高度。
结 束
(4)单击“确定”按钮,即可插入字幕。
目 录
上一页
2015/7/21
计算机文化基础
49
8.3.4 插入对象
目 录
上一页
下一页
结 束
4. 插入交互式按钮
交互式按钮是一个动态按钮,当用户将鼠标指向交互式按钮
时,交互式按钮会改变颜色或形状。默认情况下,交互式按钮是一
个带有彩色方框的文字按钮,也可以应用图片创建交互式按钮。
(1)将插入点设置在要插入交互式按钮的位置,单击“插入”
菜单的“Web组件”命令,打开“插入Web组件”对话框,在对话
框的“组件类型”列表框中选择“动态效果”,在“选择一种效果”
列表中选择“交互式按钮”,单击“完成”按钮,打开“交互式按
钮”属性对话框。
(2)设置
 按钮
 字体
 图像
(3)单击“确定”按钮,即可插入交互式按钮。
2015/7/21
计算机文化基础
50
8.3.4 插入对象
5. 插入站点计数器
目 录
(1)单击“插入”菜单的“Web组件”命令,
打开“插入Web组件”对话框,在对话框的“组
件类型”列表框中选择“计数器”,在“选择计
数器样式”列表中选择一种样式,单击“完成”
按钮,打开“计数器属性”对话框;
上一页
(2)设置计数器属性;
下一页
(3)单击“确定”按钮,插入站点计数器。
结 束
返 回
2015/7/21
计算机文化基础
51
8.3.5 创建超链接
目 录
上一页
下一页
结 束
2015/7/21
Web网页的强大之处就在于其超链接,使用超
链接能够将Internet中的信息有机地组织起来,使
人们在丰富多彩的WWW世界轻松地漫游。超链接
是指从一个网页指向一个目标的链接关系,这个目
标可以是另一个网页,也可以是相同网页上的不同
位置,还可以是图片、文件、电子邮件地址等。
超链接由链接载体和链接目标两部分组成。
根据链接载体的特点,可以把链接分为文本超
链接与图片超链接两大类。
计算机文化基础
52
8.3.5 创建超链接
1. 创建文本超链接
文本超链接是指在文本上定义的超链接,单击文本超链
接,会自动跳转到指向的链接目标。创建文本超链接的具体操
作步骤如下:
(1)选定要定义超链接的文本,从“插入”菜单中选择“超
链接”命令,或单击“常用”工具栏上的“超链接”按钮 ,
打开“插入超链接”对话框,如下图所示;
目 录
上一页
下一页
结 束
2015/7/21
计算机文化基础
53
1. 创建文本超链接
(2)在“插入超链接”对话框中选择要链接的
目标网页,单击“确定”按钮,插入超链接,可
以看到所选定的文本变为蓝色,并且带有下划线,
说明选定的文本已经被设置为超链接文本。
目 录
上一页
保存网页,在浏览器中预览效果。当鼠标移
至链接文字时,鼠标指针变成手形,此时单击鼠
标就跳转到目标网页。
下一页
结 束
2015/7/21
计算机文化基础
54
2. 创建图片超链接
目 录
上一页
下一页
图片超链接是指在图片上创建的超链接,图
片超链接比文本超链接显得更加生动活泼,单击
图片超链接,会自动跳转到指向的链接目标。可
以将整个图片设置为超链接,也可以为图片分配
一个或多个热点。热点是图片上的超链接区域,
包含热点的图片称为图像映射,用户单击热点区
域可以转到相应的链接目标。
结 束
2015/7/21
计算机文化基础
55
1)创建图片超链接
目 录
上一页
下一页
结 束
2015/7/21
(1)选定要定义超链接的图片,从“插入”
菜单中选择“超链接”命令,或单击“常用”工
具栏上的“超链接”按钮,打开“插入超链接”
对话框;
(2)在对话框中选择要链接的目标网页,单
击“确定”按钮,即可插入超链接。
保存网页,在浏览器中预览效果,当鼠标移
至链接图片时,鼠标指针变成手形,此时单击鼠
标就跳转到目标网页。
计算机文化基础
56
2)为图片添加热点
热点可以是图片上具有某种形状的一块区域
或文本,当用户单击该区域或文本时,超链接目
标会显示在Web浏览器中。在FrontPage 2003中,
热点的形状可以是长方形、圆形或多边形。
目 录
上一页
下一页
结 束
2015/7/21
例如我们通过山东省地图浏览山东省各城市的
民俗风情,当鼠标移至地图上的各个城市时,鼠
标指针变为手形,单击后打开描述该城市民俗风
情的页面。
计算机文化基础
57
为图片添加热点,具体操作步骤如下:
目 录
上一页
下一页
结 束
2015/7/21
(1)选择需要添加热点的图片;
(2)在“图片”工具栏中,单击长方形、圆形
或多边形热点按钮匹配需要的形状;
(3)在图片上,采用鼠标拖动操作画出所选形
状(画多边形时,可单击多边形的第一个角,然后
依次单击多边形其他角的位置,最后双击完成多边
形);
(4)释放鼠标,弹出“插入超链接”对话框,
按照插入超链接中所讲方法创建超链接即可。
计算机文化基础
58
为图片添加热点
重复步骤(2)、(3)、(4),在图片上依次创建
超链接到其他网页。当鼠标移动到热点区域时,光标
变为手形,如下图所示。单击鼠标,超链接的目标网
页就会显示在Web浏览器窗口中。
目 录
上一页
下一页
结 束
返 回
2015/7/21
计算机文化基础
59
3. 使用书签超链接
对于网页的超链接,往往使用户跳转到目
标网页的顶端,应用书签能够更严格地控制用
户到达网页内的某个具体位置。书签是网页中
被标记的位置或被标记的文本。
1)插入书签
目 录
上一页
下一页
结 束
2015/7/21
(1)选中作为书签的文本,或
将光标定位在要插入书签的位置。
(2)选择“插入”菜单的“书
签”命令,弹出“书签”对话框,
如右图所示,所选文本自动出现
在“书签名称”框中。
(3)单击“确定”按钮,插入
书签,可以看到所选文本下方出
现虚线。
计算机文化基础
60
2)创建书签超链接
(1)选定要定义超链接的文本或图片;
(2)从“插入”菜单中选择“超链接”命令,弹出“插入超
链接”对话框,如下图所示,在对话框的“链接到”栏单击“本
文档中的位置”,选择要链接的书签,单击“确定”按钮,插入
书签超链接。
保存网页,在浏览器中预览效果,单击页面中的书签超链接,
页面会跳转到书签的位置。
目 录
上一页
下一页
结 束
2015/7/21
计算机文化基础
61
4. 创建电子邮件超链接
目 录
上一页
下一页
结 束
电子邮件超链接为用户发送电子邮件提供了极大的
方便,单击电子邮件超链接后,允许用户书写电子邮
件内容,并发往指定的地址。具体操作步骤如下:
(1)选择作为电子邮件超链接的文本或图片;
(2)从“插入”菜单中选择“超链接”命令,弹出
“插入超链接”对话框;
(3)在 对 话框 的 “ 链 接到 ”栏 单 击“ 电子 邮 件地
址”,在“电子邮件地址”框中输入所需电子邮件地
址,还可以在“主题”框中键入电子邮件的主题;
(4)单击“确定”按钮,完成电子邮件超链接的创
建。
返 回
2015/7/21
计算机文化基础
62
5. 创建下载文件超链接
如果要在网站中提供资料下载功能,就需要创建下载链接,
网站中每个用于下载的文件要对应一个下载链接。具体操作
步骤如下:
(1)选择作为文件超链接的文本或图片;
(2)从“插入”菜单中选择“超链接”命令,弹出“插
入超链接”对话 框,在对话框中选择要下载的文件;
(3)单击“确定”按钮,完成文件超链接的创建。
保存网页,在浏览器中预览效果,单击创建的文件超链接
时,弹出“文件下载”对话框,如下图所示,用户可以根据
需要打开或保存文件。
目 录
上一页
下一页
结 束
返 回
2015/7/21
计算机文化基础
63
8.4 网 页 布 局
目 录
网页的布局设计,是将文字、图片等网页元
素,根据特定的内容和主题,在网页所限定的
范围中进行视觉的关联与配置,从而将设计意
图以视觉形式表现出来。网页的布局一般使用
表格或框架来实现。
上一页
下一页
结 束
2015/7/21
计算机文化基础
64
8.4 网 页 布 局
8.4.1 创建和使用表格
8.4.2 创建和使用框架
目 录
上一页
下一页
结 束
返 回
2015/7/21
计算机文化基础
65
8.4.1 创建和使用表格
目 录
上一页
下一页
结 束
2015/7/21
表格由单元格构成的行和列组成,单元格中
可以插入文本、图片以及其他对象。利用表格
可以有条理地排列数据或组织网页布局。表格
的行、列和单元格都可以进行复制、粘贴,在
表格中还可以插入表格,一层层的表格嵌套使
设计更加方便。FrontPage 2003提供了与Word
字处理软件类似的表格处理功能,在网页中可
以轻松地创建和编辑表格。
计算机文化基础
66
1. 创建表格
目 录
上一页
下一页
结 束
2015/7/21
创建表格有以下三种常用方法:
(1)使用“表格”菜单的“插入”子菜单中的
“表格”命令,可以对插入的表格进行精确的设
置,包括行和列的数目、对齐方式、单元格间距、
单元格衬距、边框粗细和背景等。
(2)使用“常用”工具栏的“插入表格”按
钮 ,快速插入表格。
(3)使用“表格”菜单的“绘制表格”命令,
手动绘制表格。
计算机文化基础
67
2. 设置表格属性
插入表格后,为了使表格看上去更专业、更美观,
需要设置表格的属性。
目 录
上一页
(1)设置表格行数和列数。
(2)设置表格布局,包括设置表格的对齐方式、浮动、宽
度等。
(3)在“粗细”数值框中输入数值,即可设置表格边框的
粗细。
(4)在背景区域,可以通过“颜色”框设置单一色彩的表
格背景,也可选中“使用背景图片”复选框,用“浏览”按
钮设置图片作为表格的背景。
下一页
结 束
2015/7/21
计算机文化基础
68
3. 设置单元格属性
将光标放置在需要设置属性的单元格中,使用“表格”菜
单的“表格属性”子菜单中的“单元格”命令,打开 “单元格
属性”对话框,设置单元格属性。
目 录
上一页
下一页
在“布局”区域可以设置水平、垂直对齐方式,指定宽度、
高度、标题单元格,设置行跨距、列跨距等。
在“边框”区域中可以设置单元格边框的颜色、亮边框、
暗边框。
在“背景”区域中可以设置单元格的背景颜色,或使用
图片作为背景。
结 束
2015/7/21
计算机文化基础
69
4. 调整表格
目 录
创建表格后,可以对表格单元格、行和列的
布局和结构进行调整,以满足不同的需要。如调
整行、列或单元格;插入行、列或单元格;删除
行、列或单元格;合并、拆分单元格;平均分布
行高、列宽;设置单元格属性等。
上一页
下一页
结 束
返 回
2015/7/21
计算机文化基础
70
8.4.2 创建和使用框架
目 录
上一页
下一页
框架的使用是进行网页布局设计的一种重要
手段。框架将浏览器窗口划分为几个区域,每
个框架中都可以显示一个独立的网页。浏览器
窗口中显示的网页实际是这些框架的集合,因
此被称为框架网页。框架网页并不包含显示的
内容,只是记录了该框架网页包含几个框架、
其拆分方式以及每个框架中显示哪个网页(与
其他网页的超链接)等。
结 束
2015/7/21
计算机文化基础
71
1. 创建框架网页
目 录
上一页
下一页
结 束
2015/7/21
在FrontPage 2003中,可以使用框架网页布局
模板轻松创建框架网页。具体操作步骤如下:
(1)单击“文件”菜单的“新建”命令,在
“新建”任务窗格中选择“新建网页”中的“其
他网页模板”。
(2)在弹出的“网页模板”对话框中,切换到
“框架网页”选项卡,选择所需的模板,如“目
录”模板,可在“说明”及“预览”区域查看该
模板的说明及预览图。
计算机文化基础
72
(3)单击“确定”按钮,完成框架网页的创建,如下图所示;
在该图窗口底部新
增了“无框架”视
图模式,可以为不
支持框架的浏览器
创建替代网页。
目 录
上一页
下一页
结 束
2015/7/21
(4)每个框架中,单击“设置初始网页”按钮可以建立
与已经存在网页的超链接,从而在此框架中显示该网页;单
击“新建网页”按钮可以建立显示在该框架中的新网页。
计算机文化基础
73
2. 保存框架网页
保存框架网页需要保存框架和各个框架中的网页。例如,使用
“目录”模板创建的框架网页需要保存作为容器的框架网页和分
别显示在两个框架中的两个网页。具体操作步骤如下:
(1)使用“文件”菜单的“保存”命令,或单击“常用”工具
栏的“保存”按钮,弹出“另存为”对话框。
目 录
上一页
下一页
结 束
2015/7/21
(2)在“另存为”对话框右边的框架网页预览图中,深蓝色的
区域或边框指明了框架中正在保存的网页。进行相应设置后,单
击“保存”按钮,该网页保存完毕。
(3)重复步骤(2),直至所有的框架网页都保存完毕,如使
用“目录”模板创建的框架网页需要保存三次。
如果某个框架网页通过单击“设置初始网页”按钮建立与已
经存在网页的超链接,则不会弹出“另存为”对话框保存该网页。
计算机文化基础
74
3. 拆分框架
当使用模板创建的框架结构不能满足需要时,可以
通过拆分框架制作出更为复杂的框架网页。具体操作
步骤如下:
(1)选择要拆分的框架,在“框架”菜单中选择
“拆分框架”命令,打开“拆分框架”对话框;
目 录
上一页
下一页
(2)根据需要选择“拆分为列”或“拆分成行”选
项,单击“确定”按钮完成拆分。也可按住Ctrl键拖
动框架的边框实现拆分框架。
结 束
2015/7/21
计算机文化基础
75
4. 删除框架
目 录
上一页
下一页
可以从框架结构中删除指定的框架。此时系
统只是把框架从框架网页中删去,而此框架中的
网页文件仍然存在。删除了一个框架后,其余框
架会加宽以填充删除框架留下的空间。若框架网
页只有一个框架,则不能删除该框架。删除框架
的具体操作方法是:选择要删除的框架,在“框
架”菜单中选择“删除框架”命令。
结 束
2015/7/21
计算机文化基础
76
5. 设置框架属性
在框架网页中可以设置框架的大小、框架的边距和在
框架中是否显示滚动条等属性。具体操作方法是:选择
框架,从“框架”菜单中选择“框架属性”命令,弹出
“框架属性”对话框,如右图所示。
目 录
上一页
下一页
结 束
返 回
2015/7/21
在“名称”框中输入新
的框架名称,即可对该框
架进行重命名。
在“框架大小”区域
中设置宽度和高度,可以
改变框架的大小,也可用
鼠标拖动框架的边框直接
调整框架的宽度和高度。
计算机文化基础
77
6 创建框架超链接
目 录
上一页
下一页
结 束
2015/7/21
框架超链接的使用使网页之间的组织更加灵活、有效。
1). 创建框架超链接
若要设置框架超链接,执行下列操作:
(1)选择要创建超链接的文字或图片,从“插入”菜
单中选择“超链接”命令,弹出“插入超链接”对话
框;
(2)在“插入超链接”对话框中选择要链接的目标网
页,单击“目标框架”按钮,出现“目标框架”对话
框;
(3)在“当前框架网页”区域中单击要用作目标的框
架,单击“确定”按钮,返回到“插入超链接”对话
框,在对话框底部标签“目标框架”后显示设置的目
标框架名称;
计算机文化基础
78
(4)单击“确定”按钮,完成框架超链接的创建。
2). 使用特殊的目标框架
在指定目标框架时,除了当前框架外,还提供
了一些特殊的框架来创建不同效果的目标框架。
这些特殊框架位于“目标框架”对话框的“公用
的目标区”区域中,有以下几种:
目 录
上一页
下一页
结 束
 相同框架:将链接的网页显示在包含该超链接
的同一个框架内。
 整页:将框架展开为整个窗口,显示链接网页。
 新建窗口:打开另外一个新窗口,显示链接网
页。
 父框架:在当前框架的上层框架内显示链接网
页。
返 回
2015/7/21
计算机文化基础
79
8.5 创建表单页面
目 录
上一页
表单是Web服务器与客户交互的手段。表单
的作用就是收集用户的输入信息,从而实现网
站与用户的交互。例如,用户可以用表单收集
用户的个人资料,也可以用表单设计一个订货
单,让用户指定要购买的商品名称、型号、数
量等。
下一页
结 束
2015/7/21
计算机文化基础
80
8.5 创建表单页面
8.5.1 插入表单域
8.5.2 提交表单
目 录
上一页
下一页
结 束
返 回
2015/7/21
计算机文化基础
81
8.5.1 插入表单域
目 录
上一页
下一页
结 束
2015/7/21
表单中至少要有一个供用户输入信息的域,一个用
来把信息发送给服务器的“提交”按钮,以及一个用
来清除域中现有内容的“重置”按钮。当用户在表单
中输入信息,单击“提交”按钮后,这些信息将被发
送到服务器,服务器端程序将对这些信息进行处理。
使用“插入”菜单的“表单”子菜单的“表单”命令,
将插入一个非常简单的表单。该表单只有“提交”和
“重置”两个按钮,但这是所有复杂表单的基础,可
以在其中插入更多的表单域。在FrontPage 2003中,
可以插入文本框、文本区、复选框、选项按钮、分组
框、下拉框、按钮、高级按钮等表单域。
计算机文化基础
82
1. 插入文本框
文本框用于让用户输入一行文字。将光标放在要插
入文本框的位置,使用“插入”菜单的“表单”命令,
再选择“文本框”子命令,即可插入一个文本框,如
下图所示。
目 录
上一页
下一页
结 束
2015/7/21
要设置文本框的属性,可以使用“格式”菜单中的“属性”
命令,也可以使用右键菜单中的“表单域属性”命令,或
直接双击文本框,打开“文本框属性”对话框。在“文本
框属性”对话框中,“名称”用于设置该文本框的名称,
“初始值”用于设置文本框内一开始显示的内容,“宽度”
用于设置文本框所能输入字符的个数,“密码域”用于设
置是否让文本框内输入的字符可见。插入文本框时,若插
入点在一个已有的表单内,就把一个新的文本框插入到这
个表单中。若插入点在表单之外,则创建的文本框包含
“提交”和“重置”按钮。
计算机文化基础
83
2. 插入文本区
文本区和文本框类似,都用于输入文本,不同之处在于
文本区中可以接受多行文本。当文本区中输入内容较多时,
可以拖动上下滚动条。将光标放在要插入文本区的位置,使
用“插入”菜单的“表单”命令,再选择“文本区”子命令,
即可插入一个文本区,如下图所示。
目 录
上一页
下一页
文本区属性与文本框属性基本相同,还可以在“行数”
框中设置该文本区包含的文本行数。
结 束
2015/7/21
计算机文化基础
84
3. 插入复选框
复选框是提供给用户的一个选项,一般彼此独立的多个复选
框组成一组,用户可以在其中任意选择,也可以同时选中所有
项,或一个都不选。
将光标放在要插入复选框的位置,使用“插入”菜单的“表
单”命令,再选择“复选框”子命令,插入一个复选框,最后
在复选框旁键入文字进行说明。如果需要插入多个复选框,重
复以上操作即可。
目 录
上一页
下一页
结 束
2015/7/21
“复选框属性”
对话框如右图所示,
“名称”用于设置复
选框的名称,“值”
用于返回复选框是否
已选中,
“初始状态”选项按钮组用于设置初始状态下该复选框
是否被选中,默认为“未选中”,“Tab键次序”表示当
按下Tab键切换输入焦点时,该复选框所在的次序。
计算机文化基础
85
4. 插入选项按钮
选项按钮与复选框类似,不同的是一组选项按钮只能选
中其中的一个,其外形是圆的。将光标放在要插入选项按钮
的位置,使用“插入”菜单的“表单”命令,再选择“选项
按钮”子命令,插入一个选项按钮,最后在选项按钮旁键入
文字进行说明。如果需要插入多个选项按钮,重复以上操作
即可。如下图所示,插入四个选项按钮供用户评价自己的网
页。
目 录
上一页
下一页
结 束
2015/7/21
在“选项按钮属性”对话框中,“组名称”用来设置此
选项按钮所属组的名称,如果把多个选项按钮编成一组,必
须使它们的组名称相同。
计算机文化基础
86
5. 插入分组框
如果要将一组相关的控件或文本与网页或当前表单中
的其他信息分开,可以使用分组框。将光标放在要插入分
组框的位置,使用“插入”菜单的“表单”命令,再选择
“分组框”子命令,即可插入分组框。
在“分组框属性”对话框中,“标签”用来设置分组
框的名称。“对齐”用来设置分组框标签的对齐方式。
6. 插入下拉框
目 录
上一页
下一页
结 束
2015/7/21
下拉框用于从一个列表中选择一项或几项。从功能的
角度讲,可以用一组复选框或一组单选按钮来实现,但下
拉框占用的网页空间相对较小。
将光标放在要插入下拉框的位置,使用“插入”菜单的
“表单”命令,再选择“下拉框”子命令,即可插入下拉
框。
在“下拉框属性”对话框中,单击“添加”按钮,将
打开“添加选项”对话框,可以设置选项名称,指定选项
的初始状态是选中还是未选中。
计算机文化基础
87
7.插入按钮和高级按钮
目 录
上一页
下一页
结 束
返 回
2015/7/21
一个表单中至少要有一个“提交”按钮和一
个“重置”按钮。“提交”按钮的作用是把表单
中的数据提交给Web服务器的表单处理程序,
“重置”按钮的作用是把表单中的数据清空,以
便重新填写。将光标放在要插入按钮的位置,使
用“插入”菜单的“表单”命令,再选择“按钮”
子命令,即可插入按钮。
在“按钮属性”对话框中可以设置按钮的名
称、值/标签、按钮类型等属性。按钮可以设置为
“提交”、“重置”或普通按钮,对于“提交”
和“重置”按钮来说,它们的动作是默认的。
高级按钮的插入与属性设置与普通按钮基本
相同,但是高级按钮具备更加精确的控制按钮属
性的能力。
计算机文化基础
88
8.5.2 提交表单
目 录
用户结束表单操作后,单击“提交”按钮,当“提交”
按钮设置了表单结果送至何处后可以正常处理。表单处理
程序对表单的处理可以是将表单结果保存为文件,或将表
单结果发送至一个电子邮件地址。
1. 将表单结果保存为文件
在表单上单击鼠标右键,在弹出的右键菜单中选择
“表单属性”命令,打开“表单属性”对话框,如下图所
示。
上一页
下一页
结 束
2015/7/21
计算机文化基础
89
2. 将表单结果发送至电子邮件
目 录
上一页
下一页
结 束
也可以使用电子邮件发送表单结果,当用户提交表单时,
就会向指定的电子邮件地址发送一个包含表单结果的邮件。
打开“表单属性”对话框,在“电子邮件地址”框中,
输入要向其发送表单结果的电子邮件地址。如果只想用电子
邮件发送表单结果,而不想将其保存到文件中,可以清除文
本框“文件名称”。单击“选项”按钮,在“电子邮件结果”
选项卡中可以设置接收结果的电子邮件地址、电子邮件格式、
邮件标题等选项。
要使用FrontPage默认的表单处理程序,Web服务器必
须 安 装 FrontPage 服 务 器 扩 展 ( FrontPage Server
Extension),否则表单功能将不会产生任何效用。要将表
单结果发送至电子邮件,还需将服务器配置为可发送电子邮
件的服务器。
返 回
2015/7/21
计算机文化基础
90
8.6 网页的发布
8.6.1 网站和网页的设计原则
8.6.2 网站的发布和维护
目 录
上一页
下一页
结 束
返 回
2015/7/21
计算机文化基础
91
8.6.1 网站和网页的设计原则
目 录
上一页
下一页
结 束
2015/7/21
网站和网页的设计既是一项复杂的技术也是一门艺术,设
计良好的网站不但可以提供丰富的信息,而且还能给用户带来
愉悦的浏览体验。以下是网站和网页设计的一些基本原则。
1)目标明确,重点突出
首先要明确信息发布者的性质与用途,并了解主要浏览对象
及其要进行的操作,做到有的放矢。然后,对发布的信息要分
清主次,面面俱到可能使浏览者难以找到有用的信息,不能达
到预期目的。
2)主题鲜明,层次清晰
要做到主题鲜明,首先要设计好网站的主页。主页的设计要
简洁,内容不宜过多,应该在主页上建立分类栏目。网页需要
有层次清晰的结构,尤其是内容较多的网页,可以根据内容进
行分类,分成多个栏目,便于阅读。
计算机文化基础
92
目 录
上一页
下一页
结 束
3)合理设置栏目
制作网页前,要先规划好,确定合理的栏目和板
块。栏目的安排要紧扣主题,既要考虑网页内容的
分类,又要方便浏览,并能对浏览者起到较好的导
航作用。
4)正确定位整体风格
网站的整体风格是指站点的整体形象给浏览者的
综合感受。整体风格是非常抽象的概念,包括网站
的标志、色彩、字体、标语、版面布局、内容价值
等诸多因素,需要结合整个站点进行定位。对于栏
目内容跨度较大的网站,可以考虑针对不同栏目采
用不同的风格。
2015/7/21
计算机文化基础
93
5)页面布局合理
网页设计要针对所要表达的信息进行合理的布局,好的页
面布局能使浏览者首先对网页内容的结构有一个清晰的认识。
可以使用表格辅助页面元素的布局,也可以使用特定的布局框
架。页面布局要注意保证重点内容放置在屏幕的重点位置。
6)色彩搭配,和谐统一
目 录
色彩是影响整体风格的关键因素。不同的色彩搭配产生不
同的效果,并可能影响到浏览者的情绪。一般来说,一个网站
的标准色彩以不超过三、四种为宜,以便使页面色彩丰富而又
协调统一。
上一页
7)多媒体功能使用得当
下一页
结 束
返 回
2015/7/21
除了文字信息外,网站中图片、声音、动画以及视频等多
媒体信息的使用也是网页上重要的内容。它们的使用可以丰富
画面,使页面更加形象生动。但这些文件都不应该太大,减少
网页的下载时间,提高用户浏览信息的速度。
计算机文化基础
94
8.6.2 网站的发布和维护
所谓发布网站,就是把网站中的内容上传到Web
服务器上。为了便于用户发布网站,FrontPage 2003
提供了相当方便的发布工具。常用的通过FTP发布网
站的操作步骤如下:
(1)打开要发布的网站,从“文件”菜单中选择
“发布网站”命令,打开“远程网站属性”对话框,
如下图所示。如果已经选择了发布目标,则该对话框
不会出现。
目 录
上一页
下一页
结 束
2015/7/21
计算机文化基础
95
目 录
上一页
下一页
结 束
返 回
2015/7/21
(2)在“远程Web服务器类型”中选择FTP,然后在下方的
“远程网站位置”框中输入远程网站的位置。切换到“发布”
选项卡,可以进行发布网站的相应设置。
(3)单击“确定”按钮,FrontPage 会尝试连接指定的FTP,
如果需要相应的用户名和密码,则会弹出“要求提供用户名和
密码”对话框。
(4)输入用户名和密码,单击“确定”按钮,FrontPage继
续工作。
(5)单击窗口右下角的“发布网站”按钮,开始发布网站.
(6)文件传送完毕,FrontPage显示状态“成功”,表示网
站已经成功发布。
通过HTTP方式上传网页与通过FTP方式非常类似。需要注
意 的 是 , 通 过 HTTP 方 式 上 传 时 需 要 对 方 的 服 务 器 支 持
FrontPage服务器扩展才行。
计算机文化基础
96
谢谢使用!
目 录
上一页
下一页
结 束
2015/7/21
计算机文化基础
97

similar documents