1、1,网页制作软件FrontPage 2003,2019年9月27日星期五,2,山东交通学院 徐滴石,网页制作软件FrontPage 2003,1 FrontPage 2003概述 2 网页基本元素编辑 3 网页布局 4 表单应用 5 网站发布及管理,2019年9月27日星期五,3,山东交通学院 徐滴石,1 FrontPage 2003概述,1.1 功能特点 1.2 窗口界面 1.3 基本操作,2019年9月27日星期五,4,山东交通学院 徐滴石,1.1 功能特点,FrontPage让初学者无需掌握HTML语言或具备编程基础知识便能够编写出界面优美、功能完善的网站。下面简单介绍一下FrontPa
2、ge的特点。 “所见即所得”的网页编辑环境,也就是说,用户在网页编辑窗口中看到的效果就是浏览器中显示的效果。 易学易用的操作界面,像其它Office套件一样,在FrontPage中集成了大量的网页模板和网站向导,让用户很方便快捷地制作出优美的网页。 功能强大的新版本FrontPage融合了网页管理、网页编辑、网页发布和网站维护等多种功能,利用FrontPage制作的网页支持最新的网页标准,比如DHTML、XML、CSS2等等。,2019年9月27日星期五,5,山东交通学院 徐滴石,1.2 窗口界面,FrontPage 2003主界面主要由菜单栏、工具栏、视图栏、状态栏、主编辑窗口和任务窗格等6
3、大部分组成。,2019年9月27日星期五,6,山东交通学院 徐滴石,“网页”视图,选择【视图】【网页】命令,打开网页视图。 网页视图是FrontPage中最常用的工作界面,网页的创建、编辑、预览等基本操作都是在此视图中进行的。网页视图窗口底部有4个标签:“设计”、“拆分”、“代码”和“预览”,它们分别控制着网页的4种显示模式。在设计模式下,能够以“所见即所得”的方式编辑网页;在代码模式下,可以查看或编辑网页的HTML的源代码;在预览模式下,可以预览网页的效果;在拆分模式下,能够同时编辑网页和查看或编辑网页的HTML的源代码。,2019年9月27日星期五,7,山东交通学院 徐滴石,“网页”视图,
4、2019年9月27日星期五,8,山东交通学院 徐滴石,“文件夹”视图,单击 “视图”栏中的“文件夹”图标或选择【视图】【文件夹】命令,打开文件夹视图。 在文件夹视图下,网站显示为一组文件和文件夹。在此视图下可以对网站中的文件夹和各种文件进行管理。,2019年9月27日星期五,9,山东交通学院 徐滴石,“报表”视图,单击“视图”栏中的“报表”图标或选择【视图】【报表】命令,打开报表视图。 通过报表视图,可以在运行报表查询后分析网站内容。,2019年9月27日星期五,10,山东交通学院 徐滴石,“导航”视图,单击“视图”栏中的“导航”图标或选择【视图】【导航】命令,打开导航视图。 导航视图用于管理
5、网站中各网页的层次关系结构图。可以通过鼠标将结构图中的网页拖到新位置来改变链接结构。,2019年9月27日星期五,11,山东交通学院 徐滴石,“超链接”视图,单击“视图”栏中“超链接”图标或选择【视图】【超链接】命令。 超链接视图用于管理网站中网页的超链接。,2019年9月27日星期五,12,山东交通学院 徐滴石,“任务”视图,单击“视图”栏中的“任务”图标或选择【视图】【任务】命令,可打开任务视图。 任务视图可以实现网站任务的管理。网站的任务是指网站管理人员维护网站的任务,包括网页的更新和网站的检查等。,2019年9月27日星期五,13,山东交通学院 徐滴石,“远程网站”视图,可以使用“远程
6、网站”视图发布整个网站,或有选择地发布个别文件。还可以在两个或多个位置之间同步文件,即确保包含相同内容的网站都包含最新的更改。,2019年9月27日星期五,14,山东交通学院 徐滴石,1.3基本操作,1网站的规划 2网站的基本操作 3网页的基本操作,2019年9月27日星期五,15,山东交通学院 徐滴石,网站的规划,首先要明确建立网站的目的。 其次要明确网站的浏览者群。 最后要考虑到如何能够便于网站的日常维护。,2019年9月27日星期五,16,山东交通学院 徐滴石,网站的基本操作,1) 创建网站 创建一个Web网站有两种方法。第一种方法是利用FrontPage的Web网站模板和向导,这种方法
7、操作简单、速度快,比较适合建立大、中型的Web网站。第二种方法是逐个地创建网页文件,然后创建它们之间的链接关系,这种方法适合于网页数量不多的小型网站。 使用FrontPage模板创建网站的步骤: 启动FrontPage应用程序; 选择【文件】【新建】命令,打开“新建”任务窗格; 选择网站模板,在“新建网站”栏选择“由一个网页组成的网站”,打开“网站模板”对话框,在“指定新网站的位置”文本框中输入新网站的位置及名称,然后单击“确定”按钮。,2019年9月27日星期五,17,山东交通学院 徐滴石,2)关闭网站 选择【文件】【关闭网站】命令。 关闭网站即关闭网站及该网站下的所有网页。 3)打开网站
8、选择【文件】【打开网站】命令,“打开网站”对话框。 选择网站名称,然后单击“打开”按钮。,网站的基本操作,2019年9月27日星期五,18,山东交通学院 徐滴石,网页的基本操作,1)新建网页 在FrontPage 2003中可以直接创建一个空白网页,也可以利用网页模板和网页向导来创建。 在某网站中创建新网页,在此网站的文件夹视图和导航视图方式下单击视图窗口右上角的“新建网页”按钮。 创建不属于某网站的新网页,在任何视图方式下,选择【文件】【新建】命令,打开“新建”任务窗格,可在新建任务窗格中,选择一种合适的模板新建网页;或者单击常用工具栏上的“新建”按钮 。,2019年9月27日星期五,19,
9、山东交通学院 徐滴石,2)打开网页 打开当前网站中的网页,在任何视图中双击该网页图标或文件名即可打开网页。 打开其它网站中的网页,选择【文件】【打开】命令,在“打开文件”对话框中选择具体网页文件打开。 3)保存网页 保存当前网站中的网页,单击工具栏中的保存按钮,或【文件】【保存】命令即可。如果网页中有图片,则会弹出“保存嵌入式文件”对话框,提示保存图片文件。 保存不属于当前网站中的网页,则需要指定保存路径。 4)关闭网页 选择【文件】【关闭】命令。这种方式关闭的仅是当前网页,要注意与关闭网站的区别。,网页的基本操作,2019年9月27日星期五,20,山东交通学院 徐滴石,2 网页基本元素编辑,
10、2.1 文本编辑 2.2 图像编辑 2.3 超链接创建 2.4 Web组件,2019年9月27日星期五,21,山东交通学院 徐滴石,2.1文本编辑,1文本添加 2设置段落和文本格式 3插入水平线 4设置网页属性,2019年9月27日星期五,22,山东交通学院 徐滴石,文本添加,在网页中添加文本与在Word中添加文本的操作基本相同。此外,在网页中输入文本时,如果已经达到网页边界,则文本会自动回滚到下一行继续输入,这种换行方式并不会产生新行或是一个新段落,随着网页边界的变化或是编辑窗口的调整,FrontPage 2003会自动调整这个回滚位置。 按下+键将产生新行,即换行,新行与上一行之间没有回滚
11、关系。 按下键产生一个新段落。,2019年9月27日星期五,23,山东交通学院 徐滴石,设置段落和文本格式,可以使用格式工具栏(如图7.2.1所示)或“字体”和“段落”对话框对文本和段落的格式进行设置。其操作方法跟Word基本相同。,2019年9月27日星期五,24,山东交通学院 徐滴石,插入水平线,为了修饰页面,明显区分开标题与正文,可选择【插入】【水平线】命令在当前光标点插入一条水平线。双击水平线或选择【格式】【属性】命令弹出“水平线属性”对话框,可对水平线的高度、宽度、颜色和对齐方式进行设置。,2019年9月27日星期五,25,山东交通学院 徐滴石,设置网页属性,网页属性是一个网页整体的
12、属性,记录关于网页的非页面部分的相关信息。适当的设置可以达到增加网页美观和缩减网页文件大小的效果。 方法一:右击页面,从弹出的快捷菜单中选择“网页属性”命令。 方法二:选择【格式】【背景】命令; 方法三:选择【文件】【属性】命令;,2019年9月27日星期五,26,山东交通学院 徐滴石,2.2图像编辑,1插入图像 2编辑图像 3设置图片属性,2019年9月27日星期五,27,山东交通学院 徐滴石,插入图像,插入一幅关于“背景”的剪贴画的操作步骤: 将插入点定位在需要插入图片的位置; 选择【插入】【图片】【剪贴画】命令,打开“剪贴画”任务窗格,如图所示; 在任务窗格中,用户可在“搜索文字”文本框
13、中输入剪贴画的关键字“背景”; 单击“搜索”按钮开始搜索,在任务窗格下方列表框中列出了搜索到的剪贴画; 单击剪贴画右侧的下三角按钮,弹出剪贴画的快捷菜单,单击“插入”命令即可。,2019年9月27日星期五,28,山东交通学院 徐滴石,剪贴画是软件(microsoft office)自带的,它是一些wmf格式(当然也有的是emf格式的)的矢量图,软件中有很多分类,它插入到ppt中,背景是透明的,不会影响后面的内容,而普通图片做不到。这些剪贴画放在了C:Program FilesMicrosoft Officemedia,文件夹下,而图片的画包含了各种格式,是从(软件)外部插入的,一般有jpg,j
14、peg,bmp,gif等格式。 而自选图形是利用软件的绘图工具栏里的绘图工具绘制出来的各种几何图形。 这三种都可称为图,插到ppt中都有八个控制点,外加一个旋转控制点。,2019年9月27日星期五,29,山东交通学院 徐滴石,插入来自文件的图片的操作步骤: 将插入点定位在需要插入图片的位置; 将插入点定位在需要插入图片的位置; 选择【插入】【图片】【来自文件】命令,或单击“常用”工具栏中“插入图片”按钮; 打开“图片”对话框,选择所需文件,单击“插入”按钮。,插入图像,2019年9月27日星期五,30,山东交通学院 徐滴石,编辑图像,在网页中插入图像后,还可对图像进行编辑。用鼠标单击选取图像,
15、在屏幕上就会出现“图片”工具栏。利用“图片”工具栏可对图片进行旋转、剪裁、冲蚀,设置凹凸效果、透明背景色,调整亮度、对比度以及在图片中加入文字等。选中图片后,拖动图片周围的控点可改变图片大小。,2019年9月27日星期五,31,山东交通学院 徐滴石,设置图片属性,选定所需的图片,单击鼠标右键,从快捷菜单中选择“图片属性”命令,弹出“图片属性”对话框。在对话框的“常规”和“外观”两个选项卡中进行设置,可以做出各种图文混排的页面效果。,2019年9月27日星期五,32,山东交通学院 徐滴石,2.3 超链接创建,1选择链接的载体 2选择链接的目标 3指定目标窗口 4验证超级链接 5设置超链接的状态颜
16、色 6图像映射,2019年9月27日星期五,33,山东交通学院 徐滴石,超链接是从一个网页指向另一个目的地的指针,这个目的地可以是另一个网页或同一个网页中的其他位置,也可以是一个电子邮件、一个Word文档或者是一个应用程序。 创建超链接的步骤: 选择链接的载体; 选择链接的目标; 指定目标窗口。,2.3 超链接创建,2019年9月27日星期五,34,山东交通学院 徐滴石,选择链接的载体,链接的载体是显示链接的页面元素。将鼠标指针移到包含超链接的文字或图像上时,鼠标指针就会变成形状,当浏览者单击此文本串或图像,浏览器将打开相应地址的网页。 选定链接的载体后,单击“常用”工具栏上“插入超链接”按钮
17、,或选择【插入】【超级链】命令,打开“插入超链接”对话框。,2019年9月27日星期五,35,山东交通学院 徐滴石,选择链接的目标,链接的目标包括原有文件或网页、本文档中的位置(书签)、新建文档、电子邮件等。根据跳转目的地的不同,网页中链接可分为4种类型。 1)原有文件或网页直接跳转到已经存在的某一网页或文件。 如果是本网站内的网页,可用光标在“插入超链接”对话框列表文件中选择。 如果是本机上其它网站中的网页,则选择“插入超链接”对话框中的按钮,或从“查找范围”中选择相应的网站,再选择所需网页。 如果是Internet上其它网站的某一网页,可单击按钮打开浏览器找到该页面后,该页面的网址会自动出
18、现在“地址”栏;也可以直接在地址栏文本框中输入该网页的地址。,2019年9月27日星期五,36,山东交通学院 徐滴石,2)本文档中的位置是直接跳转到本网页中的某书签标志的位置。要进行此链接操作,必须先用【插入】【书签】命令在网页中的某些位置插入书签; 在“插入超链接”对话框中单击“本文档中的位置”,然后选择该网页上的书签,将会在书签位置创建一超链接。,选择链接的目标,2019年9月27日星期五,37,山东交通学院 徐滴石,3)新建文档可以将当前选中的链接的载体链接到一个新建的页面上。单击“新建文档”按钮,在“新建文档名称”栏填写该网页的名称。,选择链接的目标,2019年9月27日星期五,38,
19、山东交通学院 徐滴石,4)单击“电子邮件地址”按钮,在“电子邮件地址”栏填写目标电子邮件地址,可创建一个到电子邮件的链接。,选择链接的目标,2019年9月27日星期五,39,山东交通学院 徐滴石,指定目标窗口,链接的目标网页选定后,可以指定目标网页是在本窗口中显示还是在新打开的浏览器窗口中显示。单击“插入超链接”对话框中“目标框架”按钮,打开“目标框架” 对话框,。指定链接的目标网页的目标窗口,默认是在当前窗口中打开目标网页。 “公用的目标区”列表框选项含义如下: 相同框架:链接的目标网页显示在包含该超链接的同一个框架内。 整页:将框架展开为全窗口后显示链接的目标网页。 新建窗口:另外打开一个
20、浏览窗口显示链接的目标网页。 父框架:如果是一页套一页的框架网页,选择父框架可以回到上一层框架显示链接的目标网页。,2019年9月27日星期五,40,山东交通学院 徐滴石,验证超级链接,上面的三个步骤设置完成后,超链接的创建便完成了。接下来有必要验证一下超链接是否正确,可用如下的方法来验证: 网页的设计视图中,把鼠标移到已经创建了超链接的载体上(文字、图像),鼠标变成手状,按下键,然后单击鼠标,便可验证链接目的地。 在网页的预览视图中,用鼠标单击创建了链接的载体,便可验证链接目的地。,2019年9月27日星期五,41,山东交通学院 徐滴石,设置超链接的状态颜色,在浏览器中浏览网页时,已经访问过
21、的超链接、尚未访问过的超链接和正在访问的超链接应有不同的颜色显示,使浏览者一目了然。 设置超链接的状态颜色方法:选择【格式】【背景】命令,打开“网页属性”对话框。选中“背景”选项卡,对与超链接有关的部分进行设置。,2019年9月27日星期五,42,山东交通学院 徐滴石,图像映射 视图-工具栏-图片,图像映射也称MAP技术,是指在一幅图像上建立不同形状的热点区域,每一个区域都是一个超链接。制作步骤如下: 选定要制作图像映射的图片,此时屏幕会显示出“图片”工具栏,在“图片”工具栏上有5个专门是为图像映射功能设置的。 单击“图片”工具栏中一种热点形式,并将光标移到要制作图像映射的图片中,光标变成铅笔
22、形状然后用鼠标在图片中拖动出一个矩形区域。 松开鼠标后,出现“创建超链接”对话框,从中可设置该热点的链接目标。,2019年9月27日星期五,43,山东交通学院 徐滴石,2.4 Web组件,1字幕 2交互式按钮 3横幅广告 4计数器,2019年9月27日星期五,44,山东交通学院 徐滴石,字幕,字幕是在浏览器中能够水平滚动的文字,其文字具有动态特点,可以用于发布网站的通知和提示信息。其操作步骤如下: 选择插入字幕的位置; 选择【插入】【Web组件】命令; 选择“选择一种效果”列表中的“字幕”选项,然后单击“完成”按钮,打开“字幕属性”对话框; 设置字幕属性,如在文本框中输入滚动的文字,选择滚动方
23、向等,然后单击“确定”按钮,便完成滚动字幕的插入; 切换到预览视图,观看滚动字幕的效果。 更改字幕属性,在网页设计视图下双击该字幕,或选中字幕单击鼠标右键,在弹出的快捷菜单中选择“字幕属性”,便可弹出字幕属性对话框。,2019年9月27日星期五,45,山东交通学院 徐滴石,交互式按钮,交互式按钮也称悬停按钮,是一种可以变化的按钮。当将鼠标指针移到交互式按钮上时,它会变成新的样子;当鼠标指针离开交互式按钮时,它又会自动变回到原来的样子。交互式按钮一般用在导航条中。 在网页中插入交互式按钮操作步骤如下: 选择插入交互式按钮的位置; 选择【插入】【Web组件】命令,打开如上图所示的对话框; 选择“选
24、择一种效果”列表中的“交互式按钮”选项,然后单击“完成”按钮,打开“交互式按钮”属性对话框; 设置交互式按钮属性,然后单击“确定”按钮,便完成交互式按钮的插入; 切换到预览视图,查看交互式按钮的效果。,2019年9月27日星期五,46,山东交通学院 徐滴石,设置交互式按钮的属性: 在按钮选项卡下,在“文本”属性框中输入按钮上显示的文字;在“链接”属性框中设置链接的目的地;按钮列表框中选择按钮的样式等。 在字体选项卡下,可以设置按钮上的文字的相关格式。 在图像选项卡下,可以设置按钮上显示的图像及属性。 更改交互式按钮属性,在网页设计视图下双击该按钮,或选中该按钮右击,在弹出的快捷菜单中选择“按钮
25、属性”命令,便可弹出交互式按钮属性对话框。,交互式按钮,2019年9月27日星期五,47,山东交通学院 徐滴石,Dreamweaver 里设置鼠标悬停下拉菜单,2019年9月27日星期五,48,山东交通学院 徐滴石,横幅广告,横幅广告的动画形式就像一幅不停变换着的广告牌。 在网页中插入横幅广告的操作步骤: 选择插入位置; “工具”菜单-“自定义”-命令-“插入”-“横幅广告管理器” 选择【插入】【横幅广告管理器】命令,打开“横幅广告管理器属性”对话框; 选择属性对话框中的“添加”按钮,添加要显示的图片(至少要有两幅图片才能变换显示); 高度、宽度属性设置图片的显示框的大小;过渡效果设置图片的显
26、示效果。 切换到预览视图,查看横幅广告的效果。,2019年9月27日星期五,49,山东交通学院 徐滴石,计数器,计数器可以统计并显示网页的访问次数。你可以在网站的主页上添加一个计数器,这样就可以知道该网站的访问次数。 只有在发布网站之后,才可以对计数器进行测试以确保它可以正确工作。 提示:计数器要能正常工作,网站必须发布到安装有FrontPage ServerExtensions(支持在FrontPage中进行创作并能扩展Web服务器功能的程序和脚本的集合)、SharePoint Team Services v1.0 from Microsoft或Microsoft Windows Share
27、Point Services 2.0 的Web服务器上。,2019年9月27日星期五,50,山东交通学院 徐滴石,3 网页布局,3.1 表格布局 3.2 框架布局,2019年9月27日星期五,51,山东交通学院 徐滴石,3.1 表格布局,1创建表格 2编辑表格 3设置表格和单元格的属性 4实例,2019年9月27日星期五,52,山东交通学院 徐滴石,表格在网页制作中的作用有以下两个方面: 用于显示有一定格式的数据和信息。 用于对整个网页版面的控制,组织数据、排列网页元素(文本、图像、视频等)的空间位置。 表格在网页中的使用比较多,表格的引入使网页变得整齐美观。许多漂亮的网页都是利用表格实现布局
28、的。,3.1 表格布局,2019年9月27日星期五,53,山东交通学院 徐滴石,创建表格,在FrontPage中表格的创建和编辑同在Word中相似。 创建表格的基本方法: 使用“常用”工具栏中的“插入表格”按钮。 选择【表格】【插入】【表格】命令。 选择【表格】【绘制表格】命令。用鼠标控制画笔绘制任意表格。,2019年9月27日星期五,54,山东交通学院 徐滴石,编辑表格,表格绘制好后,根据需要对表格中的文字进行编辑,对行高列宽进行调整,对表格的行、列、单元格可作增加或删除操作。具体操作与在Word中一样。,2019年9月27日星期五,55,山东交通学院 徐滴石,设置表格和单元格的属性,在表格
29、内任意位置右击,在出现快捷菜单中选择“表格属性”选项,或选择【表格】【表格属性】【表格】命令,弹出“表格属性”对话框,可对表格的布局、边框和背景进行设置。 在某一单元格内右击,在弹出的快捷菜单中选择“单元格属性”命令,弹出“单元格属性”对话框,可对该单元格的布局、边框和背景进行设置。,2019年9月27日星期五,56,山东交通学院 徐滴石,3.2 框架布局,1创建框架网页 2框架的编辑 3框架属性的设置,2019年9月27日星期五,57,山东交通学院 徐滴石,框架是一种特殊的网页,它将浏览器窗口划分成功能独立的几个部分,每部分是一个框架,每个框架分别对应于一个独立的网页,这样可以在一个窗口上同
30、时观看到多个页面组成的信息界面。各个框架之间还可以设置超链接。很多网站都具有这样的结构。,3.2 框架布局,2019年9月27日星期五,58,山东交通学院 徐滴石,创建框架网页,创建框架网页的步骤如下所示: 选择【文件】【新建】命令,出现“新建网页或网站”任务窗格; 单击“其他网页模板”命令,弹出“网页模板”对话框; 选中“框架网页”选项卡,在列表中选择所需的模板 。 单击“确定”按钮,建立了一个新的框架网页。,2019年9月27日星期五,59,山东交通学院 徐滴石,在框架网页每一个子窗口中都有两个按钮,单击“新建网页”按钮,一个新的空白网页就会出现在框架中;单击“设置初始网页”按钮,弹出“插
31、入超链接”对话框,在对话框中选择某一目标网页作为此框架的初始网页。,创建框架网页,2019年9月27日星期五,60,山东交通学院 徐滴石,框架网页的保存。单击“常用”工具栏上的“保存”按钮,则会弹出“另存为”对话框。则依次把框架网页中的“新建网页”保存完后,再保存“框架集文件” 。对话框右侧为框架示意图,深蓝色框突出显示表示正在保存的框架。,创建框架网页,2019年9月27日星期五,61,山东交通学院 徐滴石,框架的编辑,对于已经建立好的框架网页,可以再对它进行编辑,比如对某个框架再拆分或删除,重新进行框架布局。1)拆分框架 单击选定要拆分的框架,选择【框架】【拆分框架】命令,打开“拆分框架”
32、对话框,根据需要选择“拆分为列”或“拆分成行”。 2)删除框架 先单击选定要删除的框架,再选择【框架】【删除框架】命令。,2019年9月27日星期五,62,山东交通学院 徐滴石,框架属性的设置,选中需要设置的框架,选择【框架】【框架属性】命令;或者单击鼠标右键,从快捷菜单中选择“框架属性”菜单项,打开“框架属性”对话框。 “框架大小”有百分比、相对大小、象素值三种设置方式。 “边距”可以设置框架内容和框架边框之间的距离。 “显示滚动条”列表中各个选项表示:“需要时显示”选项,当浏览器窗口太小不能放下框架的全部内容时,滚动条就会出现;“不显示”选项,无论什么情况,滚动条都不会出现;“始终显示”选
33、项,滚动条自始至终都会出现,即使它们不需要时也会出现。 显示或隐藏框架周围的边框:单击“选项”右边的“框架网页”按钮,选中或清除“显示边框”复选框。,2019年9月27日星期五,63,山东交通学院 徐滴石,4 表单应用,4.1 创建表单网页 4.2 发布表单网页,2019年9月27日星期五,64,山东交通学院 徐滴石,4.1 创建表单网页,创建表单网页有两种方法,一种是利用FrontPage提供的模板或向导可以快速创建表单网页;另一种是使用表单域来定制表单。 下面以插入表单域来定制表单为例,说明创建表单的操作方法: 插入表单。选择【插入】【表单】【表单】命令;或用鼠标拖动子菜单顶部就会出现“表
34、单”工具栏,再单击“表单”工具栏中的“表单”按钮。此时,会出现一个由虚线框表示的表单框,表单内只有“提交”按钮和“重置”按钮。 插入表单域。为了使表单中的每个表单域对齐,在创建表单域之前在表单中插入表格。然后依次插入各表单域。 设置表单域属性。表单网页布局设计好以后,还需要对表单域属性进行设置,才能使表单正常工作。,2019年9月27日星期五,65,山东交通学院 徐滴石,下面分别介绍按钮、单行文本框、复选框表单域的属性设置。 在页面中双击相应的表单域,或右击此表单域,弹出快捷菜单,选择“表单域属性”命令,就可打开其属性对话框,对该表单域进行属性设置。 1)“按钮属性”对话框如图所示。“值/标签
35、”设置按钮上显示的文字。按钮的类型可设置按钮的功能。 “重置”类型按钮,可以清除表单内的所有内容,所有表单域都恢复原始设置。 “提交”类型按钮,可以把访问者填写的表单内容发送到表单按钮指定的网页或相关程序。 “普通”类型按钮,用户可调用自己编写的程序处理表单中的数据,定制表单功能。,4.1 创建表单网页,2019年9月27日星期五,66,山东交通学院 徐滴石,2)单行文本框的表单域适合访问者做简单回答,如姓名、密码、电话号码等。 “名称”属性:用于设置该表单域的名称,通过这个名称表单与Web服务器才能进行交流。 “初始值”属性:设置文本框中显示的默认值。 “宽度”属性:设置文本框的宽度,但不会
36、影响浏览者在文本框中可以输入的文本数量。 “密码域”属性:如果选择“是”选项时文本框信息内容将会以“*”表示。,4.1 创建表单网页,2019年9月27日星期五,67,山东交通学院 徐滴石,3)复选框提供访问者设置多个选项的功能。 “值”属性:用来描述该复选框选中后所表示的含义,这是一个“布尔”值,例如:ON/OFF,True/False等; “初始状态”属性:用于设置复选框的初始状态,即打开网页时,复选框是否被选中。,4.1 创建表单网页,2019年9月27日星期五,68,山东交通学院 徐滴石,4.2 发布表单网页,1保存表单信息 2创建确认表单网页,2019年9月27日星期五,69,山东交
37、通学院 徐滴石,保存表单信息,表单作为网页中一种最重要的信息收集和交流工具,能够帮助网站管理员收集信息,但是只有浏览者提交了表单结果后网站管理员才能收到信息。对于浏览者提交的表单结果,FrontPage都会以某一种方式保存起来。 设置保存表单结果的步骤: 在表单内单击鼠标右键,从快捷菜单中选择“表单属性”命令,弹出“表单属性”对话框。 设置表单属性。 在“将结果保存到”区域中选择“发送到”选项。在“文件名称”框中指定保存表单结果的文件路径及文件名称,将表单结果保存到某一个文件中。在“电子邮件地址”框中输入收集表单结果的网站管理员的电子邮件地址。这样每当网站访问者提交表单时,网站管理员就可以接收
38、到份电子邮件信息。,2019年9月27日星期五,70,山东交通学院 徐滴石,创建确认表单网页,确认表单网页用于给浏览者反馈信息。浏览者提交表单以后,并不知道是否发送成功,这时需要反馈给浏览者确认信息。确认表单网页是一种已经设置好了的网页,它将会依据网页浏览者所填写表单内容的不同,而反馈不同的结果。 创建确认表单网页的步骤: 新建一网页,并输入确认信息。设置表单属性。 插入确认域 选择【插入】【Web组件】命令,打开“插入Web组件”对话框。在对话框的组件类型列表中选择“高级控件”选项,在对话框右列表中选择“确认域”选项,打开“确认域属性”对话框,输入要确认的表单域名称name(即提交网页中的“
39、姓名”表单域)。,2019年9月27日星期五,71,山东交通学院 徐滴石,保存表单确认网页。 将提交网页与确认网页关联起来。 打开提交网页,在表单域内单击右键,从弹出的快捷菜单中选择“表单属性”选项,在打开的“表单属性”对话框中单击“选项”按钮,打开“保存表单结果的选项”对话框,在“确认网页”选项卡的“确认网页的URL(可选)”框中输入确认网页的地址。 提示:提交表单页面和确认表单页面在网站发布以后才能使用。,创建确认表单网页,2019年9月27日星期五,72,山东交通学院 徐滴石,5 网站发布及管理,5.1 发布网站 5.2 管理网站,2019年9月27日星期五,73,山东交通学院 徐滴石,
40、5.1 发布网站,发布网站信息,就是将网站中的所有文件传送到在Internet上申请的地址空间或Web服务器中去。发布个人网站主要有两条途径: 向提供网页发布服务的ISP(网络服务提供商)申请在Internet上发布。 利用IIS的Web服务器系统在局域网中发布。 利用IIS(Microsoft Internet Information Server,简称IIS)进行发布适合于局域网内的用户访问,优点是访问速度快、维护管理方便。建立一个Web服务器的基本条件是: 1)计算机必须连接局域网; 2)拥有单独的IP地址; 3)安装了Web服务器程序(IIS)。,2019年9月27日星期五,74,山东
41、交通学院 徐滴石,Web服务器程序种类很多,IIS是其中最常用的,且Windows 2000以上操作系统带有IIS安装组件。下面以IIS 5.0为例,说明如何设置一个Web服务器。 设置Web服务器基本操作: 打开Windows操作系统中的“控制面板”窗口,然后打开“管理工具”窗口,再双击“Internet信息服务”图标,打开IIS管理窗口。,5.1 发布网站,2019年9月27日星期五,75,山东交通学院 徐滴石,设置Web服务器的各项属性。在IIS管理窗口的左边窗格中,选中“默认Web站点”右击,选择“属性”选项,弹出“默认Web站点属性”对话框,单击“网站”选项卡设置,“IP地址”设置必
42、须是本机的IP地址。 “主目录”选项卡设置,“本地路径”指定网站的位置。这里只讲两项主要设置。,5.1 发布网站,2019年9月27日星期五,76,山东交通学院 徐滴石,浏览网页。打开IE浏览器,在地址栏输入Web服务器的IP地址或计算机名(也可输入“http:/”+Web服务器的IP地址或计算机名,如http:/218.197.52.X、http:/lib010)。局域网内的用户可以利用这种方式,对已发布的网站进行访问。,5.1 发布网站,2019年9月27日星期五,77,山东交通学院 徐滴石,5.2 管理网站,FrontPage不仅是一个网站设计工具,它还具备有很强的网站管理功能。使用FrontPage 2003来管理网站主要包括以下几个方面的内容: 文件及文件夹的管理 超链接管理 实用易懂的报表 管理网站任务 发布网站,