计 算 机 导 论第第11章章 FrontPage 2003应用应用第第十一十一章章 FrontPage 2003 FrontPage 2003应用应用q教学目标了解FrontPage 2003的基本功能熟练掌握FrontPage 2003的应用随着Internet的迅速发展，每个人都拥有自己的个人网站是未来趋势，在个人网站中，可以全面的展示自己，介绍自己的各个方面，如个人简历、兴趣爱好、专长等。在众多的网站制作软件当中，微软公司出品的FrontPage是最容易上手的，即使没有任何网站开发基础的人，通过FrontPage也可以设计出专业的网站。个人网站的制作个人网站的制作11.1.1 案例说明本案例首先利用FrontPage 2003自带的网站建立向导建立一个个人网站，然后给网站首页添加一个滚动字幕，修改左侧导航栏的样式，最后修改超链接，完善网页的其他部分。11.1.2 知识点分析在本案例的制作过程中用到的操作主要包括：使用模版创建站点、插入字幕、修改导航栏样式、编辑超链接、字体设置、添加图片、表格操作、添加表单、保存等。11.1.3 制作步骤（1）单击“文件”“新建”，在FrontPage 2003的右侧打开“新建网站”任务窗格。（2）在任务窗格中点击“其他网站模版”，会弹出如图11-3所示的对话框。图11-3 “网站模版”对话框（3）在弹出的对话框中，选择“个人网站”模版，然后在窗口右侧的“制定新网站的位置”下拉列表中直接输入网站所存放的目录和名称，或者单击“浏览”按钮，进行目录的选择，设置完成后单击“确定”按钮完成网站的创建。创建完成后会出现如图11-4所示的个人站点。（4）打开index.htm页面，在日期和时间组件后面按回车键，单击“插入”“Web组件”，在“插入Web组件”对话框中选择“动态效果”组件类型，选择“字幕”动态效果，单击“完成”按钮。（5）在弹出的“字幕属性”对话框中输入字幕文本，选择“滚动条”表现方式，单击“样式”按钮。（6）在弹出的“修改样式”对话框中，单击“格式”按钮，在弹出的下拉式菜单中选择“字体”。在弹出的“字体”对话框中，选择合适的字体、字形和大小，选择好后单击“确定”按钮。（7）双击左边的导航按钮，在弹出的“链接栏属性”对话框中选择“样式”选项卡，选择如图11-8所示的样式作为链接栏的样式，单击“确定”按钮。重复此步骤，在其他页面修改导航栏的样式。（8）修改“我的收藏夹”下面的子项目的名字为一个适当的名字，选中名字单击右键，在弹出式菜单中选择“超链接属性”，在“编辑超链接”对话框中选择要链接到的网页，如图11-9所示。重复此步骤，为其他需要修改文字和超链接属性的地方做修改。（9）打开aboutme.htm页面，在该页面中删除不需要的内容，并输入一段介绍自己的文字，选中文字单击右键，在弹出式菜单中选择“字体”，在“字体”对话框中选择合适的字体、字形、大小作为文字的字体属性设置。（10）打开photo.htm页面，双击图片库组件，在弹出的“图片库属性”对话框中选择“图片”选项卡，单击“添加”按钮，在弹出式菜单中选择“图片来自文件”。（11）在弹出的“打开”对话框中，选择要加入图片库中的图片文件，选择好后单击打开按钮。（12）回到“图片库属性”对话框，单击“布局”选项卡，选择“水平版”布局，单击“确定”按钮。为图片库组件添加图片后。（13）打开feedback.htm页面，把光标放在文字“请留下您的联系方式：”下面的表格内，单击“表格”“插入”“行或列”，弹出“插入行或列”对话框，选择“行”单选按钮，设置行数为“1”。在新插入行左侧的单元格中输入文字，把光标放在右侧的单元格中，单击“插入”“表单”“文本框”，插入一个文本框，调整好文本框的大小后。（14）保存网站，可以在浏览器中浏览效果。11.1.4 总结个人网站是展示自己的一个门户，学会用FrontPage制作一个简单实用的个人网站是十分有必要的。网站发布到互联网上，每个人都可以看到，网页就需要设计的美观大方，色彩搭配合理。因此在设计中需要学会使用各种对象的插入和编辑，学会使用模板、背景以及配色方案修饰网页的外观。商业网站的制作商业网站的制作11.2.1 案例说明本案例选取了某手机销售公司的商业网站。11.2.2 知识点分析在页面的设计过程中，框架和表格都应用得比较多。它们可以构建一个框架网页，将页面分成几个相互联系着的区域，便于分开设计；在框架的内容网页中使用表格来进一步规划页面。综合运用框架和表格布局页面，能使页面的组织更加合理有效。11.2.3 制作步骤（1）启动FrontPage 2003，单击“文件”“新建”，在界面的右侧打开“新建网站”任务窗格，在任务窗格中点击“其他网站模版”。（2）在弹出的“网站模版”对话框中打开“常规”选项卡，选择“空白网站”，在右侧的“制定新网站的位置”中指定创建站点要保存的位置，然后单击“确定”按钮。（3）单击“文件”“新建”，在界面右侧弹出的“新建”任务窗格中选择“其他网页模版”。（4）在弹出的“网页模版”对话框中打开“框架网页”选项卡，选择“横幅和目录”，然后单击“确定”按钮，将该网页保存为index.htm主页面。（5）切换到导航视图，把主页的名字改为“手机网站”，单击“新建”按钮在主页的下层建立十个空白网页，并分别输入网页名字。（6）单击“文件”“新建”，在界面右侧弹出的“新建”任务窗格中选择“其他网页模版”。（7）在弹出的“网页模版”对话框中打开“常规”选项卡，选择“目录”，然后单击“确定”按钮，生成目录如图11-20所示。保存此目录为网页形式。（8）单击左侧框架中的“设置初始网页”按钮，在弹出的“插入超链接”对话框中选择刚才保存的目录网页。（9）在左侧框架中单击右键，在弹出式菜单中选择“网页属性”，单击“格式”选项卡，勾选“背景图片”复选框，单击“浏览”按钮，选择一幅合适的图片作为网页背景，单击“确定”按钮设置左侧框架的背景图片。仿照此步骤，根据需要在右侧框架中设置好一个页面，接着再选一幅图片作为页面的背景，设置好后的效果如图11-22所示。（10）在左侧框架中单击右键，在弹出式菜单中选择“框架属性”，在显示滚动条后的单选列表中选择“不显示”。（11）把光标放在右侧框架，单击“表格”“插入”“表格”，在“插入表格”对话框修改行数为“11”，列数为“3”，对齐方式为“居中”，单元格间距为“11”，同时也修改了亮边框和暗边框的颜色。（12）把光标放在第一个单元格，单击“插入”“图片”“来自文件”，选择一幅手机图片，选择好后单击“确定”按钮。（13）接着在第一个单元格内输入手机的说明文字，设置字体的大小和颜色。（14）双击图片，弹出“图片属性”对话框，在“图片属性”对话框中选择环绕样式为“左”，单击“确定”按钮。设置好图片的环绕方式后，调整图片的大小。（15）仿照上述步骤，在表格中的其他单元格中插入图片，输入文字，设置文字的大小和颜色，最后设置文字的环绕样式为“左”。（16）把光标放在表格的任一单元格内，单击“表格”“插入”“标题”，为表格加上标题，选中标题后，设置标题的字体、大小和颜色。（17）在上框架中单击右键，在弹出式菜单中选择“网页属性”，在“网页属性”对话框中打开“高级”选项卡，把上边距和左边距都修改为“0”，单击“确定”按钮。（18）把光标放在上边框中，单击“表格”“插入”“表格”，在“插入表格”对话框修改行数为“1”，列数为“11”，选定亮边框和暗边框的颜色，勾选“折叠表格边框”。（19）把光标放在第一个单元格里，单击“插入”“图片”“来自文件”，在弹出的“图片”对话框里选择一幅图像，选择好后单击“确定”按钮。在第一个单元格中插入图片后，调整图片的大小。（20）仿照上述步骤，在表格的其他单元格内插入图片。（21）保存文件，即可以在浏览器中浏览效果。11.2.4 总结要设计好一个优秀的商业网站，布局是关键，因此掌握好框架和表格的布局方法是十分重要的。平时在浏览网页的同时，要多去分析这些网页的布局特点，积累经验，才能真正设计出让客户满意的要求。信息采集网站的制作信息采集网站的制作11.3.1 案例说明本案例采用自定义表单的形式创建一个表单网页。11.3.2 知识点分析如果对FrontPage 2003自带的模版或向导不满意而想创建具有个人风格的表单时，可以通过信件一个空白的页面，在页面内按自己的需要添加表单域元素形成表单。11.3.3 制作步骤（1）新建一个空白网页，输入表单的标题“个人信息采集”，并将文字设置加粗。（2）将光标放置在标题的下一行，单击“插入”“表单”“表单”，在页面中出现一个表单边框，在表单边框中有“提交”和“重置”按钮。（3）将光标置于“提交”按钮之前，插入一个8行2列的表格，设置表格边框粗细为1。（4）在表格的第一列中输入相应的文字提示，如“姓名：”、“性别：”、“生日：”、“学历：”、“兴趣：”、“联系电话：”、“电子邮箱：”、“邮编地址：”等。（5）在表单对应位置“姓名：”后单击“插入”“表单”“文本框”，插入“文本框”，重复此步骤，在表单对应位置“联系电话：”、“电子邮箱：”、“邮编地址：”的后面插入“文本框”。（6）在表单对应位置“性别：”后单击“插入”“表单”“选择按钮”，插入“选择按钮”。（7）在表单对应位置“兴趣：”后单击“插入”“表单”“复选框”，插入“复选框”。（8）在表单对应位置“学历：”后单击“插入”“表单”“下拉框”，插入“下拉框”。用鼠标双击插入的下拉框，弹出“下拉框属性”对话框，在“名称”文本框中输入此下拉框的名称。（9）单击“添加”按钮，弹出“添加选项”对话框。在“选项”文本框中输入选项的名称，在“初始状态”中设置是否选定，然后单击“确定”按钮，返回到“下拉框属性”对话框中。添加好所有选项后，在“下拉框属性”对话框中单击“确定”按钮即可；同理可以设置表单中的“生日”。（10）双击“提交”按钮，弹出“按钮属性”对话框，可以设置表单按钮的名称和标签，设置完毕后单击“确定”按钮即可，同理设置“重置”按钮。（11）保存网站，一个表单网站制作完毕。11.3.4 总结一个站点在设计过程中，除了要求内容丰富、布局合理、颜色协调，并且具有时代感和创新性之外，还有一点是非常重要的，那就是网站的交互性。网站的交互性一般是通过表单程序来实现的，网页浏览者的信息通过表单发送到Web服务器端，Web服务器接收后做出相应的回应，最终将反馈信息返回到个人的浏览器。