《山东专升本计算机文化基础第七版PPT课件石油大学出版社第9章》由会员分享,可在线阅读,更多相关《山东专升本计算机文化基础第七版PPT课件石油大学出版社第9章(99页珍藏版)》请在金锄头文库上搜索。
1、第第 九九 章章 网网 页页 制制 作作 目 录上一页下一页 结 束第九章 网页制作9.1 HTML简介简介 9.2 FrontPage 2003概述概述 9.3 网页制作网页制作 9.4 网页布局网页布局 9.5 创建表单页面创建表单页面 9.6 网页的发布网页的发布 7/20/20241计算机文化基础 目 录上一页下一页 结 束9.1 HTML简介 HTML即即Hypertext Markup Language的的缩缩写写。它它使使用用一一些些约约定定的的标标记记(Tag)对对文文本本进进行行标标注注,定定义义网网页页的数据格式,描述的数据格式,描述Web页中的信息,控制文本的显示。页中的
2、信息,控制文本的显示。 我我们们把把用用HTML语语言言编编写写的的文文件件称称为为HTML文文件件。它它通通常常被被存存储储在在Web服服务务器器上上,客客户户端端通通过过浏浏览览器器向向Web服服务务器器发发出出请请求求,服服务务器器响响应应请请求求并并将将HTML文文件件发发送送给给浏浏览览器器,然然后后由由浏浏览览器器对对文文件件中中的的标标记记作作出出相相应应的的解解释释,以以页页面面的的形形式式呈呈现现在在用用户户屏屏幕幕上上。因因此此,我我们们又又把把HTML文档称为网页文档称为网页 (Web Page)。 7/20/20242计算机文化基础 目 录上一页下一页 结 束9.1 H
3、TML简介HTML语语言言是是一一种种标标记记语语言言,简简单单易易学学。用用HTML语语言言编编写写的的网网页页实实际际上上是是一一种种文文本本文文件件,它它以以.htm或或.html为为扩扩展展名名,我我们们可可以以使使用用任任何何文本处理软件(例如:记事本)编写。文本处理软件(例如:记事本)编写。9.1.1 HTML语言概述语言概述9.1.2 HTML语言的基本语法语言的基本语法返 回7/20/20243计算机文化基础 目 录上一页下一页 结 束9.1.1 HTML语言概述 HTML语语 言言 是是 由由 世世 界界 性性 的的 标标 准准 化化 组组 织织W3C(World Wide
4、Web Consortium)制制定定的的,通通过过浏浏览览http:/www.w3.org可可以以了了解解到到HTML标标准的最新动态。准的最新动态。下下面面介介绍绍HTML文文件件的的基基本本构构成成和和HTML文文件的层次结构。件的层次结构。 7/20/20244计算机文化基础 目 录上一页下一页 结 束1. HTML文件的基本构成文件的基本构成 Internet中中的的每每一一个个HTML文文件件都都包包括括文文本本内内容容和和HTML标标记记两两部部分分。其其中中,HTML标标记记负负责责控控制制文文本本显显示示的的外外观观和和版版式式,并并为为浏浏览览器器指指定定各各种种链链接接的
5、的图图像像、声声音音和和其其他他对对象象的的位位置置。多多数数HTML标记的书写格式如下:标记的书写格式如下:文本内容文本内容 标标记记名名写写在在“”内内。多多数数HTML标标记记同同时时具具有有起起始始和和结结束束标标记记,并并且且成成对对出出现现,但但也也有有些些HTML标标记记没没有有结结束束标标记记。另另外外,HTML标标记记不不区分大小写。区分大小写。HTML文件的基本构成文件的基本构成7/20/20245计算机文化基础 目 录上一页下一页 结 束 某某些些HTML标标记记还还具具有有一一些些属属性性,这这些些属属性性指指定定对对象象的的特特性性,如如背背景景颜颜色色、文文本本字字
6、体体及及大大小小、对对齐齐方方式式等等。属属性性一一般般放放在在“起起始始标标记记”中中,格格式式如下:如下: 文本内容文本内容 其其中中标标记记名名和和属属性性之之间间用用空空格格分分隔隔。如如果果标标记记有多种属性,属性之间也要用空格分隔。有多种属性,属性之间也要用空格分隔。 HTML文件的基本构成文件的基本构成7/20/20246计算机文化基础 目 录上一页下一页 结 束2. HTML网页的结构网页的结构 现现在在我我们们先先看看一一个个简简单单的的HTML文文件件,从从中中体体会会用用HTML语言编写网页时的层次结构。语言编写网页时的层次结构。 【例例9-1】用用HTML语言编写一个简
7、单的网页。语言编写一个简单的网页。我的第一个我的第一个Web页页欢迎进入欢迎进入HTML世界!世界!这这里里我我们们首首先先介介绍绍HTML语语言言的的基基本本知知识识和和语语法法。然然后后,讲讲授授如如何何使使用用HTML语语言言编编写写您您的的Web页页面面。7/20/20247计算机文化基础 目 录上一页下一页 结 束HTML语言概述 将将上上述述代代码码用用文文本本编编辑辑器器编编辑辑并并保保存存为为一一个个扩扩展展名名为为.htm的的文文件件,双双击击该该文文件件图图标标,在在浏浏览览器器中看到如下图所示的结果。中看到如下图所示的结果。图9-17/20/20248计算机文化基础 目
8、录上一页下一页 结 束 从从上上例例可可以以看看出出,一一般般HTML文文件件都都是是以以开开头头,以以结结束束。其其文文件件结结构构由由以以下两部分组成:下两部分组成:1)头部()头部(Head) HTML文文件件的的头头部部由由和和标标记记定定义义。通通常常情情况况下下,文文件件的的标标题题、语语言言字字符符集集信信息息等等都都放放在在头头部部信信息息中中。最最常常用用到到的的标标记记是是,它它用用于于定定义义网网页页文文件件的的标标题题,当当该该网网页页文文件件被被打打开开后后,网网页页文文件件的的标标题题将将出出现在浏览器的标题栏中。现在浏览器的标题栏中。7/20/20249计算机文化
9、基础 目 录上一页下一页 结 束文件结构2)正文主体()正文主体(Body)正正文文主主体体是是HTML文文件件的的核核心心内内容容,由由和和标标记记定定义义。标标记记具具有有一一些些常常用用的的属属性性,格式如下:格式如下:其其中中,bgcolor为为背背景景颜颜色色,color为为文文本本颜颜色色。n为为六六位十六进制数。位十六进制数。如果网页使用背景图像,格式如下:如果网页使用背景图像,格式如下:HTML对对格格式式的的要要求求并并不不严严格格,当当HTML文文件件被被浏浏览览器器扫扫描描时时,所所有有包包含含在在文文件件中中的的空空格格、回回车车等等均均被被忽忽略略。因因此此你你可可以
10、以将将一一行行写写成成两两行行或或多多行行,在在浏浏览览器器中中结果是相同的。结果是相同的。 返 回7/20/202410计算机文化基础 目 录上一页下一页 结 束9.1.2 HTML语言的基本语法1. 文本布局文本布局1)段落标记)段落标记标标记记指指定定文文档档中中一一个个独独立立的的段段落落。通通过过设设置置align属属性性,控控制制段段落落的的对对齐齐方方式式,其其值值可可以以是是left、center、right、justify,分分别别表表示示左左对对齐齐、居居中中、右右对对齐和两端对齐,默认值为左对齐。齐和两端对齐,默认值为左对齐。使用格式如下:使用格式如下: 2)换行标记换行
11、标记 标记可以强制文本换行。该标记只有起始标记。标记可以强制文本换行。该标记只有起始标记。3)水平线标记)水平线标记水平线标记水平线标记用于在网页中插入一条水平线。用于在网页中插入一条水平线。7/20/202411计算机文化基础 目 录上一页下一页 结 束2. 文字格式文字格式 HTML语言中用于文字格式化的标记有:语言中用于文字格式化的标记有: 1)标题标记)标题标记 格式为:格式为: 标题文字内容标题文字内容 其其中中n说说明明大大小小级级别别,取取值值范范围围为为1到到6的的数数字字。把把标标题题分分为为 6级级,即即h1h6,其其中中h1文文字字最最大大,h6文文字最小。字最小。7/2
12、0/202412计算机文化基础 目 录上一页下一页 结 束2)字体标记)字体标记 字体标记用来对文字格式进行设置,主要具有以下属性:字体标记用来对文字格式进行设置,主要具有以下属性: (1)size属性:用来控制文字的大小,格式如下:属性:用来控制文字的大小,格式如下: 其中其中n的取值范围为的取值范围为17的数字,默认值为的数字,默认值为3。 标标记记和和标标记记都都可可以以控控制制文文字字的的大大小小。一一般般情情况况下下,文文章章的的标标题题最最好好由由标标记记控控制制,而而其其余余的的文文字字由由标标记控制。相比较而言,记控制。相比较而言,对字体的控制更加灵活。对字体的控制更加灵活。
13、(2)color属性:用来控制文字的颜色,格式如下:属性:用来控制文字的颜色,格式如下: 其中其中n是一个十六进制的六位数。是一个十六进制的六位数。(3)face属性:用来指明文字使用的字体,格式如下:属性:用来指明文字使用的字体,格式如下: 其中字体名的选择由其中字体名的选择由Windows操作系统安装的字体决定。如:操作系统安装的字体决定。如:宋体、楷体宋体、楷体_GB2312、Times New Roman、Arial等。等。文字格式文字格式7/20/202413计算机文化基础 目 录上一页下一页 结 束3)字形标记)字形标记 字字形形标标记记用用于于设设置置文文字字的的粗粗体体、斜斜体
14、体、下下划线、上标、下标等。划线、上标、下标等。标记格式标记格式字形结果字形结果粗体粗体斜体斜体下划线下划线上标上标下标下标文字格式文字格式7/20/202414计算机文化基础 目 录上一页下一页 结 束3. 插入图片插入图片 标标记记将将图图片片插插入入网网页页中中,用用于于设设置置图图片片的的大大小小以以及及相邻文字的排列方式。该标记具有以下属性:相邻文字的排列方式。该标记具有以下属性:(1)src属性:指明图片文件所在的位置。格式如下:属性:指明图片文件所在的位置。格式如下: 其中其中URL指图片文件存放的位置。指图片文件存放的位置。(2)alt属属性性:图图片片的的文文字字说说明明,当
15、当鼠鼠标标指指针针指指向向图图片片时时,该图片的说明性文字弹出。格式如下:该图片的说明性文字弹出。格式如下: (3)width和和height属属性性:设设置置图图片片显显示示区区域域的的宽宽度度和和高高度度。格式如下:格式如下: 其其中中width和和height属属性性的的取取值值n1和和n2,可可以以是是像像素素数数或或百百分比。分比。7/20/202415计算机文化基础 目 录上一页下一页 结 束(4)border属属性性:设设置置图图片片文文件件的的边边框框。格格式式如下:如下: 其中其中n为像素数。为像素数。(5)align属属性性:设设置置图图片片相相对对于于文文本本的的位位置置
16、关关系。格式为:系。格式为: 对对 齐齐 方方 式式 可可 以以 是是 : top( 顶顶 端端 对对 齐齐 ) 、middle(相相对对垂垂直直居居中中)、bottom(相相对对底底边边对对齐齐)、left(左左对对齐齐)、right(右右对对齐齐)、texttop(文本上方)等。文本上方)等。插入图片插入图片7/20/202416计算机文化基础 目 录上一页下一页 结 束4. 插入超链接插入超链接 在在HTML语语言言中中,和和标标记记用用于于设设置置网网页页中中的的超超链链接接,href属属性性指指明明被被超超链链接接的的文文件件地地址址。格格式式如下:如下: 超链接文本超链接文本 用用
17、于于表表示示超超链链接接的的文文本本一一般般显显示示为为蓝蓝色色并并且且加加下下划划线线。在在浏浏览览器器中中,当当鼠鼠标标指指针针指指向向该该文文本本时时,箭箭头头变变为为手手形形,并并在在浏浏览览器器的的状状态态栏栏中中显显示示该该超超链链接接的地址。的地址。 若使用图片做超链接,可使用如下格式完成:若使用图片做超链接,可使用如下格式完成: 7/20/202417计算机文化基础 目 录上一页下一页 结 束5. 使用表格使用表格 在在网网页页中中插插入入一一个个表表格格,需需要要用用到到一一组组HTML标记。定义表格的有关标记如下:标记。定义表格的有关标记如下: 定义表格区域定义表格区域。
18、定义表格标题定义表格标题。 定义表格头定义表格头。 定义表格行定义表格行。 定义表格单元格定义表格单元格。返 回7/20/202418计算机文化基础 目 录上一页下一页 结 束 常常用用的的标标记记属属性性中中,border属属性性用用于于设设置置表表格格边边框框的的宽宽度度;width、height属属性性用用于于设设置置表表格格或或单单元元格格的的宽宽度度、高高度度;cellspacing和和cellpadding属属性性分分别别用用于于设设置置单单元元格格之之间间的的间间隙隙和和单单元元格格内内部部空空白白;align属属性性用用于于设设置置表表格格或或单单元元格格的的对对齐齐方方式式;
19、bgcolor和和background属属性性分分别别用用于于设设置置表表格格的的背背景景颜颜色色和和背背景景图图像像。表格属性表格属性7/20/202419计算机文化基础 目 录上一页下一页 结 束9.2 FrontPage 2003概述 虽虽然然使使用用一一般般的的文文本本编编辑辑器器就就可可以以编编写写HTML文文档档,但但是是使使用用专专门门的的HTML编编辑辑器器或或Web创创作作工工具具往往往往更更加加方方便便。具具有有“所所见见即即所所得得”功功能能的的Web页页面面创创作作工工具具可可以以使使Web创创作作人人员员直直接接面面对对Web页页面面进进行行编编辑辑修修改改,并并且且
20、能能立立即即看看到到Web页面的显示效果。页面的显示效果。 FrontPage 2003是是微微软软公公司司开开发发的的网网页页制制作作和和网网站站管管理理工工具具,它它是是Microsoft Office 2003的的组组件件之之一一,与与Office的的其其他他组组件件高高度度融融合合,界界面面友友好好,功功能能强强大大,易易学学易易用用,是是目目前前使使用用较较为为广广泛泛的网页制作、网站管理工具之一。的网页制作、网站管理工具之一。7/20/202420计算机文化基础 目 录上一页下一页 结 束9.2 FrontPage 2003概述9.2.1 FrontPage 2003的主要功能的主
21、要功能9.2.2 FrontPage 2003的启动与退出的启动与退出9.2.3 网页与网站网页与网站9.2.4 FrontPage 2003的网页视图模式的网页视图模式9.2.5 FrontPage 2003中的视图中的视图返 回7/20/202421计算机文化基础 目 录上一页下一页 结 束9.2.1 FrontPage 2003的主要功能 FrontPage 2003的的主主要要功功能能是是制制作作网网页页和和管管理理站点。站点。 使使用用FrontPage 2003可可以以创创建建新新的的网网页页,也也可可以以打打开开并并修修改改已已经经存存在在的的网网页页。FrontPage 200
22、3提提供供了了多多种种编编辑辑网网页页的的方方式式,不不但但可可以以直直接接修修改改HTML,而而且且可可以以采采用用“所所见见即即所所得得”的的方方式式编编辑辑网网页页,还还可可以以使使用用菜菜单单命命令令插插入入各各种种网网页页元元素素,使用对话框修改其属性,十分灵活。使用对话框修改其属性,十分灵活。 返 回7/20/202422计算机文化基础 目 录上一页下一页 结 束 在在FrontPage 2003中中,可可以以很很容容易易地地插插入入文文本本、图图片片、表表格格、组组件件等等元元素素;可可以以使使用用主主题题和和样样式式表表、共共享享边边框框、框框架架等等管管理理网网页页的的外外观
23、观;还还可可以以使用表单等元素设计出交互式网页。使用表单等元素设计出交互式网页。 FrontPage 2003提提供供了了强强大大的的站站点点管管理理功功能能。一一组组相相关关网网页页和和有有关关文文件件组组成成一一个个站站点点,站站点点也也是是FrontPage 2003对对网网站站进进行行管管理理的的基基本本单单位位。在在FrontPage 2003中中可可以以轻轻松松实实现现设设计计、管管理理、分析、发布和维护站点等工作。分析、发布和维护站点等工作。FrontPage 2003的主要功能7/20/202423计算机文化基础 目 录上一页下一页 结 束9.2.3 网页与网站 网网页页是是全
24、全球球广广域域网网上上的的基基本本文文档档,用用HTML书书写写,通通常常以以.htm或或.html为为扩扩展展名名。网网页页可可以以独独立立存存在在,但但常常常常作作为为网网站站的的一一部部分分。网网站站是是一一组组相相关关网网页页和和有有关关文文件件的的组组合合,一一般般有有一一个个特特殊殊的的网网页页作作为为浏浏览览的的起起始始点点,称称为为主主页页(Homepage),),用来引导用户访问其他网页。用来引导用户访问其他网页。 网网站站通通常常位位于于Web服服务务器器上上,客客户户机机通通过过网网络络向向Web服服务务器器发发送送请请求求,Web服服务务器器响响应应客客户户机机的的请请
25、求求,并并使使用用HTTP协协议议将将网网页页和和有有关关文文件件通通过过网网络络传传送送回回客客户户机机,客客户户机端使用网页浏览器就能看到网页的内容了。机端使用网页浏览器就能看到网页的内容了。7/20/202424计算机文化基础 目 录上一页下一页 结 束网页与网站在在FrontPage 2003中中,可可以以建建立立和和编编辑辑独独立立的的网网页页,也也可可以以设设计计和和管管理理站站点点。在在站站点点中中可可以以包包含含大大量量网网页页和和各各种种文文件件,甚甚至至可可以以包包含含子子站站点点,而而且且只只有有在在使使用用站点时,站点时,FrontPage 2003的许多特性才有效。的
26、许多特性才有效。通通常常,在在FrontPage 2003中中建建立立的的站站点点需需要要发发布布到到Internet中中的的Web服服务务器器上上,成成为为真真正正意意义义上上的的网网站站,Internet上上的的用用户户才才能能访访问问。有有时时,可可以以在在同同一一台台计计算算机机上上安装安装Web服务器端软件,从而将站点发布到本机进行测试。服务器端软件,从而将站点发布到本机进行测试。用用FrontPage 2003也也可可以以建建立立基基于于本本地地硬硬盘盘的的站站点点,这这种种站站点点以以本本机机文文件件夹夹的的形形式式存存在在,不不需需要要发发布布到到服服务务器器,这这时,需要服务
27、器支持的功能是不可用的。时,需要服务器支持的功能是不可用的。返 回7/20/202425计算机文化基础 目 录上一页下一页 结 束9.2.4 FrontPage 2003的网页视图模式的网页视图模式 FrontPage 2003提供了四种网页视图提供了四种网页视图模式:模式:设设计计视视图图是是打打开开网网页页首首先先进进入入的的视视图图,可可以以在在其其中中输输入入文文本本、插插入入图图片片、插插入入表表格格等等,也也可可以以任任意意进进行行修改。修改。代代码码视视图图中中,用用户户可可以以查查看看、编编写写和和编编辑辑HTML标标记。记。预预览览视视图图中中可可以以看看到到网网页页在在We
28、b浏浏览览器器中中的的大大体体显显示情况。示情况。 FrontPage 2003新新增增的的拆拆分分视视图图将将窗窗口口工工作作区区拆拆分分成成上上、下下两两部部分分,上上半半部部分分是是代代码码区区,下下半半部部分分是是设设计计区区。无无论论对对哪哪一个区域进行修改,另一个区域都会做出相应的改变。一个区域进行修改,另一个区域都会做出相应的改变。返 回7/20/202426计算机文化基础 目 录上一页下一页 结 束9.2.5 FrontPage 2003中的视图 FrontPage 2003提提供供了了以以下下几几种种视视图图以以方方便便用用户户对对站站点点的的管管理理,用用户户可可以以在在不
29、不同同的的视视图图中中进进行行相相应应的操作。的操作。1. 网页视图网页视图2. 文件夹视图文件夹视图3. 远程网站视图远程网站视图4. 报表视图报表视图5. 导航视图导航视图6. 超链接视图超链接视图7. 任务视图任务视图7/20/202427计算机文化基础 目 录上一页下一页 结 束9.3 网网 页页 制制 作作Web站站点点的的开开发发,首首先先应应当当根根据据其其用用途途进进行行规规划划,确确定定站站点点结结构构,在在本本地地磁磁盘盘上上创创建建站站点,然后再建立网页。点,然后再建立网页。那么什么是那么什么是“站点站点”呢?呢?其其实实站站点点就就是是一一组组相相关关网网页页和和其其他
30、他文文件件的的集集合合,这这些些网网页页在在Internet中中表表现现为为一一个个完完整整结结构构就就称称为为“站站点点”。在在FrontPage 2003中中,站点以一个特殊文件夹的形式存储。站点以一个特殊文件夹的形式存储。7/20/202428计算机文化基础 目 录上一页下一页 结 束9.3 网 页 制 作9.3.1 创建站点创建站点9.3.2 网页编辑网页编辑9.3.3 插入对象插入对象9.3.4 创建超链接创建超链接返 回7/20/202429计算机文化基础 目 录上一页下一页 结 束9.3.1 创建站点创建站点 使使用用FrontPage 2003的的模模板板和和向向导导,用用户户
31、可可以以轻轻松松地地创创建出各种用途和风格的站点。建出各种用途和风格的站点。 新新建建站站点点时时,可可以以根根据据自自己己的的需需求求选选择择不不同同的的模模板板和和向向导导。对对于于不不同同的的模模板板和和向向导导,其其新新建建站站点点的的步步骤骤略略有有不同。不同。 下下面面以以“由由一一个个网网页页组组成成的的网网站站”模模板板为为例例,介介绍绍新新建站点的方法。建站点的方法。(1)单单击击“文文件件”菜菜单单的的“新新建建”命命令令,在在“新新建建”任任务务窗窗格格中中选选择择“新新建建网网站站”中中的的“由由一一个个网网页页组组成成的的网网站站”;(2)在在弹弹出出的的“网网站站模
32、模板板”对对话话框框的的“指指定定新新网网站站的的位位置置”框框中中输输入入新新站站点点要要保保存存的的位位置置,也也可可使使用用“浏浏览览”按钮指定新站点的位置;按钮指定新站点的位置;7/20/202430计算机文化基础 目 录上一页下一页 结 束(3)单击)单击 “确定确定”按钮,新建站点如下图所示按钮,新建站点如下图所示返 回该站点只有一个空白网页该站点只有一个空白网页index.htmindex.htm(主页)和用主页)和用于存储图片的文件夹于存储图片的文件夹imagesimages,你可以打开你可以打开index.htmindex.htm进行编辑,也可以进一步根据网站规划进行编辑,也
33、可以进一步根据网站规划创建文件夹和新建其他网页。创建文件夹和新建其他网页。 选择选择“文件文件”菜单的菜单的“退出退出”命令,可以关闭命令,可以关闭FrontPage 2003FrontPage 2003。7/20/202431计算机文化基础 目 录上一页下一页 结 束9.3.2 网页编辑1. 新建网页新建网页2. 打开打开/保存网页保存网页3. 预览网页预览网页4. 设置文字格式设置文字格式5. 设置段落格式设置段落格式6. 设置网页属性设置网页属性返 回7/20/202432计算机文化基础 目 录上一页下一页 结 束网页编辑 要要根根据据“网网页页模模板板”创创建建一一个个新新的的网网页页
34、,可可以以按下面的步骤:按下面的步骤:(1)单单击击“文文件件”菜菜单单的的“新新建建”命命令令,在在“新新建建”任任务务窗窗格格中中选选择择“新新建建网网页页”中中的的“其其他他网页模板网页模板”。(2)在在弹弹出出的的“网网页页模模板板”对对话话框框中中选选择择所所需需的的网网页页模模板板,可可以以在在“说说明明”及及“预预览览”区区域域查查看该模板的说明及预览图。看该模板的说明及预览图。(3)单单击击“确确定定”按按钮钮,系系统统新新建建一一个个基基于于所所选模板的网页。选模板的网页。(4)单单击击“文文件件”菜菜单单,选选择择“保保存存”命命令令,弹弹出出“另另存存为为”对对话话框框。
35、在在此此对对话话框框中中,输输入文件名进行保存。入文件名进行保存。返 回1. 新建网页新建网页7/20/202433计算机文化基础 目 录上一页下一页 结 束 在在FrontPage 2003中中,编编辑辑某某个个网网页页之之前前,需需要要先先打打开开该该网网页页。打打开开网网页页的的方方法法有有多多种种,常用的有以下几种:常用的有以下几种:(1)使使用用“文文件件”菜菜单单的的“打打开开”命命令令,或或“常常用用”工工具具栏栏的的“打打开开”按按钮钮,在在弹弹出出的的“打打开开文文件件”对话框中选择相应的网页;对话框中选择相应的网页;(2)如如需需要要打打开开的的文文件件已已在在打打开开的的
36、网网站站中中,在在文文件件夹夹视视图图中中双双击击该该网网页页图图标标即即可可将将其其打打开开。实实际际上上,在其他视图中双击网页图标,同样会打开指定网页。在其他视图中双击网页图标,同样会打开指定网页。 要要保保存存一一个个网网页页,可可以以使使用用“文文件件”菜菜单单的的“保保存存”命命令令,或或“常常用用”工工具具栏栏的的“保保存存”按按钮钮,如如需另存可使用需另存可使用“文件文件”菜单的菜单的“另存为另存为”命令。命令。返 回2. 打开打开/保存网页保存网页网页编辑7/20/202434计算机文化基础 目 录上一页下一页 结 束网网页页制制作作过过程程中中,用用户户可可以以切切换换到到“
37、预预览览”视视图图预预览览网网页页,也也可可以以使使用用“文文件件”菜菜单单的的“在在浏浏览览器器中中预预览览”命命令令预预览览网网页页。使使用用后后者者,系系统统会会打打开开浏浏览览器器显显示示网网页页,如如果果该该网网页页尚尚未未保存,会弹出对话框提示用户保存网页。保存,会弹出对话框提示用户保存网页。返 回3. 预览网页网页编辑7/20/202435计算机文化基础 目 录上一页下一页 结 束4. 设置文字格式 同同其其他他Microsoft Office组组件件一一样样,在在网网页页中中可可以以输输入入文文字字,复制、剪切和粘贴文字,设置文字格式,查找和替换文字等。复制、剪切和粘贴文字,设
38、置文字格式,查找和替换文字等。 在在FrontPage 2003中中,对对文文字字的的格格式式提提供供了了相相当当完完整整的的设设定定功功能能,文文字字格格式式的的变变化化也也因因此此多多种种多多样样。可可以以使使用用工工具具栏栏上的工具按钮或菜单命令快速地改变文字的外观。上的工具按钮或菜单命令快速地改变文字的外观。 设设置置文文字字格格式式的的一一般般操操作作步步骤骤是是:选选中中文文字字,单单击击“格格式式”菜菜单单的的“字字体体”命命令令,在在弹弹出出的的“字字体体”对对话话框框中中设设置置字字体体的的各各种种属属性性,也也可可以以使使用用“格格式式”工工具具栏栏中中相相应应的的命命令令
39、按按钮。钮。 虽虽然然可可以以设设置置各各种种美美观观的的字字体体,但但是是由由于于用用户户只只能能使使用用本本地地计计算算机机中中安安装装的的字字体体显显示示网网页页,因因此此还还是是使使用用常常见见的的字字体体为好。为好。返 回网页编辑7/20/202436计算机文化基础 目 录上一页下一页 结 束5. 设置段落格式设置段落格式 文文字字段段落落的的格格式式编编排排对对于于一一个个网网页页的的外外观观是是至至关关重重要要的的。FrontPage 2003通通过过按按Enter键键划划分分段段落落。值值得得注注意意的的是是,段段落落之之间间插插入入了了一一个个空空行行。如如果果只只是是需需要
40、要换换行行,而而不不是是另另起起一一个个段段落落,按按Shift+Enter键键即即可可。实实际际上上,按按Enter键键在在HTML代代码码中中插插入入的的是是标标记记,而而按按Shift+Enter键则插入的是键则插入的是标记。标记。 段段落落格格式式主主要要包包括括对对齐齐方方式式、缩缩进进和和段段落落间间距距等等。设设置段落格式的一般方法如下:置段落格式的一般方法如下: 将将插插入入点点移移动动到到要要设设置置格格式式的的段段落落中中,或或是是选选中中该该段段落落,单单击击“格格式式”菜菜单单的的“段段落落”命命令令,在在弹弹出出的的“段段落落”对话框中进行各种段落格式属性的设置。对话
41、框中进行各种段落格式属性的设置。 返 回网页编辑7/20/202437计算机文化基础 目 录上一页下一页 结 束6. 设置网页属性设置网页属性网网页页属属性性包包括括网网页页的的标标题题、格格式式、页页边边距距等等。要要设设置置网网页页属属性性,用用户户可可以以使使用用“文文件件”菜菜单单的的“属属性性”命命令令,或或者者在在网网页页的的任任意意地地方方单单击击鼠鼠标标右右键键,在在弹弹出出的的右右键键菜菜单单中中选选择择“网网页页属属性性”命命令令,FrontPage 2003将显示将显示“网页属性网页属性”对话框。对话框。网页编辑7/20/202438计算机文化基础 目 录上一页下一页 结
42、 束1)“常规常规”属性属性 要要设设置置网网页页的的“常常规规”属属性性,单单击击“网网页页属属性性”对对话话框框的的“常常规规”选选项项卡卡,如如下下图图所所示示。“标标题题”框框用用于于给给出出网网页页的的标标题题,网网页页标标题题将将显显示示在在浏浏览览器器的的标标题题栏栏中中。“背背景景音音乐乐”框框用用于于指指定定网网页页的的背背景景音音乐乐,当当用用浏浏览览器器打打开开网网页页时时,将将自自动动播播放放背背景景音音乐乐。背背景景音音乐乐区区域域的的“位位置置”框框用用于于指指定定声声音音文文件件的的位位置置,用用户户可可以以使使用用“浏浏览览”按按钮钮选选择择一一个个声声音音文文
43、件件;“循循环环次次数数”框框用用于于指指定定声声音音要要反反复复播播放放的的次次数数,如如果果选选中中“不不限限次次数数”复选框,表示一直不停地播放。复选框,表示一直不停地播放。网页编辑7/20/202439计算机文化基础 目 录上一页下一页 结 束2)“格式格式”属性属性 要要设设置置网网页页的的背背景景、颜颜色色,可可以以使使用用“网网页页属性属性”对话框的对话框的“格式格式”选项卡,如下图所示。选项卡,如下图所示。 用用户户可可以以选选中中“背背景景图图片片”复复选选框框,指指定定一一个个图图片片作作为为网网页页的的背背景景图图片片。如如果果要要将将图图片片按按水水印印形形式式添添加加
44、,需需要要选选中中“使使其其成成为为水水印印”复复选选框框。通通过过单单击击相相应应的的下下拉拉列列表表框框,可可以以设设置置网网页页的的背背景景颜颜色色、文文本本颜颜色色以以及及超超链链接接文文字字的的颜颜色色。当当同同时时设设置置背背景景图图片片和和背背景景颜颜色色时时,背背景图片将覆盖背景色。景图片将覆盖背景色。返 回网页编辑7/20/202440计算机文化基础 目 录上一页下一页 结 束9.3.3 插入对象1.插入水平线插入水平线2.插入图片插入图片3.插入字幕插入字幕4.插入交互式按钮插入交互式按钮 5.插入站点计数器插入站点计数器 返 回7/20/202441计算机文化基础 目 录
45、上一页下一页 结 束1.插入水平线插入水平线 在在网网页页中中输输入入文文本本内内容容后后,还还可可在在不不同同的的段段落落、行行之之间间添添加加水水平平线线,水水平平线线将将网网页页分分割割成成几几个个部部分分,使使得得网网页页更更具条理性。具体操作步骤如下:具条理性。具体操作步骤如下: (1)在准备插入水平线的位置设置插入点;)在准备插入水平线的位置设置插入点; (2)单单击击“插插入入”菜菜单单的的“水水平平线线”命命令令,插插入入水水平平线。线。 要要修修改改水水平平线线的的外外观观,可可以以双双击击水水平平线线,打打开开“水水平平线线属属性性”对对话话框框。“宽宽度度”框框用用于于设
46、设置置水水平平线线的的宽宽度度,“高高度度”框框用用于于设设置置水水平平线线的的高高度度,“对对齐齐方方式式”用用于于设设置置水水平平线线在在网网页页内内水水平平对对齐齐的的方方式式,“颜颜色色”列列表表框框用用于于设设置置水水平平线线的的颜颜色色,选选中中“实实线线(无无阴阴影影)”复复选选框框时时,水水平平线线将将被被设设成成实实心心线线。要要为为线线条条指指定定自自定定义义样样式式或或其其他他格格式式,可以使用可以使用“样式样式”按钮进行设置。按钮进行设置。返 回7/20/202442计算机文化基础 目 录上一页下一页 结 束2. 插入图片插入图片 图片可以使网页变得生动活泼,并能吸引用
47、户的注意。图片可以使网页变得生动活泼,并能吸引用户的注意。1)图片文件的格式)图片文件的格式 在在WWW上上常常用用的的图图像像文文件件格格式式是是JPEG和和GIF,它它们们都都是是压压缩缩的的图图像像格格式式,文文件件的的信信息息量量小小,适适合合于于网网络络传传输输,因因此被广泛地应用在此被广泛地应用在Web站点的设计中。站点的设计中。GIF(Graphical Interchange Format,图图形形交交换换格格式式)采采用用无无损损压压缩缩方方式式,其其主主要要特特征征是是支支持持动动画画、透透明明度度、图图形形渐进,但渐进,但GIF图像包含的颜色不能超过图像包含的颜色不能超过
48、256种。种。JPEG(Joint Photograph Expert Group,联联合合图图像像专专家家组组)格格式式是是专专为为有有几几百百万万种种颜颜色色的的照照片片和和图图形形设设计计的的,它它采采用用有有损损压压缩缩方方式式,以以牺牺牲牲图图片片质质量量换换取取大大的的压压缩缩比比例例。JPEG格格式式支支持持真真彩彩色色(24位位色色),并并且且在在压压缩缩大大的的图图像像方方面面已已被证明很有效。被证明很有效。7/20/202443计算机文化基础 目 录上一页下一页 结 束2. 插入图片插入图片2)插入图片的步骤)插入图片的步骤(1)移动光标至插入图像的位置;)移动光标至插入图
49、像的位置;(2)单单击击“插插入入”菜菜单单的的“图图片片”命命令令,在在子子菜菜单单中中选选择择“来来自自文文件件”,弹弹出出“图图片片”对对话话框;框;(3)利利用用“图图片片”对对话话框框选选取取需需要要插插入入的的图图片片文文件件,单单击击“插插入入”按按钮钮,即即可可将将图图片片插插入入网网页中。页中。3)设置图片属性)设置图片属性 在在“图图片片属属性性”对对话话框框的的“外外观观”选选项项卡卡中中,可以设置图片的环绕方式、布局、大小等。可以设置图片的环绕方式、布局、大小等。插入图片插入图片7/20/202444计算机文化基础 目 录上一页下一页 结 束4)编辑图片)编辑图片可可以
50、以使使用用“视视图图”菜菜单单的的“工工具具栏栏”命命令令中中的的“图图片片”子子命命令令,使使“图图片片”工工具具栏栏显显示示在在屏屏幕幕上上。利利用用图图片片工工具具栏栏,可可以以对对图图片片的的亮亮度度、对对比比度度进进行行调调整整,可可以以旋旋转转、翻翻转转图图片片,对对图图片进行剪裁,设置透明颜色等操作。片进行剪裁,设置透明颜色等操作。5)保存图片)保存图片插插入入图图片片后后保保存存网网页页,如如果果图图片片不不在在网网站站文文件件夹夹中中,将将出出现现“保保存存嵌嵌入入式式文文件件”对对话话框框。如如果图片在网站文件夹中,就不会出现此对话框。果图片在网站文件夹中,就不会出现此对话
51、框。返 回插入图片插入图片7/20/202445计算机文化基础 目 录上一页下一页 结 束3. 插入字幕 在在制制作作网网页页时时,可可以以将将网网页页中中的的文文字字做做成成由由左左至至右右,或或由由右右至至左左移移动动的的动动态态效效果果,使使网网页页更更加加形形象象生生动动。具体操作步骤如下:具体操作步骤如下: (1)将将插插入入点点设设置置在在要要插插入入移移动动字字幕幕的的位位置置或或者者选选中中作作为为移移动动字字幕幕的的文文本本,单单击击“插插入入”菜菜单单的的“Web组组件件”命命令令,弹弹出出“插插入入Web组组件件”对对话话框框,在在对对话话框框的的“组组件件类类型型”列列
52、表表框框中中选选择择“动动态态效效果果”,在在“选选择择一一种种效效果果”列列表表中中选选择择“字字幕幕”,单单击击“完完成成”按按钮,钮, “字幕属性字幕属性”对话框。对话框。7/20/202446计算机文化基础 目 录上一页下一页 结 束(2)如如果果已已经经选选择择了了作作为为移移动动字字幕幕的的文文本本,此此文文本本就就会会出出现现在在“文文本本”框框中中,如如果果没没有有选选择择文文本本,可可在在“文文本本”框框中中输输入入作作为为移移动动字字幕幕的的文文本本。 “字字幕幕属性属性”对话框如下图所示:对话框如下图所示: 插入字幕插入字幕27/20/202447计算机文化基础 目 录上
53、一页下一页 结 束 (3)“方方向向”区区域域用用于于指指定定文文本本的的移移动动方方向向。“速速度度”区区域域用用于于指指定定文文字字的的滚滚动动速速度度,“延延迟迟”框框中中的的数数值值表表示示字字幕幕滚滚动动一一步步的的时时间间间间隔隔是是多多少少毫毫秒秒,“数数量量”框框中中的的数数值值表表示示字字幕幕滚滚动动一一步步的的距距离离是是多多少少像像素素。“表表现现方方式式”区区域域用用于于指指定定文文字字的的表表现现方方式式。选选中中“重重复复”区区域域的的“连连续续”复复选选框框,移移动动字字幕幕将将连连续续滚滚动动;若若要要设设置置字字幕幕滚滚动动有有限限次次数数,可可以以取取消消选
54、选中中“连连续续”复选框并输入字幕重复的次数。复选框并输入字幕重复的次数。 (4)单击)单击“确定确定”按钮,即可插入字幕。按钮,即可插入字幕。返 回插入字幕插入字幕37/20/202448计算机文化基础 目 录上一页下一页 结 束4. 插入交互式按钮交交互互式式按按钮钮是是一一个个动动态态按按钮钮,当当用用户户将将鼠鼠标标指指向向交交互互式式按按钮钮时时,交交互互式式按按钮钮会会改改变变颜颜色色或或形形状状。默默认认情情况况下下,交交互互式式按按钮钮是是一一个个带带有有彩彩色色方方框的文字按钮,也可以应用图片创建交互式按钮。框的文字按钮,也可以应用图片创建交互式按钮。(1)将将插插入入点点设
55、设置置在在要要插插入入交交互互式式按按钮钮的的位位置置,单单击击“插插入入”菜菜单单的的“Web组组件件”命命令令,打打开开“插插入入Web组组件件”对对话话框框,在在对对话话框框的的“组组件件类类型型”列列表表框框中中选选择择“动动态态效效果果”,在在“选选择择一一种种效效果果”列列表表中中选选择择“交交互互式式按按钮钮”,单单击击“完完成成”按钮,打开对话框。按钮,打开对话框。7/20/202449计算机文化基础 目 录上一页下一页 结 束(2)设置)设置按钮按钮字体字体图像图像(3)单击)单击“确定确定”按钮,即可插入交互式按钮。按钮,即可插入交互式按钮。 返 回插入交互式按钮插入交互式
56、按钮2-37/20/202450计算机文化基础 目 录上一页下一页 结 束5. 插入站点计数器插入站点计数器 (1)单单击击“插插入入”菜菜单单的的“Web组组件件”命命令令,打打开开“插插入入Web组组件件”对对话话框框,在在对对话话框框的的“组组件件类类型型”列列表表框框中中选选择择“计计数数器器”,在在“选选择择计计数数器器样样式式”列列表表中中选选择择一一种种样样式式,单单击击“完成完成”按钮,打开按钮,打开“计数器属性计数器属性”对话框;对话框; (2)设置计数器属性;)设置计数器属性; (3)单击)单击“确定确定”按钮,插入站点计数器。按钮,插入站点计数器。返 回7/20/2024
57、51计算机文化基础 目 录上一页下一页 结 束9.3.4 创建超链接Web网网页页的的强强大大之之处处就就在在于于其其超超链链接接,使使用用超超链链接接能能够够将将Internet中中的的信信息息有有机机地地组组织织起起来来,使使人人们们在在丰丰富富多多彩彩的的WWW世世界界轻轻松松地地漫漫游游。在在浏浏览览器器中中,超超链链接接通通常常表表现现为为与与普普通通文文本本或或图图片片不不同同的的特特点点。将将鼠鼠标标移移到到一一个个超超链链接接上上方方时时,鼠鼠标标指指针针会会变变成成手手形形。同同时时,与与这这个个超超链链接接相相对对应应的的URL会会在在窗窗口口底底部的状态栏显示出来。部的状
58、态栏显示出来。 7/20/202452计算机文化基础 目 录上一页下一页 结 束创建超链接1. 创建文本超链接创建文本超链接2. 创建图片超链接创建图片超链接3. 使用书签超链接使用书签超链接4. 创建电子邮件超链接创建电子邮件超链接5. 创建下载文件超链接创建下载文件超链接返 回7/20/202453计算机文化基础 目 录上一页下一页 结 束1. 创建文本超链接文文本本超超链链接接是是指指在在文文本本上上定定义义的的超超链链接接,单单击击文文本本超超链链接接,会会自自动动跳跳转转到到指指向向的的链链接接目目标标。创创建建文文本本超超链链接的具体操作步骤如下:接的具体操作步骤如下:(1)选选定
59、定要要定定义义超超链链接接的的文文本本,从从“插插入入”菜菜单单中中选选择择“超超链链接接”命命令令,或或单单击击“常常用用”工工具具栏栏上上的的“超超链链接接”按按钮钮 ,打打开开“插插入入超超链链接接”对对话话框框,如如下下图图所所示;示;7/20/202454计算机文化基础 目 录上一页下一页 结 束 (2)在在“插插入入超超链链接接”对对话话框框中中选选择择要要链链接接的的目目标标网网页页,单单击击“确确定定”按按钮钮,插插入入超超链链接接,可可以以看看到到所所选选定定的的文文本本变变为为蓝蓝色色,并并且且带带有有下下划划线线,说说明明选选定定的文本已经被设置为超链接文本。的文本已经被
60、设置为超链接文本。 保保存存网网页页,在在浏浏览览器器中中预预览览效效果果,当当鼠鼠标标移移至至链链接接文文字字时时,鼠鼠标标指指针针变变成成手手形形,此此时时单单击击鼠鼠标标就就跳跳转转到目标网页。到目标网页。创建文本超链接创建文本超链接7/20/202455计算机文化基础 目 录上一页下一页 结 束 图图片片超超链链接接是是指指在在图图片片上上创创建建的的超超链链接接,图图片片超超链链接接比比文文本本超超链链接接显显得得更更加加生生动动活活泼泼,单单击击图图片片超超链链接接,会会自自动动跳跳转转到到指指向向的的链链接接目目标标。可可以以将将整整个个图图片片设设置置为为超超链链接接,也也可可
61、以以为为图图片片分分配配一一个个或或多多个个热热点点。热热点点是是图图片片上上的的超超链链接接区区域域,包包含含热热点点的的图图片片称称为为图图像像映映射射,用用户户单单击击热热点点区区域可以转到相应的链接目标。域可以转到相应的链接目标。2. 创建图片超链接创建图片超链接7/20/202456计算机文化基础 目 录上一页下一页 结 束 (1)选选定定要要定定义义超超链链接接的的图图片片,从从“插插入入”菜菜单单中中选选择择“超超链链接接”命命令令,或或单单击击“常常用用”工工具具栏栏上上的的“超超链链接接”按按钮钮,打打开开“插插入入超超链链接接”对话框;对话框; (2)在在对对话话框框中中选
62、选择择要要链链接接的的目目标标网网页页,单单击击“确定确定”按钮,即可插入超链接。按钮,即可插入超链接。 保保存存网网页页,在在浏浏览览器器中中预预览览效效果果,当当鼠鼠标标移移至至链链接接图图片片时时,鼠鼠标标指指针针变变成成手手形形,此此时时单单击击鼠鼠标就跳转到目标网页。标就跳转到目标网页。1)创建图片超链接)创建图片超链接7/20/202457计算机文化基础 目 录上一页下一页 结 束 热热点点可可以以是是图图片片上上具具有有某某种种形形状状的的一一块块区区域域或或文文本本,当当用用户户单单击击该该区区域域或或文文本本时时,超超链链接接目目标标会会显显示示在在Web浏浏览览器器中中。在
63、在FrontPage 2003中中,热点的形状可以是长方形、圆形或多边形。热点的形状可以是长方形、圆形或多边形。 例例如如我我们们通通过过山山东东省省地地图图浏浏览览山山东东省省各各城城市市的的民民俗俗风风情情,当当鼠鼠标标移移至至地地图图上上的的各各个个城城市市时时,鼠鼠标标指指针针变变为为手手形形,单单击击后后打打开开描描述述该该城城市市民民俗俗风风情的页面。情的页面。2)为图片添加热点)为图片添加热点7/20/202458计算机文化基础 目 录上一页下一页 结 束为图片添加热点,具体操作步骤如下:为图片添加热点,具体操作步骤如下: (1)选择需要添加热点的图片。)选择需要添加热点的图片。
64、 (2)在在“图图片片”工工具具栏栏中中,单单击击长长方方形形、圆圆形形或多边形热点按钮匹配需要的形状。或多边形热点按钮匹配需要的形状。 (3)在在图图片片上上,采采用用鼠鼠标标拖拖动动操操作作画画出出所所选选形形状状。画画多多边边形形时时,可可单单击击多多边边形形的的第第一一个个角角,然然后后依依次次单单击击多多边边形形其其他他角角的的位位置置,最最后后双双击击完完成成多多边边形。形。 (4)释释放放鼠鼠标标,弹弹出出“插插入入超超链链接接”对对话话框框,按照插入超链接中所讲方法创建超链接即可。按照插入超链接中所讲方法创建超链接即可。7/20/202459计算机文化基础 目 录上一页下一页
65、结 束为图片添加热点 重重复复步步骤骤(2)、(3)、(4),在在图图片片上上依依次次创创建建超超链链接接到到其其他他网网页页。当当鼠鼠标标移移动动到到热热点点区区域域时时,光光标标变变为为手手形形,如如下下图图所所示示。单单击击鼠鼠标标,超超链链接接的的目目标标网网页就会显示在页就会显示在Web浏览器窗口中。浏览器窗口中。返 回7/20/202460计算机文化基础 目 录上一页下一页 结 束3. 使用书签超链接对对于于网网页页的的超超链链接接,往往往往使使用用户户跳跳转转到到目目标标网网页页的的顶顶端端,应应用用书书签签能能够够更更严严格格地地控控制制用用户户到到达达网网页页内内的的某某个个
66、具具体体位位置置。书书签签是是网网页页中中被被标标记记的的位位置置或或被被标标记记的的文文本本。单单击击书书签签超超链链接接,将将直直接接跳跳转转到到该该书书签签所所在的位置。在的位置。1)插入书签)插入书签(1)选中作为书签的文本,或)选中作为书签的文本,或将光标定位在要插入书签的位置。将光标定位在要插入书签的位置。(2)选择)选择“插入插入”菜单的菜单的“书书签签”命令,弹出命令,弹出“书签书签”对话框,对话框,如右图所示,所选文本自动出现如右图所示,所选文本自动出现在在“书签名称书签名称”框中。框中。(3)单击)单击“确定确定”按钮,插入按钮,插入书签,可以看到所选文本下方出书签,可以看
67、到所选文本下方出现虚线。现虚线。7/20/202461计算机文化基础 目 录上一页下一页 结 束2)创建书签超链接)创建书签超链接 (1)选定要定义超链接的文本或图片;)选定要定义超链接的文本或图片; (2)从)从“插入插入”菜单中选择菜单中选择“超链接超链接”命令,弹出命令,弹出“插入超插入超链接链接”对话框,如下图所示,在对话框的对话框,如下图所示,在对话框的“链接到链接到”栏单击栏单击“本本文档中的位置文档中的位置”,选择要链接的书签;,选择要链接的书签; (3)单击)单击“确定确定”按钮,插入书签超链接。按钮,插入书签超链接。 保存网页,在浏览器中预览效果,单击页面中的书签超链接,保存
68、网页,在浏览器中预览效果,单击页面中的书签超链接,页面会跳转到书签的位置。页面会跳转到书签的位置。7/20/202462计算机文化基础 目 录上一页下一页 结 束4. 创建电子邮件超链接创建电子邮件超链接 电电子子邮邮件件超超链链接接为为用用户户发发送送电电子子邮邮件件提提供供了了极极大大的的方方便便,单单击击电电子子邮邮件件超超链链接接后后,允允许许用用户户书书写写电电子子邮邮件件内内容,并发往指定的地址。具体操作步骤如下:容,并发往指定的地址。具体操作步骤如下: (1)选择作为电子邮件超链接的文本或图片;)选择作为电子邮件超链接的文本或图片; (2)从从“插插入入”菜菜单单中中选选择择“超
69、超链链接接”命命令令,弹弹出出“插入超链接插入超链接”对话框;对话框; (3)在在对对话话框框的的“链链接接到到”栏栏单单击击“电电子子邮邮件件地地址址”,在在“电电子子邮邮件件地地址址”框框中中输输入入所所需需电电子子邮邮件件地地址址,还还可以在可以在“主题主题”框中键入电子邮件的主题;框中键入电子邮件的主题; (4)单击)单击“确定确定”按钮,完成电子邮件超链接的创建。按钮,完成电子邮件超链接的创建。返 回7/20/202463计算机文化基础 目 录上一页下一页 结 束5. 创建下载文件超链接创建下载文件超链接 如如果果要要在在网网站站中中提提供供资资料料下下载载功功能能,就就需需要要创创
70、建建下下载载链链接接,网网站站中中每每个个用用于于下下载载的的文文件件要要对对应应一一个个下下载载链链接接。具具体体操操作作步骤如下:步骤如下: (1)选择作为文件超链接的文本或图片;)选择作为文件超链接的文本或图片; (2)从从“插插入入”菜菜单单中中选选择择“超超链链接接”命命令令,弹弹出出“插插入超链接入超链接”对话对话 框,在对话框中选择要下载的文件;框,在对话框中选择要下载的文件; (3)单击)单击“确定确定”按钮,完成文件超链接的创建。按钮,完成文件超链接的创建。 保保存存网网页页,在在浏浏览览器器中中预预览览效效果果,单单击击创创建建的的文文件件超超链链接接时时,弹弹出出“文文件
71、件下下载载”对对话话框框,如如下下图图所所示示,用用户户可可以以根根据据需要打开或保存文件。需要打开或保存文件。返 回7/20/202464计算机文化基础 目 录上一页下一页 结 束9.4 网网 页页 布布 局局 网网页页的的布布局局设设计计,是是将将文文字字、图图片片等等网网页页元元素素,根根据据特特定定的的内内容容和和主主题题,在在网网页页所所限限定定的的范范围围中中进进行行视视觉觉的的关关联联与与配配置置,从从而而将将设设计计意意图图以以视视觉觉形形式式表表现现出出来来。网网页页的的布布局局一一般般使使用用表格或框架来实现。表格或框架来实现。7/20/202465计算机文化基础 目 录上
72、一页下一页 结 束9.4 网网 页页 布布 局局9.4.1 创建和使用表格创建和使用表格9.4.2 创建框架创建框架9.4.3 创建框架超链接创建框架超链接返 回7/20/202466计算机文化基础 目 录上一页下一页 结 束9.4.1 创建和使用表格创建和使用表格 表表格格由由单单元元格格构构成成的的行行和和列列组组成成,单单元元格格中中可可以以插插入入文文本本、图图片片以以及及其其他他对对象象。利利用用表表格格可可以以有有条条理理地地排排列列数数据据或或组组织织网网页页布布局局。表表格格的的行行、列列和和单单元元格格都都可可以以进进行行复复制制、粘粘贴贴,在在表表格格中中还还可可以以插插入
73、入表表格格,一一层层层层的的表表格格嵌嵌套套使使设设计计更更加加方方便便。FrontPage 2003提提供供了了与与Word字字处处理理软软件件类类似似的的表表格格处处理理功功能能,在在网网页页中中可可以轻松地创建和编辑表格。以轻松地创建和编辑表格。7/20/202467计算机文化基础 目 录上一页下一页 结 束1. 创建表格创建表格有以下三种常用方法:创建表格有以下三种常用方法: (1)使使用用“表表格格”菜菜单单的的“插插入入”子子菜菜单单中中的的“表表格格”命命令令,可可以以对对插插入入的的表表格格进进行行精精确确的的设设置置,包包括括行行和和列列的的数数目目、对对齐齐方方式式、单单元
74、元格格间间距距、单元格衬距、边框粗细和背景等。单元格衬距、边框粗细和背景等。 (2)使使用用“常常用用”工工具具栏栏的的“插插入入表表格格”按按钮钮 ,快速插入表格。,快速插入表格。 (3)使使用用“表表格格”菜菜单单的的“绘绘制制表表格格”命命令令,手动绘制表格。手动绘制表格。7/20/202468计算机文化基础 目 录上一页下一页 结 束2. 设置表格属性设置表格属性 插插入入表表格格后后,打打开开如如下下图图所所示示的的“表表格格属属性性”对对话话框框,可可以设置表格属性。以设置表格属性。(1)设置表格行数和列数。)设置表格行数和列数。(2)设置表格布局,包括设)设置表格布局,包括设置表
75、格的对齐方式、浮动、置表格的对齐方式、浮动、宽度等。宽度等。(3)在)在“粗细粗细”数值框中输数值框中输入数值,即可设置表格边框入数值,即可设置表格边框的粗细。的粗细。(4)在背景区域,可以通过)在背景区域,可以通过“颜色颜色”框设置单一色彩的框设置单一色彩的表格背景,也可选中表格背景,也可选中“使用使用背景图片背景图片”复选框,用复选框,用“浏浏览览”按钮设置图片作为表格按钮设置图片作为表格的背景。的背景。7/20/202469计算机文化基础 目 录上一页下一页 结 束3. 设置单元格属性设置单元格属性 将将光光标标放放置置在在需需要要设设置置属属性性的的单单元元格格中中,使使用用“表表格格
76、”菜菜单单的的“表表格格属属性性”子子菜菜单单中中的的“单单元元格格”命命令令,打打开开如如下下图所示的图所示的“单元格属性单元格属性”对话框,设置单元格属性。对话框,设置单元格属性。 在在“背景背景”区域中可以设置单元格的背景颜色,或使用图区域中可以设置单元格的背景颜色,或使用图片作为背景。片作为背景。 在在“布局布局”区域可区域可以设置水平、垂直对齐以设置水平、垂直对齐方式,指定宽度、高度、方式,指定宽度、高度、标题单元格,设置行跨标题单元格,设置行跨距、列跨距等。距、列跨距等。 在在“边框边框”区域中区域中可以设置单元格边框的可以设置单元格边框的颜色、亮边框、暗边框。颜色、亮边框、暗边框
77、。7/20/202470计算机文化基础 目 录上一页下一页 结 束创创建建表表格格后后,可可以以对对表表格格单单元元格格、行行和和列列的的布布局局和和结结构构进进行行调调整整,以以满满足足不不同同的的需需要要。如如调调整整行行、列列或或单单元元格格;插插入入行行、列列或或单单元元格格;删删除除行行、列列或或单单元元格格;合合并并、拆拆分分单单元元格格;平平均均分分布布行高、列宽;设置单元格属性等。行高、列宽;设置单元格属性等。返 回4. 调整表格调整表格7/20/202471计算机文化基础 目 录上一页下一页 结 束9.4.2 创建框架创建框架 框框架架的的使使用用是是进进行行网网页页布布局局
78、设设计计的的一一种种重重要要手手段段。框框架架将将浏浏览览器器窗窗口口划划分分为为几几个个区区域域,每每个个框框架架中中都都可可以以显显示示一一个个独独立立的的网网页页。浏浏览览器器窗窗口口中中显显示示的的网网页页实实际际是是这这些些框框架架的的集集合合,因因此此被被称称为为框框架架网网页页。框框架架网网页页并并不不包包含含显显示示的的内内容容,只只是是记记录录了了该该框框架架网网页页包包含含几几个个框框架架、其其拆拆分分方方式式以以及及每每个个框框架架中中显显示示哪哪个个网网页页(与与其他网页的超链接)等。其他网页的超链接)等。7/20/202472计算机文化基础 目 录上一页下一页 结 束
79、 在在FrontPage 2003中中,可可以以使使用用框框架架网网页页布布局局模板轻松创建框架网页。具体操作步骤如下:模板轻松创建框架网页。具体操作步骤如下: (1)单单击击“文文件件”菜菜单单的的“新新建建”命命令令,在在“新新建建”任任务务窗窗格格中中选选择择“新新建建网网页页”中中的的“其其他他网页模板网页模板”。 (2)在在弹弹出出的的“网网页页模模板板”对对话话框框中中,切切换换到到“框框架架网网页页”选选项项卡卡,选选择择所所需需的的模模板板,如如“目目录录”模模板板,可可在在“说说明明”及及“预预览览”区区域域查查看看该该模板的说明及预览图。模板的说明及预览图。1. 创建框架网
80、页创建框架网页7/20/202473计算机文化基础 目 录上一页下一页 结 束 (3)单击“确定”按钮,完成框架网页的创建,如下图所示; (4)每每个个框框架架中中,单单击击“设设置置初初始始网网页页”按按钮钮可可以以建建立立与与已已经经存存在在网网页页的的超超链链接接,从从而而在在此此框框架架中中显显示示该该网网页页;单单击击“新建网页新建网页”按钮可以建立显示在该框架中的新网页。按钮可以建立显示在该框架中的新网页。 创建框架网页创建框架网页在该图窗口底部新在该图窗口底部新增了增了“无框架无框架”视视图模式,可以为不图模式,可以为不支持框架的浏览器支持框架的浏览器创建替代网页。创建替代网页。
81、7/20/202474计算机文化基础 目 录上一页下一页 结 束 保保存存框框架架网网页页需需要要保保存存框框架架和和各各个个框框架架中中的的网网页页。例例如如,使使用用“目目录录”模模板板创创建建的的框框架架网网页页需需要要保保存存作作为为容容器器的的框框架架网网页页和和分分别别显显示示在在两两个个框框架架中中的的两两个个网网页页。具具体体操操作作步步骤如下:骤如下: (1)使使用用“文文件件”菜菜单单的的“保保存存”命命令令,或或单单击击“常常用用”工具栏的工具栏的“保存保存”按钮,弹出按钮,弹出“另存为另存为”对话框。对话框。 (2)在在“另另存存为为”对对话话框框右右边边的的框框架架网
82、网页页预预览览图图中中,深深蓝蓝色色的的区区域域或或边边框框指指明明了了框框架架中中正正在在保保存存的的网网页页。进进行行相相应设置后,单击应设置后,单击“保存保存”按钮,该网页保存完毕。按钮,该网页保存完毕。 (3)重重复复步步骤骤(2),直直至至所所有有的的框框架架网网页页都都保保存存完完毕毕,如如使使用用“目目录录”模模板板创创建建的的框框架架网网页页需需要要保保存存三三次次。如如果果某某个个框框架架网网页页通通过过单单击击“设设置置初初始始网网页页”按按钮钮建建立立与与已已经经存存在在网网页页的的超超链链接接,则则不不会会弹弹出出“另另存存为为”对对话话框框保保存存该该网页。网页。2.
83、 保存框架网页保存框架网页7/20/202475计算机文化基础 目 录上一页下一页 结 束 当当使使用用模模板板创创建建的的框框架架结结构构不不能能满满足足需需要要时时,可可以以通通过过拆拆分分框框架架制制作作出出更更为为复复杂杂的的框框架架网网页页。具具体体操操作作步骤如下步骤如下: (1)选选择择要要拆拆分分的的框框架架,在在“框框架架”菜菜单单中中选选择择“拆分框架拆分框架”命令,打开命令,打开“拆分框架拆分框架”对话框;对话框; (4)根根据据需需要要选选择择“拆拆分分为为列列”或或“拆拆分分成成行行”选选项,单击项,单击“确定确定”按钮完成拆分。按钮完成拆分。 也可按住也可按住Ctr
84、l键拖动框架的边框实现拆分框架键拖动框架的边框实现拆分框架。3. 拆分框架拆分框架7/20/202476计算机文化基础 目 录上一页下一页 结 束可可以以从从框框架架结结构构中中删删除除指指定定的的框框架架。此此时时系系统统只只是是把把框框架架从从框框架架网网页页中中删删去去,而而此此框框架架中中的的网网页页文文件件仍仍然然存存在在。删删除除了了一一个个框框架架后后,其其余余框框架架会会加加宽宽以以填填充充删删除除框框架架留留下下的的空空间间。若若框框架架网网页页只只有有一一个个框框架架,则则不不能能删删除除该该框框架架。删删除除框框架架的的具具体体操操作作方方法法是是:选选择择要要删删除除的
85、的框框架架,在在“框框架架”菜单中选择菜单中选择“删除框架删除框架”命令。命令。4. 删除框架删除框架7/20/202477计算机文化基础 目 录上一页下一页 结 束 在在框框架架网网页页中中可可以以设设置置框框架架的的大大小小、框框架架的的边边距距和和在在框框架架中中是是否否显显示示滚滚动动条条等等属属性性。具具体体操操作作方方法法是是:选选择择框框架架,从从“框框架架”菜菜单单中中选选择择“框框架架属属性性”命命令令,弹弹出出“框架属性框架属性”对话框,如右图所示。对话框,如右图所示。 在在“名称名称”框中输入新框中输入新的框架名称,即可对该框的框架名称,即可对该框架进行重命名。架进行重命
86、名。 在在“框架大小框架大小”区域区域中设置宽度和高度,可以中设置宽度和高度,可以改变框架的大小,也可用改变框架的大小,也可用鼠标拖动框架的边框直接鼠标拖动框架的边框直接调整框架的宽度和高度。调整框架的宽度和高度。返 回5. 设置框架属性设置框架属性7/20/202478计算机文化基础 目 录上一页下一页 结 束9.4.3 创建框架超链接创建框架超链接框架超链接的使用使网页之间的组织更加灵活、有效。框架超链接的使用使网页之间的组织更加灵活、有效。1. 创建框架超链接创建框架超链接 若要设置框架超链接,执行下列操作:若要设置框架超链接,执行下列操作:(1)选选择择要要创创建建超超链链接接的的文文
87、字字或或图图片片,从从“插插入入”菜菜单中选择单中选择“超链接超链接”命令,弹出命令,弹出“插入超链接插入超链接”对话框;对话框;(2)在在“插插入入超超链链接接”对对话话框框中中选选择择要要链链接接的的目目标标网网页,单击页,单击“目标框架目标框架”按钮,出现按钮,出现“目标框架目标框架”对话框;对话框;(3)在在“当当前前框框架架网网页页”区区域域中中单单击击要要用用作作目目标标的的框框架架,单单击击“确确定定”按按钮钮,返返回回到到“插插入入超超链链接接”对对话话框框,在在对对话话框框底底部部标标签签“目目标标框框架架”后后显显示示设设置置的的目目标标框框架架名称;名称;(4)单击)单击
88、“确定确定”按钮,完成框架超链接的创建。按钮,完成框架超链接的创建。7/20/202479计算机文化基础 目 录上一页下一页 结 束2. 使用特殊的目标框架使用特殊的目标框架 在在指指定定目目标标框框架架时时,除除了了当当前前框框架架外外,还还提提供供了了一一些些特特殊殊的的框框架架来来创创建建不不同同效效果果的的目目标标框框架架。这这些些特特殊殊框框架架位位于于“目目标标框框架架”对对话话框框的的“公公用用的目标区的目标区”区域中,有以下几种:区域中,有以下几种:相相同同框框架架:将将链链接接的的网网页页显显示示在在包包含含该该超超链链接接的同一个框架内。的同一个框架内。整页:将框架展开为整
89、个窗口,显示链接网页。整页:将框架展开为整个窗口,显示链接网页。新新建建窗窗口口:打打开开另另外外一一个个新新窗窗口口,显显示示链链接接网网页。页。父父框框架架:在在当当前前框框架架的的上上层层框框架架内内显显示示链链接接网网页。页。返 回7/20/202480计算机文化基础 目 录上一页下一页 结 束9.5 创建表单页面 表表单单是是Web服服务务器器与与客客户户交交互互的的手手段段。表表单单的的作作用用就就是是收收集集用用户户的的输输入入信信息息,从从而而实实现现网网站站与与用用户户的的交交互互。例例如如,用用户户可可以以用用表表单单收收集集用用户户的的个个人人资资料料,也也可可以以用用表
90、表单单设设计计一一个个订订货货单单,让让用用户户指指定定要要购购买买的的商商品品名名称称、型型号号、数数量等。量等。7/20/202481计算机文化基础 目 录上一页下一页 结 束9.5 创建表单页面创建表单页面9.5.1 插入表单域插入表单域9.5.2 提交表单提交表单返 回7/20/202482计算机文化基础 目 录上一页下一页 结 束9.5.1 插入表单域 表表单单中中至至少少要要有有一一个个供供用用户户输输入入信信息息的的域域,一一个个用用来来把把信信息息发发送送给给服服务务器器的的“提提交交”按按钮钮,以以及及一一个个用用来来清清除除域域中中现现有有内内容容的的“重重置置”按按钮钮。
91、当当用用户户在在表表单单中中输输入入信信息息,单单击击“提提交交”按按钮钮后后,这这些些信信息息将将被被发发送送到到服服务务器器,服服务务器器端端程程序序将将对对这这些些信信息息进进行行处处理理。使使用用“插插入入”菜菜单单的的“表表单单”子子菜菜单单的的“表表单单”命命令令,将将插插入入一一个个非非常常简简单单的的表表单单。该该表表单单只只有有“提提交交”和和“重重置置”两两个个按按钮钮,但但这这是是所所有有复复杂杂表表单单的的基基础础,可可以以在在其其中中插插入入更更多多的的表表单单域域。在在FrontPage 2003中中,可可以以插插入入文文本本框框、文文本本区区、复复选选框框、选选项
92、项按按钮钮、分分组组框、下拉框、按钮、高级按钮等表单域。框、下拉框、按钮、高级按钮等表单域。7/20/202483计算机文化基础 目 录上一页下一页 结 束 文文本本框框用用于于让让用用户户输输入入一一行行文文字字。将将光光标标放放在在要要插插入入文文本本框框的的位位置置,使使用用“插插入入”菜菜单单的的“表表单单”命命令令,再再选选择择“文文本本框框”子子命命令令,即即可可插插入入一一个个文文本本框框,如如下图所示。下图所示。 打开打开“文本框属性文本框属性”对话框,可以设置文本框的属对话框,可以设置文本框的属性。性。 “文本框属性文本框属性”对话框中,对话框中,“名称名称”用来设置该文用来
93、设置该文本框的名称,本框的名称,“初始值初始值”用于设置文本框内一开始显示用于设置文本框内一开始显示的内容,的内容,“宽度宽度”用来设置文本框所能输入字符的个数,用来设置文本框所能输入字符的个数,“密码域密码域”用来设置是否让文本框内输入的字符可见。用来设置是否让文本框内输入的字符可见。 插入文本框时,若插入点在一个已有的表单内,就插入文本框时,若插入点在一个已有的表单内,就把一个新的文本框插入到这个表单中。若插入点在表单把一个新的文本框插入到这个表单中。若插入点在表单之外,则创建的文本框包含之外,则创建的文本框包含“提交提交”和和“重置重置”按钮。按钮。1. 插入文本框插入文本框7/20/2
94、02484计算机文化基础 目 录上一页下一页 结 束文文本本区区和和文文本本框框类类似似,都都用用于于输输入入文文本本,不不同同之之处处在在于于文文本本区区中中可可以以接接受受多多行行文文本本。当当文文本本区区中中输输入入内容较多时,可以拖动上下滚动条。内容较多时,可以拖动上下滚动条。将将光光标标放放在在要要插插入入文文本本区区的的位位置置,使使用用“插插入入”菜菜单单的的“表表单单”命命令令,再再选选择择“文文本本区区”子子命命令令,即即可插入一个文本区,如下图所示。可插入一个文本区,如下图所示。 文本区属性与文本框属性基本相同,还可以在文本区属性与文本框属性基本相同,还可以在“行数行数”框
95、中设置该文本区包含的文本行数。框中设置该文本区包含的文本行数。2. 插入文本区插入文本区7/20/202485计算机文化基础 目 录上一页下一页 结 束 复复选选框框是是提提供供给给用用户户的的一一个个选选项项,一一般般彼彼此此独独立立的的多多个个复复选选框框组组成成一一组组,用用户户可可以以在在其其中中任任意意选选择择,也也可可以以同同时时选选中中所所有有项,或一个都不选。项,或一个都不选。 将将光光标标放放在在要要插插入入复复选选框框的的位位置置,使使用用“插插入入”菜菜单单的的“表表单单”命命令令,再再选选择择“复复选选框框”子子命命令令,插插入入一一个个复复选选框框,最最后后在在复复选
96、选框框旁旁键键入入文文字字进进行行说说明明。如如果果需需要要插插入入多多个个复复选选框框,重重复以上操作即可。复以上操作即可。 “复选框属性复选框属性”对话框中,对话框中,“名称名称”用于设置复选框的名用于设置复选框的名称,称,“值值”用于返回用于返回复选框是否已选中,复选框是否已选中, “初始状态初始状态” 选项按钮组用于设置初始状态下该复选框是否被选中,选项按钮组用于设置初始状态下该复选框是否被选中,默认为默认为“未选中未选中”,“Tab键次序键次序”表示当按下表示当按下Tab键切换键切换输入焦点时,该复选框所在的次序。输入焦点时,该复选框所在的次序。3. 插入复选框插入复选框7/20/2
97、02486计算机文化基础 目 录上一页下一页 结 束 选选项项按按钮钮与与复复选选框框类类似似,不不同同的的是是一一组组选选项项按按钮钮只只能能选选中中其中的一个,其外形是圆的。其中的一个,其外形是圆的。 将将光光标标放放在在要要插插入入选选项项按按钮钮的的位位置置,使使用用“插插入入”菜菜单单的的“表表单单”命命令令,再再选选择择“选选项项按按钮钮”子子命命令令,插插入入一一个个选选项项按按钮钮,最最后后在在选选项项按按钮钮旁旁键键入入文文字字进进行行说说明明。如如果果需需要要插插入入多多个个选选项项按按钮钮,重重复复以以上上操操作作即即可可。如如下下图图所所示示,插插入入四四个个选项按钮供
98、用户评价自己的网页。选项按钮供用户评价自己的网页。 “选项按钮属性选项按钮属性”对话框中,对话框中,“组名称组名称”用来设置此选项用来设置此选项按钮所属组的名称,如果把多个选项按钮编成一组,必须使按钮所属组的名称,如果把多个选项按钮编成一组,必须使它们的组名称相同。它们的组名称相同。4. 插入选项按钮插入选项按钮7/20/202487计算机文化基础 目 录上一页下一页 结 束5. 插入分组框插入分组框 如如果果要要将将一一组组相相关关的的控控件件或或文文本本与与网网页页或或当当前前表表单单中中的其他信息分开,可以使用分组框。的其他信息分开,可以使用分组框。 将将光光标标放放在在要要插插入入分分
99、组组框框的的位位置置,使使用用“插插入入”菜菜单单的的“表表单单”命命令令,再再选选择择“分分组组框框”子子命命令令,即即可可插插入入分分组组框框。“分分组组框框属属性性”对对话话框框中中,“标标签签”用用来来设设置置分分组组框的名称。框的名称。“对齐对齐”用来设置分组框标签的对齐方式。用来设置分组框标签的对齐方式。6. 插入下拉框插入下拉框 下下拉拉框框用用于于从从一一个个列列表表中中选选择择一一项项或或几几项项。从从功功能能的的角角度度讲讲,可可以以用用一一组组复复选选框框或或一一组组单单选选按按钮钮来来实实现现,但但下下拉拉框占用的网页空间相对较小。框占用的网页空间相对较小。 将将光光标
100、标放放在在要要插插入入下下拉拉框框的的位位置置,使使用用“插插入入”菜菜单单的的“表表单单”命命令令,再再选选择择“下下拉拉框框”子子命命令令,即即可可插插入入下下拉拉框。框。 “下下拉拉框框属属性性”对对话话框框中中,单单击击“添添加加”按按钮钮,将将打打开开“添添加加选选项项”对对话话框框,可可以以设设置置选选项项名名称称,指指定定选选项项的的初初始始状态是选中还是未选中。状态是选中还是未选中。7/20/202488计算机文化基础 目 录上一页下一页 结 束7插入按钮和高级插入按钮和高级按钮按钮 一一个个表表单单中中至至少少要要有有一一个个“提提交交”按按钮钮和和一一个个“重重置置”按按钮
101、钮。“提提交交”按按钮钮的的作作用用是是把把表表单单中中的的数数据据提提交交给给Web服服务务器器的的表表单单处处理理程程序序,“重重置置”按按钮钮的的作作用是把表单中的数据清空,以便重新填写。用是把表单中的数据清空,以便重新填写。将将光光标标放放在在要要插插入入按按钮钮的的位位置置,使使用用“插插入入”菜菜单单的的“表表单单”命命令令,再再选选择择“按按钮钮”子子命命令令,即即可可插插入入按按钮钮。在在“按按钮钮属属性性”对对话话框框中中可可以以设设置置按按钮钮的的名名称称、值值/标标签签、按按钮钮类类型型等等属属性性。按按钮钮可可以以设设置置为为“提提交交”、“重重置置”或或普普通通按按钮
102、钮,对对于于“提提交交”和和“重重置置”按按钮钮来说,它们的动作是默认的。来说,它们的动作是默认的。 高高级级按按钮钮的的插插入入与与属属性性设设置置与与普普通通按按钮钮基基本本相相同同,但是高级按钮具备更加精确的控制按钮属性的能力。但是高级按钮具备更加精确的控制按钮属性的能力。返 回7/20/202489计算机文化基础 目 录上一页下一页 结 束9.5.2 提交表单 用用户户结结束束表表单单操操作作后后,单单击击“提提交交”按按钮钮,当当“提提交交”按按钮钮设设置置了了表表单单结结果果送送至至何何处处后后可可以以正正常常处处理理。表表单单处处理理程程序序对对表表单单的的处处理理可可以以是是将
103、将表表单单结结果果保保存存为为文文件件,或或将将表单结果发送至一个电子邮件地址。表单结果发送至一个电子邮件地址。1. 1. 将表单结果保存为文件将表单结果保存为文件 在在表表单单上上单单击击鼠鼠标标右右键键,在在弹弹出出的的右右键键菜菜单单中中选选择择“表单属性表单属性”命令,打开命令,打开“表单属性表单属性”对话框,如下图所示。对话框,如下图所示。7/20/202490计算机文化基础 目 录上一页下一页 结 束2. 将表单结果发送至电子邮件将表单结果发送至电子邮件 也也可可以以使使用用电电子子邮邮件件发发送送表表单单结结果果,当当用用户户提提交交表表单单时时,就会向指定的电子邮件地址发送一个
104、包含表单结果的邮件。就会向指定的电子邮件地址发送一个包含表单结果的邮件。 打打开开“表表单单属属性性”对对话话框框,在在“电电子子邮邮件件地地址址”框框中中,输输入入要要向向其其发发送送表表单单结结果果的的电电子子邮邮件件地地址址。如如果果只只想想用用电电子子邮邮件件发发送送表表单单结结果果,而而不不想想将将其其保保存存到到文文件件中中,可可以以清清除除文文本本框框“文文件件名名称称”。单单击击“选选项项”按按钮钮,在在“电电子子邮邮件件结结果果”选选项项卡卡中中可可以以设设置置接接收收结结果果的的电电子子邮邮件件地地址址、电电子子邮邮件件格格式式、邮件标题等选项。邮件标题等选项。 要要使使用
105、用FrontPage默默认认的的表表单单处处理理程程序序,Web服服务务器器必必须须安安装装FrontPage服服务务器器扩扩展展(FrontPage Server Extension),否否则则表表单单功功能能将将不不会会产产生生任任何何效效用用。要要将将表表单单结结果果发发送送至至电电子邮件,还需将服务器配置为可发送电子邮件的服务器。子邮件,还需将服务器配置为可发送电子邮件的服务器。返 回7/20/202491计算机文化基础 目 录上一页下一页 结 束9.6 网页的发布9.6.1 网站和网页的设计原则网站和网页的设计原则9.6.2 网站的发布和维护网站的发布和维护返 回7/20/20249
106、2计算机文化基础 目 录上一页下一页 结 束9.6.1 网站和网页的设计原则 网网站站和和网网页页的的设设计计既既是是一一项项复复杂杂的的技技术术也也是是一一门门艺艺术术,设设计计良良好好的的网网站站不不但但可可以以提提供供丰丰富富的的信信息息,而而且且还还能能给给用用户户带带来来愉愉悦的浏览体验。以下是网站和网页设计的一些基本原则。悦的浏览体验。以下是网站和网页设计的一些基本原则。1)目标明确,重点突出)目标明确,重点突出 首首先先要要明明确确信信息息发发布布者者的的性性质质与与用用途途,并并了了解解主主要要浏浏览览对对象象及及其其要要进进行行的的操操作作,做做到到有有的的放放矢矢。然然后后
107、,对对发发布布的的信信息息要要分分清清主主次次,面面面面俱俱到到可可能能使使浏浏览览者者难难以以找找到到有有用用的的信信息息,不不能能达达到预期目的。到预期目的。2)主题鲜明,层次清晰)主题鲜明,层次清晰 要要做做到到主主题题鲜鲜明明,首首先先要要设设计计好好网网站站的的主主页页。主主页页的的设设计计要要简简洁洁,内内容容不不宜宜过过多多,应应该该在在主主页页上上建建立立分分类类栏栏目目。网网页页需需要要有有层层次次清清晰晰的的结结构构,尤尤其其是是内内容容较较多多的的网网页页,可可以以根根据据内内容容进进行分类,分成多个栏目,便于阅读。行分类,分成多个栏目,便于阅读。7/20/202493计
108、算机文化基础 目 录上一页下一页 结 束网站和网页的设计原则网站和网页的设计原则3)合理设置栏目)合理设置栏目 制制作作网网页页前前,要要先先规规划划好好,确确定定合合理理的的栏栏目目和和板板块块。栏栏目目的的安安排排要要紧紧扣扣主主题题,既既要要考考虑虑网网页页内内容容的的分分类类,又又要要方方便便浏浏览览,并并能能对对浏浏览览者者起起到到较较好好的的导导航作用。航作用。4)正确定位整体风格)正确定位整体风格 网网站站的的整整体体风风格格是是指指站站点点的的整整体体形形象象给给浏浏览览者者的的综综合合感感受受。整整体体风风格格是是非非常常抽抽象象的的概概念念,包包括括网网站站的的标标志志、色
109、色彩彩、字字体体、标标语语、版版面面布布局局、内内容容价价值值等等诸诸多多因因素素,需需要要结结合合整整个个站站点点进进行行定定位位。对对于于栏栏目目内内容容跨跨度度较较大大的的网网站站,可可以以考考虑虑针针对对不不同同栏栏目目采采用不同的风格。用不同的风格。7/20/202494计算机文化基础 目 录上一页下一页 结 束5)页面布局合理)页面布局合理 网网页页设设计计要要针针对对所所要要表表达达的的信信息息进进行行合合理理的的布布局局,好好的的页页面面布布局局能能使使浏浏览览者者首首先先对对网网页页内内容容的的结结构构有有一一个个清清晰晰的的认认识识。可可以以使使用用表表格格辅辅助助页页面面
110、元元素素的的布布局局,也也可可以以使使用用特特定定的的布布局局框框架。页面布局要注意保证重点内容放置在屏幕的重点位置。架。页面布局要注意保证重点内容放置在屏幕的重点位置。6)色彩搭配,和谐统一)色彩搭配,和谐统一 色色彩彩是是影影响响整整体体风风格格的的关关键键因因素素。不不同同的的色色彩彩搭搭配配产产生生不不同同的的效效果果,并并可可能能影影响响到到浏浏览览者者的的情情绪绪。一一般般来来说说,一一个个网网站站的的标标准准色色彩彩以以不不超超过过三三、四四种种为为宜宜,以以便便使使页页面面色色彩彩丰丰富富而而又又协调统一。协调统一。7)多媒体功能使用得当)多媒体功能使用得当 除除了了文文字字信
111、信息息外外,网网站站中中图图片片、声声音音、动动画画以以及及视视频频等等多多媒媒体体信信息息的的使使用用也也是是网网页页上上重重要要的的内内容容。它它们们的的使使用用可可以以丰丰富富画画面面,使使页页面面更更加加形形象象生生动动。但但这这些些文文件件都都不不应应该该太太大大,减减少少网页的下载时间,提高用户浏览信息的速度。网页的下载时间,提高用户浏览信息的速度。 返 回网站和网页的设计原则网站和网页的设计原则7/20/202495计算机文化基础 目 录上一页下一页 结 束9.6.2 网站的发布和维护 所所谓谓发发布布网网站站,就就是是把把网网站站中中的的内内容容上上传传到到Web服服务务器器上
112、上。为为了了便便于于用用户户发发布布网网站站,FrontPage 2003提提供供了了相相当当方方便便的的发发布布工工具具。常常用用的的通通过过FTP发发布布网网站的操作步骤如下:站的操作步骤如下: (1)打打开开要要发发布布的的网网站站,从从“文文件件”菜菜单单中中选选择择“发发布布网网站站”命命令令,打打开开“远远程程网网站站属属性性”对对话话框框,如如下下图图所所示示。如如果果已已经经选选择择了了发发布布目目标标,则则该该对对话话框框不会出现。不会出现。7/20/202496计算机文化基础 目 录上一页下一页 结 束站点的发布和维护站点的发布和维护 (2)在在“远远程程Web服服务务器器
113、类类型型”中中选选择择FTP,然然后后在在下下方方的的“远远程程网网站站位位置置”框框中中输输入入远远程程网网站站的的位位置置。切切换换到到“发发布布”选项卡,可以进行发布网站的相应设置。选项卡,可以进行发布网站的相应设置。 (3)单单击击“确确定定”按按钮钮,FrontPage 会会尝尝试试连连接接指指定定的的FTP,如如果果需需要要相相应应的的用用户户名名和和密密码码,则则会会弹弹出出如如图图9-28所所示示的的“要求提供用户名和密码要求提供用户名和密码”对话框。对话框。 (4)输输入入用用户户名名和和密密码码,单单击击“确确定定”按按钮钮,FrontPage继继续工作。续工作。 (5)单击窗口右下角的)单击窗口右下角的“发布网站发布网站”按钮,开始发布网站按钮,开始发布网站. (6)文文件件传传送送完完毕毕,FrontPage显显示示状状态态“成成功功”,表表示示网网站已经成功发布。站已经成功发布。 通通过过HTTP方方式式上上传传网网页页与与通通过过FTP方方式式非非常常类类似似。需需要要注注意意的的是是,通通过过HTTP方方式式上上传传时时需需要要对对方方的的服服务务器器支支持持FrontPage服务器扩展才行。服务器扩展才行。 返 回7/20/202497计算机文化基础 目 录上一页下一页 结 束 谢谢使用!谢谢使用!7/20/202498计算机文化基础