Frontpage网页制作工具.ppt

《Frontpage网页制作工具.ppt》由会员分享，可在线阅读，更多相关《Frontpage网页制作工具.ppt（26页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、信息技术基础信息技术基础 主讲：王君皓主讲：王君皓 日期：日期：December 22December 22Frontpage2000Frontpage2000网页制作工具网页制作工具 内容提要内容提要8基本网页编辑基本网页编辑8图形的插入和图形格式图形的插入和图形格式8创建超链接（超链接、书签、热点）创建超链接（超链接、书签、热点）8网页的布局（表格和框架）网页的布局（表格和框架）8创建和使用表单创建和使用表单8使用网页层次组件使用网页层次组件FrontPageFrontPage认识认识FrontPageFrontPage管理和组织网页管理和组织网页网页编辑网页编辑认识认识FrontPage

2、FrontPage是一种是一种“所见即所得所见即所得”的网站管理和网页制作的的网站管理和网页制作的工具。工具。FrontPage2000属于属于Office2000家族的成员家族的成员,其主其主要功能有要功能有:新建和修改一个网页新建和修改一个网页 新建一个站点新建一个站点 在网页中插入一些动态元素在网页中插入一些动态元素 设置动态效果设置动态效果 设置网页过渡效果设置网页过渡效果 可以直接导入可以直接导入OfficeOffice其它工具的文件其它工具的文件 提供网站管理信息和统计资料提供网站管理信息和统计资料FrontPageFrontPageFrontPage 2000FrontPage

3、2000的操作环境的操作环境视视 图图FrontPage 2000提供了六种视图方式提供了六种视图方式来实现网页的编辑和网站的创建、管理来实现网页的编辑和网站的创建、管理两大功能，其中只有网页视图是用来编两大功能，其中只有网页视图是用来编辑网页的，其它五种视图都是用来创建辑网页的，其它五种视图都是用来创建和管理站点的，其所做的相关设置，是和管理站点的，其所做的相关设置，是针对整个站点的。选择不同的视图方式，针对整个站点的。选择不同的视图方式，右边的编辑区中会显示不同的内容。右边的编辑区中会显示不同的内容。网页视图网页视图网页编辑的视图，负责网站内个别网页的编辑，网页编辑的视图，负责网站内个别网

4、页的编辑，它提供了三种显示方式：它提供了三种显示方式：普通视图：普通视图：“所见即所得所见即所得”的编辑环境的编辑环境HTML视图视图:编辑和查看编辑和查看HTML源代码源代码的环境的环境预览视图预览视图:IEIE浏览器的预览环境。浏览器的预览环境。文件夹视图文件夹视图类似类似Windows资源资源管理器管理器,显示站点的显示站点的所有文件和文件夹所有文件和文件夹,在此视图方式下可在此视图方式下可进行文件和文件夹进行文件和文件夹的新建、复制、删的新建、复制、删除、剪切、重命名、除、剪切、重命名、修改属性等操作。修改属性等操作。报表视图报表视图提供提供1414种报表，种报表，帮助我们了解帮助我们

5、了解站点的情况。站点的情况。导航视图导航视图记录站点结构记录站点结构 超链接视图超链接视图提供基于超链提供基于超链接的结构分析，接的结构分析，以任意网页为以任意网页为中心，形象地中心，形象地说明通过超链说明通过超链接相连的其他接相连的其他网页。从微观网页。从微观的角度展示站的角度展示站点的结构。点的结构。任务视图任务视图站点任务的管理，当多人同时编写一个站点时站点任务的管理，当多人同时编写一个站点时,可通过可通过任务视图为各个成员分配任务任务视图为各个成员分配任务,协调成员之间的工作。协调成员之间的工作。基本网页编辑基本网页编辑即可以在站点中创建新网页，也可以创建独立的即可以在站点中创建新网页

6、，也可以创建独立的网页。网页。Microsoft FrontPage 内置的各类模板可内置的各类模板可以帮助我们创建不同类型的网页。以帮助我们创建不同类型的网页。网页视图中进行文本的录入和网页视图中进行文本的录入和word类似，也可类似，也可以在网页中插入任何一种基于文本的文件，包括以在网页中插入任何一种基于文本的文件，包括 .htm 文件、文件、.asp 文件文件、.rtf 文件和文件和 .txt 文文件，以及任何件，以及任何 Microsoft Office 文档。文档。新建、打开、保存网页新建、打开、保存网页新建、打开、保存网页新建、打开、保存网页 添加文本和插入素材文件添加文本和插入素

7、材文件添加文本和插入素材文件添加文本和插入素材文件 基本网页编辑基本网页编辑在在 FrontPage 中，可以像使用中，可以像使用word的方式的方式来设置文本格式，如更改字体、大小、样来设置文本格式，如更改字体、大小、样式、颜色、段落间距以及添加诸如下划线式、颜色、段落间距以及添加诸如下划线的效果。的效果。FrontPage的插入菜单可以插入以下几种类的插入菜单可以插入以下几种类型的特殊元素：水平线、符号和注释。型的特殊元素：水平线、符号和注释。设置文本格式设置文本格式设置文本格式设置文本格式 插入特殊网页元素插入特殊网页元素插入特殊网页元素插入特殊网页元素 基本网页编辑基本网页编辑项目符号

8、和编号是组织数据的工具，它可以使项目符号和编号是组织数据的工具，它可以使数据层次分明、重点突出。数据层次分明、重点突出。使用项目符号和编号使用项目符号和编号使用项目符号和编号使用项目符号和编号 用浏览器预览网页用浏览器预览网页用浏览器预览网页用浏览器预览网页 使用背景色和背景音乐使用背景色和背景音乐使用背景色和背景音乐使用背景色和背景音乐 认识图形格式认识图形格式 GIF GIF JPEG JPEG PNG PNG （图形交换格式）（联合图像专家组）（可移植网络图形）图形交换格式）（联合图像专家组）（可移植网络图形）可用颜色数可用颜色数可用颜色数可用颜色数 16777216 16777216

9、16777216每幅图像的颜色每幅图像的颜色每幅图像的颜色每幅图像的颜色 256 16777216 16777216压缩压缩压缩压缩 无损无损 有损有损 无损无损透明透明透明透明 单色单色 否否 Alpha通道通道半透明半透明半透明半透明 否否 否否 Alpha通道通道动画动画动画动画 是是 否否 否否GRB 图形的插入图形的插入HTML并不能包含图像，它只是包含图像文件的名称并不能包含图像，它只是包含图像文件的名称和相应的格式代码。和相应的格式代码。”图形的插入图形的插入 直接拖拽来改变图片的大小直接拖拽来改变图片的大小 使用图片属性对话框来设置使用图片属性对话框来设置 图片的替代文字、图片

10、边框图片的替代文字、图片边框 使用图片工具栏编辑图片使用图片工具栏编辑图片 建立超链接建立超链接超链接的实现方法：将某个文本串或某幅图像和其他超链接的实现方法：将某个文本串或某幅图像和其他网页的地址（网页的地址（URL）联系在一起。联系在一起。创建超链接：创建超链接：其他其他Web服务器上的网页文件服务器上的网页文件 本地机器中网页文件本地机器中网页文件 同一个网页文件中（书签）同一个网页文件中（书签）图像映射图像映射图像映射是另一种形式的超链接，允许将不同的图像映射是另一种形式的超链接，允许将不同的URLURL指定指定给一幅图像的不同部分，使访问者根据不同的图像区域给一幅图像的不同部分，使访

11、问者根据不同的图像区域跳转到不同的位置，这些区域称做跳转到不同的位置，这些区域称做“热点热点”，每一个热，每一个热点与一个超链接相对应。点与一个超链接相对应。如下图汽车生产商的站点可以用新车的图像映射：当站如下图汽车生产商的站点可以用新车的图像映射：当站点访问者单击车子时，就会显示详细说明车子的网页。点访问者单击车子时，就会显示详细说明车子的网页。网页的布局网页的布局表格和框架是网页布局的常用工具。表格和框架是网页布局的常用工具。表格在网页制作中的作用已经超越了传统意义上的存放数表格在网页制作中的作用已经超越了传统意义上的存放数据，表格已成为组织数据、排列网页元素空间位置最为灵据，表格已成为组

12、织数据、排列网页元素空间位置最为灵活的方法。活的方法。框架也是一种常用的网页布局方法，它将浏览器窗口划分框架也是一种常用的网页布局方法，它将浏览器窗口划分为功能独立的多个区域，每个框架显示一个网页内容，并为功能独立的多个区域，每个框架显示一个网页内容，并且通过框架中的超链接可以更改显示在另一个框架中的网且通过框架中的超链接可以更改显示在另一个框架中的网页文件。页文件。表格的创建表格的创建菜单命令菜单命令菜单命令菜单命令“表格表格表格表格”/“”/“”/“”/“手绘表格手绘表格手绘表格手绘表格”使用使用使用使用“插入表格插入表格插入表格插入表格”按钮按钮按钮按钮菜单命令菜单命令菜单命令菜单命令“

13、表格表格表格表格”/“”/“”/“”/“插入插入插入插入”/“”/“”/“”/“表表表表格格格格”先绘制出表格的轮廓，然后绘制表格的单先绘制出表格的轮廓，然后绘制表格的单元格元格,由此可以创建一个不规则的表格。由此可以创建一个不规则的表格。用指定表格属性的方式创建表格，用指定表格属性的方式创建表格，这些属性包括表格的行数和列数、这些属性包括表格的行数和列数、表格宽度、对齐方式、边框粗细，表格宽度、对齐方式、边框粗细，以及单元格边距和间距。以及单元格边距和间距。通过指定列数和行数来快速创建一个规则的空表。通过指定列数和行数来快速创建一个规则的空表。表格的编辑表格的编辑单元格的合并与拆分单元格的合

14、并与拆分单元格的合并与拆分单元格的合并与拆分 设置单元格属性设置单元格属性设置单元格属性设置单元格属性设置表格属性设置表格属性设置表格属性设置表格属性表格在网页中的编排方式表格在网页中的编排方式单元格内文本的编排方式单元格内文本的编排方式创建不规则的表格创建不规则的表格 表格布局表格布局要用表格来布局网页要用表格来布局网页，首先应决定表格在水平方向和垂直首先应决定表格在水平方向和垂直方向上所需的单元个数量，然后为需要跨越多行或多列的方向上所需的单元个数量，然后为需要跨越多行或多列的对象合并单元格。对象合并单元格。大多数网页布局采用了带有不可见边框的表格。大多数网页布局采用了带有不可见边框的表格

15、。框架布局框架布局框架是一种将浏览器窗口划分为功能独立的多个区域的常用方法。框架是一种将浏览器窗口划分为功能独立的多个区域的常用方法。框架集框架集框架集框架集定义每个框架的大小、位置、名称和初始网页，普通网页提供每个框架的定义每个框架的大小、位置、名称和初始网页，普通网页提供每个框架的内容。一个框架的超链接可以更改显示在另一个框架中的网页。内容。一个框架的超链接可以更改显示在另一个框架中的网页。框架集框架集框架集框架集是一种特殊的网页，该网页定义了整体的框架布局，但不提供实是一种特殊的网页，该网页定义了整体的框架布局，但不提供实际内容。际内容。框架名称框架名称框架名称框架名称 初始网页初始网页

16、初始网页初始网页rtoprtoprtoprtop com-t.htmlcom-t.htmlcom-t.htmlcom-t.htmlrbottom rbottom rbottom rbottom com-m.htmlcom-m.htmlcom-m.htmlcom-m.htmlLeft Left Left Left com-1.htmhtmhtmhtm框架集框架集框架集框架集 框架的创建和保存框架的创建和保存新建框架网页新建框架网页新建框架网页新建框架网页框架组成框架组成框架组成框架组成在框架中加入网页在框架中加入网页在框架中加入网页在框架中加入网页 边框、滚动条、网页边框、滚动条、网页1）建立新

17、网页）建立新网页2）指定已经存在的网页）指定已经存在的网页保存框架页保存框架页保存框架页保存框架页文件文件/另存为另存为文件文件/新建新建/网页，网页，选择选择“框架网页框架网页”标签标签 框架属性设置框架属性设置框架框架框架框架/框架属性框架属性框架属性框架属性网页名称网页名称初始网页初始网页框架大小框架大小边距边距滚动条滚动条框架的可调整性框架的可调整性间距间距30%70%80%20%相对大小：相对大小：1 1和和4 4相对大小：相对大小：3 3和和7 7 框架之间的超链接框架之间的超链接在框架网页中，单击某框架内网页上的超链接时，被超链接所在框架网页中，单击某框架内网页上的超链接时，被超

18、链接所指定的网页通常在另一个框架中打开，这个框架称为目标框架。指定的网页通常在另一个框架中打开，这个框架称为目标框架。插入插入插入插入/超链接超链接超链接超链接发布站点发布站点准备工作：在浏览器上进行预览，在报表视图下，检准备工作：在浏览器上进行预览，在报表视图下，检查所有文件的状态，选择要发布的文件。查所有文件的状态，选择要发布的文件。发布站点：使用菜单命令发布站点：使用菜单命令“文件文件”/“”/“发布站点发布站点”。http:/http:/http:/http:/cncncn/student/00class/student/00class/student/00class/student/00classftp:/ftp:/ftp:/ftp:/cncncn/student/00class/student/00class/student/00class/student/00class