FrontPage制作网页.ppt

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

1、FrontPageFrontPage制作网页制作网页网站与网页制作网站与网页制作 2121世世纪纪，网网站站是是一一个个人人的的门门面面，拥拥有有个个人人网网站站是是一一个个骄骄傲傲。是是宣宣传传自自己己、找找工工作作、找朋友等的极好工具。找朋友等的极好工具。可以作为一种能力而享用终生。可以作为一种能力而享用终生。WordWord操作是制作网页的必备基础。操作是制作网页的必备基础。网站与网页介绍网站与网页介绍网络空间申请介绍网络空间申请介绍普通网页的编辑普通网页的编辑 总体规划总体规划创建文件夹创建文件夹搜集素材搜集素材制作网页制作网页用用FrontPage 2000FrontPage 200

2、0制作网页制作网页 FrontPage2000FrontPage2000是一个建立和管理是一个建立和管理WebWeb站点、编写站点、编写WebWeb页的工具软件。它采页的工具软件。它采用所见即所得的方式编辑网页，利用它用所见即所得的方式编辑网页，利用它可以轻松地组织、编辑网页并发布到指可以轻松地组织、编辑网页并发布到指定的站点上。定的站点上。FrontPage的视图 FrontPage有多种视图，完成不同的功能-主要介绍三种普通视图直接在网页中输入文字、插入图片、插入表格及编辑各种网页元素HTML视图查看网页的HTML源代码，并可修改源代码预览视图预览网页效果FrontPageFrontPag

3、e基本操作基本操作 新建网页创建一个空白网页利用模板制作网页在网页中输入内容为网页设置标题在网页上单击右键网页属性在标题栏输入并保存保存网页文件另存为index.htm(主页)打开文件或站点打开文件/站点 查看网页的HTML源代码HTML视图FrontPage中预览网页预览视图浏览器中预览网页工具栏按钮或Ctrl+Shift+B FrontPage基本操作基本操作网页主题网页主题网页应用主题网页应用主题菜单菜单 格式格式主题主题，选择一个主题，并选择，选择一个主题，并选择 所选的所选的网页网页 单选框。还可以选择单选框。还可以选择 鲜艳的颜色鲜艳的颜色、动态图形动态图形 复选框复选框设置主题后

4、，由于主题控制了网页的背景属性，因此设置主题后，由于主题控制了网页的背景属性，因此不能再添加背景。不能再添加背景。删除网页中的主题：选菜单删除网页中的主题：选菜单 格式格式主题主题，并选择，并选择 所选的网页所选的网页 单选框，在列表中单击单选框，在列表中单击“无主题无主题”页面的修饰1、插入图片2、配背景图3、链接其它页面4、插入视频和音频普通网页的编辑普通网页的编辑 输入文字输入文字设置文字及段落格式设置文字及段落格式 加入项目列表加入项目列表选中所要设置的段落，单击菜单格式选中所要设置的段落，单击菜单格式项目符号和编号项目符号和编号加入水平分隔线加入水平分隔线插入插入水平线水平线 （可用

5、线条图片做水平线）（可用线条图片做水平线）网页属性网页属性设置：菜单文件属性右键菜单标题设置：网页标题背景音乐：自动播放背景声音，“位置”是声音文件的位置，还可设置播放“循环次数”页边距设置：设置网页上显示的第一个对象相对于网页左上角的位置（像素），页边距设置为0，则最大限度利用网页空间网页属性网页属性设置设置背景图片：单击浏览按钮，选定图像文件作为网页的背景设置成水印：浏览网页时，使用滚动条，背景图像不随网页的其它内容一起滚动。背景颜色的设置：设置网页的背景颜色时，若使用背景图片，则覆盖背景颜色网页中加入图片插入图片：菜单文件属性插入的图片类型有多种 bmp,jpg,wmf,gif，保存时则

6、转换为GIF或JPG格式插入剪贴画插入来自文件的图片插入图片线条作分隔线保存文件时，将图片文件保存到image文件夹中，还可以改变图片的名字编辑图片编辑图片：图片工具栏图片上添加文字：文本按钮图片的翻转：左、右、水平、垂直设置透明色：透明图片制作自动缩略图：缩小大图片修改图片属性：右键菜单图片属性图片来源及格式：图片的目标源图片的外观：大小、对齐方式（图文混排)图片的超级链接加入超级链接插入超级链接菜单插入超链接选择目标源l使用文字作超级链接l为图片设置超级链接l设置书签，加入超级链接l图像热点链接图像地图图像地图上建立多个超级链接选定图像地图的图片（选定图像地图的图片（GIF）使用图片工具栏

7、设置图片热点：长方形、圆形使用图片工具栏设置图片热点：长方形、圆形在在“创建超链接创建超链接”对话框中，指定热点的跳转目对话框中，指定热点的跳转目标标在图像上设置热点按钮，加入超级链接。图像上的文本作为热点，使用鼠标右键“图片热点属性”设置超级链接超级链接的外观改变菜单格式背景，在网页属性的“背景”选项卡，设置超级链接的不同颜色。取消超级链接菜单插入超链接，取消URL链接地址网页的布局网页的布局加入表格加入表格最初，HTML表格被设计为在行列中显示简单的文本；现在，它已成为一种重要的Web页布局技术。表格是排列网页元素空间位置最为灵活的方法之一，它还可在浏览者调整网页大小时正确保持网页的外观。

8、FrontPage提供五种创建HTML表格的不同方法。选用哪种方法，取决于个人的习惯和需要显示的内容类型。下面一一介绍这五种方法。新建表格新建表格1使用菜单插入表格使用菜单插入表格将将光光标标移移至至要要插插入入表表格格的的地地方方，选选菜菜单单命命令令【表表格格】【插入插入】【表格表格】2使用鼠标手工绘制表格使用鼠标手工绘制表格（1）使用菜单命令）使用菜单命令【表格表格】【手绘表格手绘表格】3使用工具栏上的使用工具栏上的“插入表格插入表格”按钮按钮4将文本转换为表格将文本转换为表格可可以以将将已已分分隔隔的的文文本本(利利用用分分隔隔字字符符分分隔隔出出行行与与列列)转转换换成成表表格格内容

9、。方法是：内容。方法是：选选中中要要转转换换的的文文本本，单单击击菜菜单单【表表格格】【转转换换】【文字到表格文字到表格】5粘贴表格数据粘贴表格数据表格的编辑修改表格的编辑修改1单元格、行列和表格的选择鼠标拖动；使用菜单【表格】【选定】下的各项。2行和列的插入及删除行和列的插入及删除【表格】【插入】【行或列】3单元格的合并和拆分【表格】【合并单元格】【表格】【拆分单元格】表格的属性设置表格的属性设置表格的整体属性表格的整体属性鼠标右键，选择【表格属性】。菜单命令【表格】【属性】【表格】单元格的属性鼠标右键，在快捷菜单中选“单元格属性”在网页布局中使用表格在网页布局中使用表格设计布局的草图设计布

10、局的草图要先在纸上画出页面的布局草图来。其中有两个要点：尺寸选择：目前一般800600的分辨率为约定俗成的浏览模式。所以为了照顾大多数访问者，页面的尺寸以800600的分辨率为佳。造型的选择：初步确定在何处放置页面的标题、图片以及大块文字等在网页布局中使用表格在网页布局中使用表格插入用于布局的表格决定在水平和垂直方向上所需的单元格数量（插入时确定行数和列数）然后为需要跨越多行或多列的对象合并单元格。不要对单元格合并、拆分之后又插入新的单元格。一般来说，进行布局所创建的表格通常不带有边框。，在分辨率为800600的情形下，表格的总宽度以小于780像素为好。如果页面较长时，同一页面上可以依次插入多

11、个表格，用于不同部分的布局在单元格中加入图片和文本在单元格中加入图片和文本加入的图片的大小以及文本的多少，最好与预先设计的单元格的大小接近，否则表格的布局也会有些乱。在网页布局中使用透明图片在网页布局中使用透明图片插入透明GIF图片对单元格尺寸的控制要比“单元格属性”对话框中的设置更为有效。表格仅为网页设计者提供一种用于x-y定位的粗糙的工具，要进行更为精细的控制，许多设计者都采用透明GIF图象。希望在网页上任意位置添加一些空白时，只要放置一幅完全透明的GIF图象即可。这种方法在以下情况下效果最好：l缩进段落首行时；l设置段落间分隔线的间距时；l使对象基于窗口、框架或表格边框进行缩进时；l保证

12、表格的最小列宽时（在表格布局时使用最多）。加入加入FrontPageFrontPage组件组件根据其产生作用所需条件的不同，FrontPage组件可以分成三种不同的类型：1基于FrontPage站点的组件：这些组件仅当将网页保存到FrontPage站点时才会运行和有效。2基于服务器端的FrontPage组件：这些组件需要 在 站 点 服 务 器 中 运 行 特 殊 的 软 件，即FrontPage服 务 器 扩 展（FrontPage Server Extension）。3网页层次的FrontPage组件：这些组件的运行既不需要FrontPage站点，也不需要FrontPage服务器扩展，直接

13、插入到普通网页中即可。使用网页层次的使用网页层次的FrontPageFrontPage组件组件横幅广告管理器横幅广告管理器：根据指定的时间间隔连续显示一系列图片。图片会不停地发生变化。注释注释：文本在FrontPage中可见，但不显示在浏览器中。日期和时间日期和时间：显示网页最近编辑或更新的日期。悬停按钮悬停按钮：显示一个图形按钮。当站点访问者将鼠标指针置于上方时，会更改按钮的显示外观。此按钮还可作为超级链接的媒介。包含网页包含网页：显示网页内部某个网页的内容。典型的“包含网页”包含站点中重复出现的内容，这样可以保持内容的统一，而且维护方便。滚动字幕滚动字幕：在屏幕中的某个区域生成滚动显示的一

14、行文本。预定包含网页预定包含网页：类似于“包含网页”组件，但只能应用于指定的时间段内，不在指定的时间内，将显示为不同的网页或者不预显示。预定图片预定图片：类似于“预定包含网页”组件，但仅显示图片而不是其他的Web页。使用网页层次的使用网页层次的FrontPageFrontPage组件组件横幅广告管理器使用菜单【插入】【组件】【横幅广告管理器】悬停按钮【插入】【组件】【悬停按钮】滚动字幕滚动字幕创建字幕的方法是，使用菜单【插入】【组件】【字幕】使用基于使用基于FrontPageFrontPage站点的组件站点的组件主题：是专业人员设计的颜色和类型的结合体，FrontPage能在单个网页和整个站点

15、应用主题。格式主题颜色主本：可以在FrontPage中设置一个网页从其他的网页得到颜色方案和背景。通过控制一个主本网页的主题，进而控制一个站点的所有网页的外观。使用基于使用基于FrontPageFrontPage站点的组件站点的组件导航栏：自动地构造在一个站点中链接网页的菜单。使用导航栏需要在FrontPage的“导航”视图中首先输入结构信息，然后在每个网页中插入和设置一个或多个导航栏。网页横幅：用文本显示当前网页的导航视图标题。共享边框：FrontPage能在站点所有网页或选定的网页上应用标准的标题、注解、右边框或左边框。由于在每一网页上的这样的边框显示相同的内容，所以一个网页上的共享边框的

16、改变会引起所有相关网页的改变。方法：插入/共享边框；插入/导航栏；添加到导航视图（拖、导航栏属性）查看导航栏使用基于使用基于FrontPageFrontPage站点的组件站点的组件替代：FrontPage常常用现有的字符串作为站点的参数值，并且当站点需要时，插入参数值。包含网页：对于一个复杂的网页，FrontPage可以让其包含其他的网页。这个组件在“网页层次的FrontPage组件”中也有，但它在FrontPage站点中使用时，效果最 好。原 因 是，当 更 新 一 个 被 包 含 的 网 页 时，FrontPage将自动更新同一站点的包括该网页的网页。使用基于使用基于FrontPageFr

17、ontPage站点的组件站点的组件目录：该组件创建一个定制的、可选择的基于超级链接分析的目录，该目录从当前站点的给定网页中开始。类别：在同一站点的网页上创建一系列的用给定的类别码编码的超链接。在文件夹列表或视图中的网页上单击鼠标右键，然后选择【属性】命令，可以设定网页的类别码。共享边框共享边框是创建具有一致外观的网页的最快速最灵活而且最容易的方法。共享边框就是站点上有一个或多个网页共享的区域。选菜单【格式】【共享边框】在设置好共享边框后，就可以添加内容也可以【插入】【导航栏】或【导航栏属性】使用基于服务器端的FrontPage组件【插入】【组件】【站点计数器】动态效果设置 网页的过渡可以直接使

18、用菜单【格式】【网页过渡】网页元素的动态效果 选中后：【格式】【动态HTML效果】表单 在在FrontPage中中创建表建表单【插入】【表单】【表单】【插入】【表单】（其他组件）用鼠标右键单击表单中的任意位置，选择【表单属性】设置表单元素的属性双击表单元素，（也可用鼠标右键单击要修改的表单元素）在快捷菜单中选择“表单域属性”框架 理解框架 图例书上例：在框架集中定义了三个框架：顶部的是横幅框架，左边的是目录框架，右边的则是主框架。框架集显示的Web页的URL地址，共四个HTML文件例:框架中的超级链接 创建和编辑框架创建横幅网页 创建目录页创建欢迎页（首页）创建框架集（见后）创建具体的内容网页

19、，以备超级连接时使用 创建和编辑框架集创建和编辑框架集创建一个新的框架集【文件】【新建】【网页】设置超级链接 在FrontPage创建的框架集中，每个框架都有一个名称，在本例的“横幅和目录”型的框架集中，横幅框架、目录框架、主框架的名称分别为banner、contents和main。框架的名称可以在“框架网页HTML”视图中查看 设置框架的属性置框架的属性用鼠标右键单击框架，然后在弹出的快捷菜单中选“框架属性”命令 如何设计制作一个完整的个人网站 内容的规划和设计内容的规划和设计确定主题和名称 准备内容 设计网站的目录结构和链接结构设计网站的目录结构和链接结构设计网站的目录结构(见下页)确定网站的链接结构 设计网站的整体风格 网站的上传和测试 申请主页空间 上传网站 测试网站 DOCIMAGESMUSICVIDEO.WEBX目录结构示例目录结构示例如已经链接，改变时必须在FrontPage中进行