frontpage网页作品

篇一：教你如何做网页--frontpage

《很好轻松做网页》第二章：网页制作例1（上）

表格、单元格及其属性

本章通过制作网页wj/jiandeng.htm ，要求掌握的知识要点是：

1． 设置网页背景色；

2． 运用表格定位布局以及表格（单元格）属性的设置；

3． 生成自动缩略图；

4． 插入水平线，设置水平线的属性；

5． 输入网址和邮箱地址并制作超链接；

6． 为文字和图片制作超链接；

7． 为超链接文本制作翻转效果；

8． 制作书签超链接。

现在我们就来制作如图2-1所示这张网页。

图2-1 网页wj/jiandeng.htm在 Frontpage 中的页面状况

一、新建网页

1. 启动frontpage 2000 程序，显示一个空白网页，并自动命名为 new_ page_1.htm （如果

制作过程中又新建了一个网页，frontpage就将其命名为 new_page_2.htm ，以此类推。Frontpage 可以同时打开多个网页，并且能通过“窗口”菜单进行切换）。

2. 设置背景颜色：菜单→“格式”→“背景”，弹出“网页属性”对话框。

选择“背景”选项卡→颜色→背景，在下拉菜单里点击“其他颜色”→选择“值：Hex={00,99,cc}”（直接输入0099cc即可，英文字母不分大小写）。点击“自定义”按钮，将会有更多的选择，不过你可别挑花了眼喔！

如图2-2、图2-3所示。

图2-2 设置网页背景色

图2-3 选择颜色

二、插入表格

根据内容，本网页的布局主要是三张表格。让我们依次制作。

1. 第一张表格

⑴菜单→表格→插入→表格。弹出“插入表格”对话框

大小：１行 ２列

布局：对齐方式 水平居中；

边框粗细 ０；

单元格边距 ０；

单元格间距 ０；

指定宽度 750 象素。如图2-4所示。

注意：此处的表格宽度不宜选择“百分比”，因为“百分比”是个相对数，会随浏览窗口的大小而伸缩，会把你原先设计好的网页排版搞得面目全非。

图2-4 插入表格

⑵设置表格的背景颜色

点击鼠标右键，弹出快捷菜单。点击“表格属性”，弹出“表格属性”对话框。背景→颜色→其他颜色→选择“值：Hex = {00,66,99}”。 如图2-5所示。

图2-5 设置表格背景色

⑶输入文字、插入图片

确定文字样式：在格式工具栏上选择字体Arial Black，14磅，加粗，字体颜色：白色。如图2-6所示。输入大写 WAHGYOUJIANDENG 。

图2-6 设置文字样式

确定文字样式：在格式工具栏上选择字体“默认”，10磅，加粗，字体颜色：白色。输入“欢迎推荐 欢迎来稿！”

光标移到表格第二列，点击格式工具栏上的“居中”图标。

插入图片：菜单→插入→图片→来自文件→打开存储图片的文件夹images，选择所需图片。

输入“返回主页”,字体为“默认”，10磅，白色。

OK！第一个表格的制作任务完成了。如图2-7。

图2-7

2. 第二张表格

⑴菜单→表格→插入→表格。弹出“插入表格”对话框。

大小：１行 9列

布局：对齐方式 水平居中；

边框粗细 1；

单元格边距 1；

单元格间距 1；

指定宽度 750像素。如图2-8所示。

图2-8 边框粗细设置为1的效果

⑵插入图片、输入文字

插入图片：菜单→插入→图片→来自文件→打开images文件夹，选择所需图片→确定。 复制图片：由于这是一个栏目菜单，以后各列的剪头图片可采取复制方式解决。选中图片，右击鼠标，弹出快捷菜单→复制，光标移向下一列，右击键→粘贴。以后各列类推。

确定文字样式：选择字体“默认”，10磅，字体颜色：“自动”

输入文字：分别在各列输入文字：五十乱弹 情感档案 人生百态 网友作品 网友荐登 健康茶座 财富驿站 边学边做 连环画。

OK！

3. 第三张表格

⑴插入表格：4行3列；水平居中；边框粗细、单元格边距、单元格间距均为０；

指定宽度 750 像素。

⑵设置表格背景色

点击右键，弹出快捷菜单，选择“表格属性”。“表格属性”对话框：背景→颜色→白色。确定。

⑶输入内容。本表格所显示的内容以“列”排序分类。

▲第1列要输入4张原本大小不一的图片，插入前要把它们制作成宽度相同的缩略图。点击菜单→ 工具→ 网页选项，在弹出的“网页选项”对话框中选择“自动缩略图”选项卡，设置宽度为120像素，不选择“边框粗细”和“边缘凹凸效果”两项，如选择，效果如范例所示。如图2-9。

图2-9 设置自动缩略图宽度

激活图片工具栏。菜单→ 查看→ 工具栏→ 图片。

光标移至第1列第1行，左对齐，插入图片《江南小镇》。点击图片，使之处于选中状态，再点击图片工具栏上的“自动缩略图”按钮。如图2-10所示，图片就自动缩小成所设置的宽度120像素。

图2-10 图片工具栏上的自动缩略图按钮

光标移至第1列第2行，如上所述，插入图片《含蓄的金秋》，选中，进行缩略；

光标移至第1列第3行 插入图片《布达拉宫》，缩略；

光标移至第1列第4行 插入图片《恋爱季节》，缩略。

▲制作第2列：

第1行 插入题图《网友荐登》，居中；如图2-11所示。

图2-11 格式工具栏上的“居中”按钮

第2行 右击鼠标，弹出快捷菜单→单元格属性，跳出“单元格属性”对话框，布局栏：水平对齐方式：默认；垂直对齐方式：顶边对齐。如图2-12所示。

图2-12 单元格属性中“布局”

插入表格：1行，1列；水平居中；边框粗细、单元格边距、单元格间距均为0；指定宽度：90 百分比。

在表格内输入文字。字体：默认 10磅， 字体颜色：db8400。“好货总是由众人的眼光挑选出来的，别错过了机会噢……”

篇二：用FrontPage创建网页

《用FrontPage创建网页》教学设计

一、教学内容分析：

FrontPage是微软办公自动化软件Office中的一个极为重要的组件之一，它具有功能强大、操作方便等特点，是目前最为流行的网页制作与站点管理工具之一。FrontPage 既是简单实用的网页编辑器，又是一个浏览，有“所见即所得”的效果，创建网页的过程中还可以不时地在文本编辑器和浏览之间切换，以查看编写页面的效果。而且，六年级学生已经学过Word2003或PowerPoint2003的操作，而它们又出于同一家族，它们有许多相似之处，FrontPage的许多菜单、工具的操作会有一种似曾相识之感，教学过程中，要注意引导学生进行知识的迁移，这些都有助于学生轻松进入FrontPage的世界。 二、学生学情分析

教学对象是六年级的学生，他们会对许多事物充满好奇，求知欲较强，且创作欲望和表现力也较强，对于教师布置的任务能够认真对待。因此课中，鼓励他们独立完成作品，培养他们自主学习和合作探究的意识。因为有Word软件的学习经验，学生在学习FrontPage 软件时会有似曾相识的感觉，很多的知识点都已学习过，所以教师不要拘泥于教材，要根据学生的实际情况，有的放矢，充分激发学生学习兴趣，最大限度挖掘学生的创造潜能。但是学生之间还存在一定差异，信息技术认知能力、实际操作能力和知识水平都存在一定的差异。 三、教学目标：

【知识与技能】

（1）初步了解FrontPage 2003的基本功能。

（2）掌握FrontPage 2003的启动和掌握在网页上文字的输入。 （3）熟悉FrontPage 2003窗口的组成。

（4）通过实例学会创建简单的网页和保存网页文件。 【过程与方法】

（1）能用FrontPage 2003制作简单网页；具有一定探索新应用软件的能力

（2）通过对比观察，培养学生利用已学知识去解决问题的能力，培养学生敢于尝试和自主探究的学习能力；培养学生的相互协作能力和知识的迁移能力。

【情感态度与价值观】

（1）激发学生热爱自然、热爱环境、热爱家乡的情感。 （2）激发学生的学习热情和创作热情，在亲历学习过程中，获取知识、体验成功，从而提高学习兴趣。

（3）培养审美意识，促进学生形成良好的审美观；提高信息素养。

（4）在合作学习中，学会交流与协作，提高学生的合作意识和合作能力。

四、教学重点和教学难点

【教学重点】 FrontPage 2003的启动以及FrontPage 2003的窗口组成。

【教学难点】 通过实例学会用FrontPage 2003创建简单的网页

和保存网页文件。

【处理思路】 在介绍FrontPage 2003的窗口组成时运用比较法，打开Word 2003的工作窗口和FrontPage 2003的窗口进行比较，让学生找出他们相似之处和不同之处。如何在FrontPage 编辑器“普通”状态中简单地创建网页，预览网页，教师先进行示范操作、讲解。然后，学生完成练习，师生共同解决问题。 五、教学策略设计

本课内容设计中，注重创设教学情景，有效设计问题，激发学生的学习兴趣和求知欲，引导学生通过积极有效的独立自主的探究和比较，获得知识。在教学设计过程中，本人将本课的教学过程分为以下六个环节：

创设情境，激起兴趣（2分钟） 引出问题，尝试练习（8分钟） 任务分析，演示讲解（8分钟） 自主创作，小组协作（12分钟） 交流评价，体验成功（8分钟） 小结探究，课外延伸（2分钟） 六、教学方法

“创设情境法”、“比较法”、 “任务驱动法”、“演示法” 七、教学准备

硬件：多媒体网络教室， 40台学生机

软件：FrontPage 2003软件，教师自制的教学课件，教师自制

的网页

学生分组：把学生分为几个小组，每组4人，并由学生选好组长。 八、教学安排：2课时 九、教学过程（见下表）

篇三：FrontPage全套教案

Frontpage网页制作知识准备

教学目标：

1、通过对网站的赏析活动，进一步认识网站、首页，为网页制作做知识储备。 2、培养学生的合作学习能力、探究问题的兴趣与能力。 3、培养学生的鉴赏能力。 4、激发学生为祖国信息产业的发展作贡献的爱国情感。

教学重点：

1、首页的地位和作用

2、首页的功能模块

3、网站的形式、内容与主题之间的关系

教学难点：

正确理解网站的形式、内容与主题之间的关系

课时：1课时

教学步骤：

一、导入：

近年来，我国的信息产业飞速发展，人们的经济文化水平日益提高，越来越多的家庭拥有了个人电脑，网络也由昔日的谢玉堂前燕，飞入了寻常百姓家。足不出户，鼠标轻轻一点，你就可以浏览到世界各地的信息，就可以和世界各地的朋友们聊天，你还可以给世界各地的朋友们发E-mail。网络的确给人们带来了极大的快捷与方便。

作为一名初中生，你想不想也能在网上拥有自己的一片天空、一个家园呢？ 今天我们就开始你网上家园的建设之路。

二、小组分工、合作学习：

（一）介绍基本概念

鉴赏一个网站，我们一般要从以下几个方面着手，一个是网站的主题，所谓网站的主题是指网站向大众或特定的人群传达的主要内容或建立网站的意图。第二个就是网站的首页。所谓网站的首页，就是指你打开一个网站后看到的第一页。下面 我们小组内分工合作，小组内讨论分析以下三个问题：

1、每个网站的主题是什么？。

2、首页在网站中有什么地位和作用？

3、首页有哪些功能模块？

（二）小组合作学习，初步探讨鉴赏网站的方法

学生之间相互讨论，探究问题的答案

多数学生得出结论，小组选代表汇报讨论成果

教师小结

一个网站必须有一个明确的主题，就好像我们写文章也要有明确的中心一样，否则，浏览者就会有不知所云的感觉。

第二个问题的答案显而易见，不再提问，教师直接小结提问学生一起回答。

首页是浏览者打开一个网站后第一眼看到的就是网站的首页，网站能不能吸引浏览者，在很大程度上取决于首页做得怎么样。

能不能用一个词来概括一下首页的地位与作用？

第三个问题，仍由小组选代表汇报结论

哪个小组来告诉大家你们讨论的结果？

教师小结：

首页一般有四个共有的模块，

（1)徽标（logo）和网站的名称：

一般位于左上角，是一个形象化的标志，其作用类似于商品的商标。

（2)首页大标题（banner）：

一般放网站主题词或图片，商业性的网站放置广告条。

（3)导航栏：

就像一本书或杂志的目录一样，但比书籍或杂志的目录更为重要，因为书籍我们可以一页一页的从头向后翻，而我们的网页却不可以，只有有了清楚、明晰的导航，才能让浏览者知道自己身处网站的什么位置。

（4)版权和联系方式：一般放在网页的底部，主要功能是版权声明和听取浏览者的意见或建议。

（三）再次小组合作学习，深入领会如何鉴赏网站

鉴赏获奖的学生网页作品，激发学生的积极性与自信心同时更深入的学习如何鉴赏一个网站。

我给大家带来了几个获全国一等奖的学生网页作品，你可以在你的电脑D盘student文件夹下看到她们。

小组合作，讨论分析以下三个问题：

1、这些网站的首页的布局各有什么特点？（教师演示）

2、各网站的主题色和配色有什么特点？

3、网站的形式、内容与主题之间有什么关系呢？

小组讨论

汇报分别讨论成果

三、延伸：

接下来，同学们可以自由浏览一些其他的网站，把你认为较好的网站推荐给大家。

四、总结

下面我们来一起回顾一下这节课我们都学了哪些内容。

1、首页在网站中起着关键的作用，它主要有四个共有的模块：他们人别是Logo，Banner，导航，还有版权和联系方式；

2、首页的布局主要有三种样式，一种是"口"字型，一种是"厂"字型，还有一种是"POP"型；

3、网页的在色彩的选择上也要为表现主题服务；

4、网站的要有一个明确的主题，要以内容为核心，以形式为辅助，内容和形式共同为表现主题服务。

好，有了以上的知识作为奠基，你就可以充分发挥你的想象，好好描绘一下你的网站的蓝图了。

第二节 启动frontpage2003建立站点和图片收集

教学目的：

掌握站点的建立，学会软件的启动和素材的收集，了解站点的打开和关闭。

教学重点：

创建站点，收集图片，启动frontpage2003。

教学时间：

2课时

教学步骤：

1、启动FrontPage 2003

单击任务栏上的“开始”按钮,从“程序” 菜单中选择“Microsoft FrontPage”单击。

2、FrontPage 2003的界面说明

FrontPage 2003的界面可以分成菜单栏、工具栏、视图栏和主编辑窗口4大部分。

①、菜单栏包括【文件】、【编辑】、【查看】、【插入】、【格式】、【工具】、【表格】、

【框架】、【窗口】、【帮助】等10个菜单。

工具栏单击【查看】菜单，选择【工具栏】，

②、在出现的下拉菜单中列出了几种不同的工具栏，如果菜单项前面有一个对钧号“√”，表明在界在上已显示此菜单项。如果再单击一下，将取消这一项的显示。

③、视图栏中摆列着各种管理器的图标，这些管理器包括网页管理器、文件夹管理器、报表管理器、导航管理器、超链接管理器和任务管理器等。单击管理器图标以切换到相应的管理器。

④、主编辑窗口在编辑网页时，有3种显示方式，即普通、HTML和预览。 普通显示方式是最常用的显示方式，一般是在此方式下工作。

HTML显示方式在需要直接编辑或查看网页文件的HTML代码时使用，一般是为了实现某种特殊效果（如在网页中动态显示时间）而经常使用。

预览显示方式在需要预先观察网页的显示效果时使用。当使用管理功能时，主编辑窗口相应地会显示各种任务下的文件或站点信息。

什么是站点？

站点一般简写为“Web”，实际上就是把一些信息通过Web网页的方式相互链接起来，存放在一台被称为“服务器”的计算机中，别人可以通过Web浏览器查看网页信息。站点一般以国际通用的Internet地址来表示，例如：或http://www.163.net等，进入某个站点所见到的第一页一般称为“HomePage”，中文的意思是“主页”。

什么是主页？

主页的英文名称为“HomePage”，一般认为某个站点的第一个网页叫做主页，文件名通常是“index.htm”（index.html）或“default.htm”（default.html），也就是在Web浏览器“地址”栏内输入一个网址后，用户浏览到的第一个网页。用户再通过该主页的链接可以浏览到其他网页信息。

3、新建站点

实例：使用【只有一个网页的站点】模板创建一个Web站点。

操作步骤：

（1）打开【文件】菜单，选择【新建】菜单项，在子菜单中选择【站点】菜单项，出现一个【新建】对话框，在对话框的【指定新站点的位置】项中输入新站点的存放位置。

提示：新站点的存放位置选择是磁盘存储方式，是因为考虑到实践操作中的 方便。而一个站点要让在Internet上的用户正常浏览的话，应该通过FrontPage的站点发布功能或FT文件传送方式，把该站点内容传送至能提供存放空间的Web服务器上去。

（3）单击【确定】按钮。此时FrontPage会自动以新站点名建立一个站点，并显示一个正在创建站点的提示对话框，之后该站点很快便创建好了。

新建的站点只有一个主页index.htm文件，该主页还是空的，需要对它进行编辑添加内容。同时也可以添加一些网页到该站点中去。此外，我们发现该站点中包含有两个子文件夹。一个是_private文件夹，一般用来存放一些私人的文件，这些文件不会被别人看到。另一个是images文件夹，是FrontPage专门创建用来存放图像文件的文件夹，因为FrontPage扩展服务器的图像文件的默认目录为images。

4、关闭站点

打开【文件】菜单，选择【关闭站点】菜单项，则当前站点被关闭。

5、打开站点

站点内容需要修改或添加时，必须把该站点打开。操作过程如下：

打开【文件】菜单，在下拉菜单选择【打开站点】，出现一个对话框，在对话框的【文件夹】项中输入该站点的存放位置，然后单击【打开】按钮，站点将被重新打开。

6、收集图片

拷贝图片到新建站点的图片文件夹images中。

五、 上机操作

创建自己的站点，收集图片素材。

篇四：用FRONTPAGE设计网页

网页制作前的几个问题？

一、 确定网页主题

1、根据用途 2、根据自己性格的特点 3、根据自己的特长

二、 制定网页的结构

分支，层级

三、 搜集素材

用FRONTPAGE2003制作网页

一、 启动FRONTPAGE2003

方法：开始—程序—MICROSOFT FRONTPAGE

二、 创建空白站点

如同学生做作业先要有一本作业本一样，用FRONTPAGE2003来制作网页时，也需要这样一个作业本，这就是站点，其中的每一个网页就如同一张张的作业纸。

一、 创建站点：

步骤1：文件——新建——站点

2：在“新建”对话框中，单击“只有一个网页的站点”或“空站点”图标，在“指定新站点的位置”列表框中输入站点文件夹的位置、名称，单击“确定”。

例如在E盘创建名字为jiaoxue的站点，输入：“E:\

jiaoxue”即可（注意：在英文状态下输入），

如果没有设定位置，则默认的站点位置在“我的文档”

内“My Web Sites”文件夹下“mysite”文件夹就是你刚创建的站点。

二、 创建网页：

步骤 1、新建网页：文件——新建——空白网页。

2、保存网页。

三、 利用表格布局网页

1、 插入表格

方法：①表格——插入——表格

②在弹出的“插入表格”对话框中设定表格的行列数

等

③设定表格布局为居中，宽度为900像素，宽度为0。

2、 设置单元格的背景：

设一种颜色做背景；

设图片做背景；

3、 关于嵌入式文件的保存：

选更改文件夹——双击images文件夹——确定——确定。

四、 插入字幕

插入——Web组件——字幕——输入字幕内容——确

定。

如果要改变字幕的文本格式，可在“样式”——“字体”——“格式”，进行设置。

五、 插入交互式按钮：

按钮文本设置——按钮字体格式设置，——按钮宽度高度设置（注意把“保持比例”前的对勾去掉）

六、 插入图片：

步骤：①光标放在要插入图片的位置

②插入—图片—来自文件，在弹出的“图片”对话

框中，单击“从计算机上选择一个文件”按钮，选

定一个文件后，单击确定。

注：（插入—图片—视频/Flash）用于插入视频

/Flash文件

图片大小的设定：

方法：选定图片，图片上会出现八个控制点，将鼠标放

在其中的一个控制点上，鼠标指针变以双箭头状，进行

拖动操作可调整图片大小。

设置图片的对齐方式：

在图片上右击——图片属性——外观——左

七、 网页背景的设定：

网页背景：1、格式——背景或单击右键—选“网页背景”。

——在“网页属性”对话框中选“背景”选项卡，

再选定“背景图片”并单击“浏览”按钮，点击图

片文件名和“确定”按钮就可实现把背景图片与当

前网页结合。

2、应用主题：格式——主题，选一种主题——应

用。

八、 网页背景音乐的设定

步骤：1、格式——背景

2、选“常规”选项卡，在“背景音乐”的位置中

点击浏览按钮，在弹出的“背景音乐”对话框中点

击“在计算机选择一个文件”按钮，在“背景音乐”

对话框中找出一个音乐文件即可。

注意：网页的背景音乐选midi或wav格式，不支持MP3格式。

九、在网页中插入声音

插入——Web组件——高级控件——插件——插件属性——浏览，找到声音文件——打开。

支持各种声音格式。

1、 合并单元格

方法：①选定需要合并的单元格；

②表格——合并单元格

2、 改变单元格大小

方法：将鼠标指针对准单元格线，看其变为双箭头后即可用拖动操作来改变单元格大小

3、 插入单元格

方法：1、定位

2、表格——插入——行或列

4、 删除单元格

方法：1、选中需要删除的单元格

篇五：如何将Flash动画作品插入到Frontpage制作的网页中

将Flash动画插入到Frontpage网页中

要想将Flash动画作品插入到网页中供大家欣赏，就需要将作品发布出去，除了将其输出为动画播放作品外，还需要编写一段HTML调用程序，这对于不熟悉HTML语言的人来说是件很麻烦的事情，笔者经过查阅有关资料，并结合自已的经验总结出如下三种方法供各位同行参考。

方法一：

1、Flash动画作品完成后先将其保存为*.fla文件，再执行文件菜单下的发布设置命令打开发布设置对话框，在格式标签下选中Flash和html两个可选项，然后点击发布再点击确定，这样就会在*.fla文件的同一位置找到新增的*.swf和*.html两个文件。

2、双击*.html文件即可打开浏览器并看到正在播放的*.swf动画作品，打开查看菜单下的源文件命令，源代码便出现在记事本窗口中，选中