《实验十三__简单网页的制作.ppt》由会员分享,可在线阅读,更多相关《实验十三__简单网页的制作.ppt(25页珍藏版)》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、 退出退出主菜单主菜单返回返回批注批注跳转跳转实验目的实验目的(1)了解网站建立的过程和操作了解网站建立的过程和操作(2)掌握网页设计与建立链接的基本掌握网页设计与建立链接的基本方法方法(3)掌握网站上传的方法掌握网站上传的方法 退出退出主菜单主菜单返回返回批注批注跳转跳转实验内容实验内容基础知识基础知识使用使用FrontPage2000建立本地网站建立本地网站使用使用FrontPage2000制作网页制作网页在网页之间建立超级链接在网页之间建立超级链接本地网站上的内容发布到本地网站上的内容发布到Internet上上 退出退出主菜单主菜单返回返回批注批注跳转跳转1、FrontPage基本操作依
2、次单击【开始】、【程序】、【 Microsoft FrontPage】命令,就可启动FrontPage。FrontPage窗口2、启动FrontPage后,打开图1所示的FrontPage窗口。一、基础知识一、基础知识 退出退出主菜单主菜单返回返回批注批注跳转跳转图1 退出退出主菜单主菜单返回返回批注批注跳转跳转视图栏:视图栏: 用来选择不同的视图方式。用来选择不同的视图方式。网页查看方式:网页查看方式: 可选择编辑网页的【普通】方式,查可选择编辑网页的【普通】方式,查看网页代码的【看网页代码的【HTML】方式和预览网页效果的】方式和预览网页效果的【预览】方式来查看网页。【预览】方式来查看网页
3、。文件夹浏览栏:文件夹浏览栏: 显示网站文件夹结构和文件。单击常显示网站文件夹结构和文件。单击常用工具栏上的【文件夹列表】按钮,可以显示或关用工具栏上的【文件夹列表】按钮,可以显示或关闭该栏。闭该栏。其他窗口元素与其他窗口元素与Word相似。相似。 退出退出主菜单主菜单返回返回批注批注跳转跳转二、使用二、使用FrontPage2000FrontPage2000建立本地网站建立本地网站 使用使用FrontPage创建站点的步骤如下所示。创建站点的步骤如下所示。 1. 创建站点创建站点 打开打开FrontPage,选择,选择“文件文件|新建新建|网页或站点网页或站点”命令,打开命令,打开“新建网页
4、或站点新建网页或站点”子窗口子窗口(见图见图2)。在在“新建新建”栏选择栏选择“空白站点空白站点”,打开,打开“Web站点站点模板模板”对话框,在对话框,在“指定新站点的位置指定新站点的位置”文本框中文本框中输入新站点的名称,如输入新站点的名称,如“文学欣赏文学欣赏”,然后单击,然后单击“确定确定”按钮按钮(见图见图3)。 退出退出主菜单主菜单返回返回批注批注跳转跳转图2图3 退出退出主菜单主菜单返回返回批注批注跳转跳转2 . 创建站点主页创建站点主页 在视图栏中单击在视图栏中单击“导航导航”按钮打开导航窗口,在工具栏按钮打开导航窗口,在工具栏上击上击“新建网页新建网页”图标在导航窗口中创建一
5、主页图标在导航窗口中创建一主页(参见图参见图4)。图4 退出退出主菜单主菜单返回返回批注批注跳转跳转3. 命名主页命名主页 在在“主页图标主页图标”上单击右键,在弹出的快捷菜单上单击右键,在弹出的快捷菜单中选择中选择“重命名重命名”命令,将命令,将“主页主页”改为改为“我的我的主页主页 ”,此页即为,此页即为“我的主页我的主页 ”站点的主页。如站点的主页。如图图4所示。所示。图4 退出退出主菜单主菜单返回返回批注批注跳转跳转4. 创建子网页创建子网页 点击选中点击选中“文学欣赏文学欣赏”图标后,若连续点击图标后,若连续点击4次工具次工具栏上栏上“新建网页新建网页”按钮,则在主页下面创建按钮,则
6、在主页下面创建4个子个子页,分别重命名为:页,分别重命名为: 本人介绍、所学课程和成绩、本人介绍、所学课程和成绩、奖惩情况和联系本人;奖惩情况和联系本人; (参见图参见图)。 退出退出主菜单主菜单返回返回批注批注跳转跳转图5 退出退出主菜单主菜单返回返回批注批注跳转跳转三、使用三、使用FrontPage2000FrontPage2000制作网页制作网页 本实验以制作一个自我介绍的主页为例,简单说明如本实验以制作一个自我介绍的主页为例,简单说明如何来根据这个主题来收集有关素材,如何规划网页结构以何来根据这个主题来收集有关素材,如何规划网页结构以突出该主题。突出该主题。1.设计制作设计制作“我的主
7、页我的主页”首页首页 双击图双击图4网页中网页中“我的主页我的主页”图标进入图标进入“我的主页我的主页”页页面编辑窗口。面编辑窗口。 在第一行输入在第一行输入“我的主页我的主页”,然后设置格式为,然后设置格式为“隶隶书书”、“36磅磅”、“居中居中”。输入。输入“我的主页我的主页”后,后,回车。如图回车。如图6所示。再单击所示。再单击“插入插入”菜单的菜单的“水平线水平线”命令,在文字下插入一条水平线。右击该水平线,弹命令,在文字下插入一条水平线。右击该水平线,弹出快捷菜单,选择出快捷菜单,选择“水平线属性水平线属性”设置其相关参数,设置其相关参数,如图如图7所示:所示: 退出退出主菜单主菜单
8、返回返回批注批注跳转跳转图6图7 退出退出主菜单主菜单返回返回批注批注跳转跳转 单击工具栏的单击工具栏的“插入表格插入表格”按钮,插入一个按钮,插入一个的表格,右击表格,弹出快捷菜单,选择的表格,右击表格,弹出快捷菜单,选择“表格属表格属性性”设置相关参数。将边框粗细设置为。如图设置相关参数。将边框粗细设置为。如图8所示:所示:图8 退出退出主菜单主菜单返回返回批注批注跳转跳转图92.设计制作设计制作“本人简历本人简历”网网页页 退出退出主菜单主菜单返回返回批注批注跳转跳转3.制作制作“课程成绩课程成绩”网页和网页和“奖惩情况奖惩情况”网页网页 按照上面的操作,制作制作按照上面的操作,制作制作
9、“课程成绩课程成绩”网页和网页和“奖惩情况奖惩情况”网网页分别取名为页分别取名为“kccj.htm”和和“jcqk.htm” 退出退出主菜单主菜单返回返回批注批注跳转跳转四、在网页之间建立超级链接四、在网页之间建立超级链接 超链接是超链接是Web网页之间的纽带。使用超链接使访问网站的网页之间的纽带。使用超链接使访问网站的用户能够在丰富多彩的用户能够在丰富多彩的Web世界轻松地漫游,体验异国的风世界轻松地漫游,体验异国的风采,以及进行网上通信、交流、购物,等等。没有超链接,网页采,以及进行网上通信、交流、购物,等等。没有超链接,网页就失去其真正的意义。就失去其真正的意义。创建超链接的步骤如下所示
10、。创建超链接的步骤如下所示。 双击双击“文件夹列表文件夹列表”窗口中窗口中“default.htm”文件,打开该网文件,打开该网页,用鼠标选择页,用鼠标选择“本人简历本人简历”,然后单击工具栏上的,然后单击工具栏上的“超链超链接接”按钮后,弹出按钮后,弹出“编辑超链接编辑超链接”对话框对话框,在网页列表中选择在网页列表中选择网页网页“brjl.htm”,然后单击,然后单击“确定确定”,见下图。依次类推,见下图。依次类推,设置文本设置文本“课程和成绩课程和成绩”的超链接为的超链接为“kccj.htm”;设置文本;设置文本“奖惩情况奖惩情况”的超链接为的超链接为“jcqk.htm”。如图。如图10
11、所示:所示: 退出退出主菜单主菜单返回返回批注批注跳转跳转图10 退出退出主菜单主菜单返回返回批注批注跳转跳转 在设置文本在设置文本“联系本人联系本人”的超链接时,这里要指定一个邮箱的超链接时,这里要指定一个邮箱地地址,请在址,请在“URL”文本框中输入文本框中输入“mailto:”。如图所示:如图所示:图11 退出退出主菜单主菜单返回返回批注批注跳转跳转 按照上面的方式,设置其他网页上按照上面的方式,设置其他网页上“返回返回”文本的超链接,链文本的超链接,链接指向网页接指向网页“default.htm”。所有网页的链接建立好以后,将网页。所有网页的链接建立好以后,将网页全部保存。然后,检查网
12、页的链接是否正确。双击全部保存。然后,检查网页的链接是否正确。双击“文件夹列表文件夹列表”窗口中窗口中“default.htm”文件,打开该网页。然后单击文件,打开该网页。然后单击FrontPage2000“视图视图”工具栏上的工具栏上的“超链接超链接”按钮,即可显示出按钮,即可显示出该网页所指向的所有网页,以及指向该网页所指向的所有网页,以及指向“default.htm”的所有网页。的所有网页。如图如图12所示:所示:图12 退出退出主菜单主菜单返回返回批注批注跳转跳转五、本地网站上的内容发布到五、本地网站上的内容发布到InternetInternet上上 整个站点内的所有网页完成后,可以将
13、站点发布整个站点内的所有网页完成后,可以将站点发布到到Internet。一般提供个人主页服务的站点都要求使。一般提供个人主页服务的站点都要求使用用FTP软件将网页文件上传到软件将网页文件上传到Web服务器上这里我们服务器上这里我们就利用校园网上的一个免费的主页服务器。就利用校园网上的一个免费的主页服务器。 校园网上主页服务器的地址,(校园网上主页服务器的地址,(210.35.207.155),首先要在上面建立自己的主页目录,主页目录用自己首先要在上面建立自己的主页目录,主页目录用自己的学号。具体方法是使用的学号。具体方法是使用FTP命令,或者教师帮助大命令,或者教师帮助大家建立好。家建立好。
14、退出退出主菜单主菜单返回返回批注批注跳转跳转 下面介绍如何利用下面介绍如何利用FTP命令建立自己的主页目录。命令建立自己的主页目录。第一步:选择第一步:选择“附件附件”菜单上的菜单上的“命令提示符命令提示符”,切,切换到换到MS-DOS方式。方式。第二步:输入命令第二步:输入命令“ftp 210.35.207.155”后,回车。后,回车。第三步:按照提示输入用户名:第三步:按照提示输入用户名:stud;密码:;密码:1234567。第四步:输入命令第四步:输入命令“mkdir 学号学号”。这里的。这里的“学号学号”指自己的学号。指自己的学号。第五步:输入命令第五步:输入命令“bye”,退出退出
15、FTP模式;再输入命令模式;再输入命令“exit”返回窗口界面。返回窗口界面。主页目录建立完成后,就可以将本地网站的网页发布主页目录建立完成后,就可以将本地网站的网页发布上去,发布网页有许多方式,通常采用上去,发布网页有许多方式,通常采用FTP命令。命令。这里我们利用这里我们利用FrontPage2000提供的网站发布功能。提供的网站发布功能。 退出退出主菜单主菜单返回返回批注批注跳转跳转 打开我们前面建立的网站,选择打开我们前面建立的网站,选择“文件文件”菜单的菜单的“发布站点发布站点”命命令,弹出令,弹出“发布站点发布站点”对话框,在对话框,在“指定发布站点位置指定发布站点位置”下的文下的
16、文本框本框中输入站点发布位置中输入站点发布位置“ftp:/210.35.207.155/学号学号”,这里,这里的的学号,是同学们自己的学号。然后单击学号,是同学们自己的学号。然后单击“发布发布”命令,主页即发命令,主页即发布布成功。如图成功。如图13所示:所示:图13 退出退出主菜单主菜单返回返回批注批注跳转跳转打开打开IE浏览器,在地址栏中输入主页地址浏览器,在地址栏中输入主页地址“http:/210.35.207.155/学号学号”,即可访,即可访问所建网站。问所建网站。如果网站内容有所修改,只要在本地网站上修改如果网站内容有所修改,只要在本地网站上修改好后,重新再按上面的步骤发布即可。好后,重新再按上面的步骤发布即可。