frontpage课件

1、1/72 FrontPage 2003 2/72 主要内容主要内容 3/72 1.常用网页制作软件介绍常用网页制作软件介绍 用用HTMLHTML语言编写的文件称为语言编写的文件称为HTMLHTML文件，以页面的形式呈文件，以页面的形式呈 现在用户的屏幕上。现在用户的屏幕上。 4/72 （1 1） Dreamweaver Dreamweaver： 所见即所得所见即所得 的网页编辑工具；的网页编辑工具； （2 2） FireworksFireworks：针对网络图形设计的工具软件；：针对网络图形设计的工具软件； （3 3） FlashFlash：矢量图形编辑和交互式动画制作软件；：矢量图形编辑和交

2、互式动画制作软件； 网页三剑客网页三剑客1 1.常用网页制作软件介绍常用网页制作软件介绍 5/72 FrontPage 2003 FrontPage 2003是微软公司最近推出的是微软公司最近推出的Microsoft Microsoft Office SystemOffice System套装软件的重要组成部分。套装软件的重要组成部分。FrontPageFrontPage是一是一 款所见即所得的网页制作软件，该软件以其强大的向导功款所见即所得的网页制作软件，该软件以其强大的向导功 能和简单易用而著称；能和简单易用而著称； FrontFrontPage 2003Page 2003 2 1.常用网

3、页制作软件介绍常用网页制作软件介绍 6/72 2. WWW 的基本知识的基本知识 存放网页的服务器存放网页的服务器 。 网页的地址。网页的地址。 基本结构：服务器基本结构：服务器 目录目录 文件名文件名 7/72 ASP（Active Server Pages) JSP (JavaServer Pages) PHP (Hypertext Preprocessor) 2. WWW 的基本知识的基本知识 8/72 是网页技术的基础，它使用一些约定的标记（是网页技术的基础，它使用一些约定的标记（tagtag）对文对文 本进行标注，定义网页的数据格式，描述本进行标注，定义网页的数据格式，描述WebWe

4、b页中的信息，页中的信息， 控制信息的显示。控制信息的显示。 HTML HTML语言编写的文件称为语言编写的文件称为HTMLHTML文件文件。用。用HTMLHTML语言编写的语言编写的 网页实际上是一种文本文件，网页实际上是一种文本文件，它以它以.htm.htm或或.html.html为扩展名为扩展名， 可以可以使用任何文本处理软件（例如：记事本）编写使用任何文本处理软件（例如：记事本）编写。 3. HTML语言简介语言简介 9/72 3. HTML语言简介语言简介 10/72 3. HTML语言简介语言简介 11/72 （1 1）文本内容：含有需要展现的具体信息。）文本内容：含有需要展现的具

5、体信息。 （2 2）HTMLHTML标记：负责控制文本显示的外观和版式。标记：负责控制文本显示的外观和版式。 3. HTML语言简介语言简介 12/72 （1 1）标记名文本内容标记名）标记名文本内容标记名 （2 2）标记名）标记名 属性属性1=1=值值1 1 属性属性2=2=值值2 2 文本内容文本内容 标记名标记名 3. HTML语言简介语言简介 标记名写在标记名写在“”内。内。多数多数HTMLHTML标记标记同时具有起始和结束标记，并且成对同时具有起始和结束标记，并且成对 出现。出现。HTMLHTML标记不区分大小写。标记不区分大小写。 其中标记名和属性之间用其中标记名和属性之间用空格分

6、隔空格分隔。如果标记有多种属性，属性之间也要。如果标记有多种属性，属性之间也要 用空格分隔。用空格分隔。 13/72 （1 1）头部（头部（HeadHead）：）：由由 head和和/head标记定义。标记定义。 （2 2）正文主体（正文主体（BodyBody） ：由：由 body和和/body标记定义。标记定义。 3. HTML语言简介语言简介 3. HTML语言简介语言简介 一般一般HTMLHTML文件都是以文件都是以开头，以开头，以结束。结束。 1 1）头部（头部（HeadHead） H T M LH T M L 文 件 的 头 部 由文 件 的 头 部 由 和和 / h e a d 标

7、 记 定 义 。标 记 定 义 。 ，它用于定义网页文件的标题。，它用于定义网页文件的标题。 2 2）正文主体（）正文主体（BodyBody） 由由和和标记定义。标记定义。 其中，其中，bgcolorbgcolor为背景颜色为背景颜色，colorcolor为文本颜色为文本颜色。n n为六位十六进制数为六位十六进制数。 如果网页使用背景图像，格式如下：如果网页使用背景图像，格式如下： body 3. HTML语言简介语言简介 案例回顾案例回顾 3. HTML语言简介语言简介 3. HTML语言简介语言简介 3. HTML语言简介语言简介 3. HTML语言简介语言简介 3. HTML语言简介语言

8、简介 案例回顾案例回顾 3. HTML语言简介语言简介 22/72 3. HTML语言简介语言简介 23/72 3. HTML语言简介语言简介 24/72 3. HTML语言简介语言简介 25/72 3. HTML语言简介语言简介 26/72 4. FrontPage2003 应用应用 27/72 4. FrontPage2003 应用应用 标题栏菜单栏常用工具栏格式工具栏 视图栏 标记栏 工作区 4. FrontPage2003 应用应用 29/72 4. FrontPage2003 应用应用 站点是指一个专门用来存放网站文件的站点是指一个专门用来存放网站文件的 文件夹，需要一个名字和一个根

9、目录，以后文件夹，需要一个名字和一个根目录，以后 所有站点的文件都将存放在这个根目录下。所有站点的文件都将存放在这个根目录下。 30/72 4. FrontPage2003 应用应用 站点的创建有以下几种方法：站点的创建有以下几种方法： 利用向导创建利用向导创建 利用模板创建利用模板创建 1 2 自定义站点自定义站点 3 4. FrontPage2003 应用应用 32/72 网网 页页 视视 图图 1 文文 件件 夹夹 视视 图图 2 报报 表表 视视 图图 3 导导 航航 视视 图图 4 超超 链链 接接 视视 图图 5 任任 务务 视视 图图 6 网页视图是网页视图是 FRONTPAGE

10、 最常用的视图最常用的视图 ，网页的创建，网页的创建 、编辑、预览、编辑、预览 等都在该视图等都在该视图 中进行。中进行。 文件夹视图文件夹视图 下，站点显示下，站点显示 为一组文件和为一组文件和 文件夹，可在文件夹，可在 此视图中创建此视图中创建 、移动和删除、移动和删除 文件或文件夹文件或文件夹 。 报表视图可报表视图可 以方便的了解以方便的了解 当前站点的文当前站点的文 件内容、更新件内容、更新 链接情况、组链接情况、组 件错误，所有件错误，所有 文件列表及变文件列表及变 化情况。化情况。 导航视图可导航视图可 以方便地观察以方便地观察 站点的链接结站点的链接结 构，以层状组构，以层状组

11、 织结构图得形织结构图得形 式显示式显示。 超链接视超链接视 图将当前站点图将当前站点 显示为链接文显示为链接文 件的一个网络件的一个网络 ，它就象一张，它就象一张 地图，表明站地图，表明站 点中的超级链点中的超级链 接接 任务视图任务视图 主要用来创建主要用来创建 和管理任务，和管理任务， 列出了当前站列出了当前站 点尚未完成的点尚未完成的 任务任务。 4. FrontPage2003 应用应用 33/72 新建：新建：“文件文件”-“-“新建新建”-“-“新建新建”任务窗格任务窗格- -“-“新建网页新建网页”-“-“其他网页模板其他网页模板”。 打开：打开：“文件文件”-“-“打开打开”

12、或或“常用常用”工具栏的工具栏的“打开打开” 按钮，在弹出的按钮，在弹出的“打开文件打开文件”对话框中选择相应的网页；对话框中选择相应的网页； 如需要打开的文件已在打开的网站中，在文件夹视图中双击如需要打开的文件已在打开的网站中，在文件夹视图中双击 该网页图标即可将其打开。该网页图标即可将其打开。 保存：保存：“文件文件”-“-“保存保存”或或“常用常用”工具栏的工具栏的“保存保存”按按 钮，如需另存可使用钮，如需另存可使用“文件文件”菜单的菜单的“另存为另存为”命令。命令。 4. FrontPage2003 应用应用 4. FrontPage2003 应用应用 4. FrontPage200

13、3 应用应用 36/72 在在FrontPage2003FrontPage2003中预览网页中预览网页1 在浏览器中预览网页在浏览器中预览网页2 4. FrontPage2003 应用应用 37/72 插入水平线插入水平线1 4. FrontPage2003 应用应用 “插入插入”-“-“水平线水平线” 修改：修改： u双击水平线双击水平线 u选中水平线右键水平线属性选中水平线右键水平线属性 38/72 插入图像插入图像 2 4. FrontPage2003 应用应用 “插入插入”-“-“图片图片” 设置图片属性设置图片属性 双击双击图片图片 选中选中图片图片-格式格式-属性属性 选中选中图片

14、图片右键右键图片图片属性属性 编辑图片编辑图片 利用图片工具栏旋转等利用图片工具栏旋转等 39/72 插入字幕 3 4. FrontPage2003 应用应用 40/72 插入交互式按钮插入交互式按钮4 4. FrontPage2003 应用应用 “ “插入插入”-“Web-“Web组件组件”-“-“组件类型组件类型”-“-“动态效果动态效果” -“-“选择一种效果选择一种效果”-“-“交互式按钮交互式按钮”-“-“完成完成” 设置按钮设置按钮 字体字体 图像图像 链接链接 41/72 插入站点计数器插入站点计数器5 4. FrontPage2003 应用应用 “插入插入”-“Web-“Web

15、组件组件”-“-“插入插入WebWeb组件组件”-“-“组件类型组件类型”- “计数器计数器”-“-“选择计数器样式选择计数器样式”-“-“完成完成”-“-“计数器属性计数器属性” 42/72 建立文本超级链接建立文本超级链接1 4. FrontPage2003 应用应用 43/72 建立图像超级链接建立图像超级链接2 4. FrontPage2003 应用应用 4. FrontPage2003 应用应用 3建立热点超级链接建立热点超级链接 45/72 书签超级链接书签超级链接4 4. FrontPage2003 应用应用 应用书签能够更严格地控制用户到达网页内的某个具体位置。应用书签能够更严

16、格地控制用户到达网页内的某个具体位置。 书签是网页中被标记的位置或被标记的文本。书签是网页中被标记的位置或被标记的文本。 1 1）插入书签）插入书签 （1 1）选中作为书签的文本，或将光标定位在要插入书签的位置。）选中作为书签的文本，或将光标定位在要插入书签的位置。 （2 2） “插入插入”-“-“书签书签”-“-“确定确定” 2 2）创建书签超链接）创建书签超链接 （1 1）选定要定义超链接的文本或图片；）选定要定义超链接的文本或图片； （2 2）“插入插入”-“-“超链接超链接”命令，命令，-“-“链接到链接到”-“-“本文本文 档中的位置档中的位置”，选择要链接的书签；，选择要链接的书签

17、；-“-“确定确定” 46/72 创建电子邮件链接创建电子邮件链接5 4. FrontPage2003 应用应用 （1 1）选择作为电子邮件超链接的文本或图片；）选择作为电子邮件超链接的文本或图片； （2 2）“插入插入”-“-“超链接超链接”-“-“链接到链接到”- -“-“电子邮件地址电子邮件地址”-“-“确定确定”。 47/72 下载文件超级链接下载文件超级链接6 4. FrontPage2003 应用应用 （1 1）选择作为文件超链接的文本或图片；）选择作为文件超链接的文本或图片； （2 2）“插入插入”-“-“超链接超链接”-“-“选择一个压缩选择一个压缩 文件文件”-“-“确定确定

18、”。 4. FrontPage2003 应用应用 2. 2. 设置表格属性设置表格属性 将光标定位到表格内部或选中表格将光标定位到表格内部或选中表格,“,“表格表格”-“-“表格属表格属 性性”“”“表格表格” 3. 3. 设置单元格属性设置单元格属性 将光标定位到单元格将光标定位到单元格,“,“表格表格”-“-“表格属性表格属性”单元格单元格 表格的其他操作（插入、删除、调整等）类似与表格的其他操作（插入、删除、调整等）类似与word2003word2003！ 49/72 v单元格间距单元格间距 v边框粗细（通常设为边框粗细（通常设为0 0） v单元格边距（通常设为单元格边距（通常设为0 0

19、） 几个概念几个概念1 表格与单元格属性表格与单元格属性2 表格的相关操作表格的相关操作3 插入表格、插入删除插入表格、插入删除 行和列、行高与列宽的调行和列、行高与列宽的调 整、合并与拆分单元格。整、合并与拆分单元格。 4. FrontPage2003 应用应用 50/72 4. FrontPage2003 应用应用 51/72 在在FRONTPAGE中，可以把一个浏中，可以把一个浏 览器窗口分成几个区域，每一个部分可览器窗口分成几个区域，每一个部分可 以显示不同的网页。以显示不同的网页。 4. FrontPage2003 应用应用 52/72 4. FrontPage2003 应用应用 4

20、. FrontPage2003 应用应用 4. FrontPage2003 应用应用 4. FrontPage2003 应用应用 4. FrontPage2003 应用应用 57/72 表单的组成表单的组成1 4. FrontPage2003 应用应用 58/72 插入文本框插入文本框2 4. FrontPage2003 应用应用 59/72 插入文本区插入文本区3 4. FrontPage2003 应用应用 与文本框的不同之处在于文本区中可以接受多行文本与文本框的不同之处在于文本区中可以接受多行文本 “插入插入”-“表单表单”-“文本区文本区” 60/72 插入复选框插入复选框 4 4. F

21、rontPage2003 应用应用 将光标放在要插入复选框的位置，将光标放在要插入复选框的位置，“插入插入”-“表单表单” -“复选框复选框”在复选框旁键入文字进行说明在复选框旁键入文字进行说明 61/72 插入选项按钮插入选项按钮5 4. FrontPage2003 应用应用 将光标放在要插入选项按钮的位置，将光标放在要插入选项按钮的位置，“插入插入”- “表单表单”-“选项按钮选项按钮”。 “选项按钮属性选项按钮属性”对话框中，对话框中，“组名称组名称”用来设用来设 置此选项按钮所属组的名称，如果把多个选项按置此选项按钮所属组的名称，如果把多个选项按 钮编成一组，必须使它们的组名称相同。钮编成一组，必须使它们的组名称相同。 62/72 插入分组框插入分组框6 4. FrontPage2003 应用应用 将一组相关的控件或文本与网页或当前表单中的其他信将一组相关的控件或文本与网页或当前表单中的其他信 息分开。息分开。 将光标放在要插入分组框的位置，使用将光标放在要插入分组框的位置，使用“插入插入” ” -