第四章FrontPage2000的应用

第四章FrontPage2000的应用第四章FrontPage2000的应用•学习目标：通过本章的教学，使学生能够掌握利用FrontPage2000编辑网页的基本操作，学会表格、框架的灵活应用，并能使用组件实现网页的动态效果。•学习重点：运用FrontPage2000编辑网页的基本操作。•学习难点：表格和框架的灵活使用；组件的灵活使用。•学习方式：讲授＋多媒体演示＋上机•学习时间：12课时§4.1Frontpage2000概述一、FrontPage2000的启动与退出1.启动：“开始”→“程序/MicrosoftFrontpage”2.退出：“文件/退出”二、FrontPage2000的屏幕组成1.FrontPage2000的标题栏：左边显示的是FrontPage2000的图标和MicrosoftFrontPage文字，右边显示的是最小化按钮、最大化/还原按钮和关闭按钮。2.FrontPage2000的菜单栏：为用户提供了网页编辑和管理网站的功能。文件、编辑、查看、插入、格式、工具、表格、框架、窗口和帮助3.FrontPage2000的工具栏：提供了常用的工具按钮和各种排版用的格式按钮。4.FrontPage2000的视图栏：为用户提供不同的查看网站的方式。1）“网页”视图：在主编辑窗口中编辑网页；2）“文件夹”视图：用于管理站点内的所有文件和文件夹；3）“报表”视图：列出站点中文件的状态；4）“导航”视图：采用树状结构，用直观的方法显示站点结构，用于在网页中创建导航栏；5）“超链接”视图：查看网页内的所有超级链接；6）“任务”视图：用于组织和管理计划中的各项工作并加以实施。5.FrontPage2000的主编辑区：编辑网页的主要工作区域。6.网页查看方式1）普通方式：编辑网页（所见即所得编辑方式）2）HTML方式：显示网页对应的HTML文件3）预览方式：模拟网页在浏览器中的显示4）用浏览器浏览网页：在默认浏览器中浏览当前网页7.FrontPage2000的状态栏：显示有关命令、“工具栏”按钮和“视图栏”按钮等信息三、在FrontPage2000中创建和删除站点1.新建站点：在本地计算机上的指定位置建立一系列的目录和文件。1）“文件”→“新建”→“站点”2）指定新站点所在的位置，即选择新站点的文件夹路径3）选择新建站点的模板或向导模板与向导不同，用向导创建站点时，FrontPage会根据需要提出一些问题让创建者回答，然后根据回答创建站点；模板则直接创建一系列默认的网页，由创建者对生成的网页进行修改。2.删除站点1）单击“文件夹”视图，在要删除的站点上单击右键2）选择“删除整个站点”，单击“确定”3.打开已有站点1）“文件”→“打开站点”2）在“查找范围”下拉列表框内确定站点的位置。3）点击“打开”§4.2建立与编辑网页一、网页的基本操作1.新建网页1）“文件”→“新建”→“网页”2）在“常规”选项卡下，从列表框内选择自己需要的网页模板3）单击“确定”2.保存网页1）“文件”→“保存”对于保存过的网页，就将修改过的网页保存到原来的网页中，并结束保存过程；对于新建的网页，则弹出“另存为”对话框。如果想改变已保存的网页的文件名或保存位置：“文件”→“另存为”2）确定网页保存的位置、类型、名字和网页标题，3）单击“保存”网页一般都自动保存为HTML格式，其扩展名为htm或html3.编辑网页1）文本的操作输入、大小、标题、字体、效果、颜色、对齐、设置边框和底纹、使用列表2）插入特殊符号3）插入注释4）插入水平线5）插入日期和时间6）插入图片插入剪贴画、插入文件中的图片7）图片的保存8）设置网页属性二、使用超链接整个技术的核心之一就是超链接，用户在浏览某个网页时可以通过单击超链接跳到其他的网页或站点，而不论这个网页或站点是在本地还是在Internet上的其他计算机上。超链接是网页之间的一种联系，它是从一个网页指向另一个目的端的链接，目的端可以指向另一个网页或者相同网页上的不同位置。这个目的端可以是网页，也可以是一个邮件地址、一幅图片、一个文件（如多媒体文件或MicrosoftOffice文档）等。1.创建普通链接l建立文本链接1）选定用作超链接的文本2）“插入”→“超链接”或右击鼠标选择“超链接”3）在“创建超链接”对话框内输入网址，或者选择要链接的文件使用Web浏览器来选择所要链接的网页。制作一个指向本地计算机上文件的超链接。制作发送电子邮件的超连接创建一张网页，并链接到该网页。4）单击“确定”l建立图片链接1）插入并选择图片2）插入”→“超链接”或右击鼠标选择“超链接”3）在“创建超链接”对话框内输入网址，或者选择要链接的文件4）单击“确定”2.创建书签超链接当一个网页需要多屏显示时，若要快速的定位到该页面的某一位置，可以采用“书签超链接”的方法实现。这种方法是在同一网页的不同点之间进行链接，因此书签链接需要先创建书签，定义书签的位置，再进行书签链接的设置。1）创建书签将光标移动到要定义书签的位置，然后选择“插入/书签”菜单命令，在弹出的“书签”对话框中定义书签的名称，单击“确定”2）创建书签链接将光标移动到要建立超链接的位置，选择“插入/超链接”菜单命令，在弹出的“创建超链接”对话框的“书签”下拉式列表框中选择需要的书签即可3.创建电子邮件超链接1）选中要创建邮件链接的元素，启动创建超链接对话框。2）单击制作发送电子邮件的超链接按钮。3）在出现的对话框中，在键入电子邮件地址框中输入自己的电子邮件地址，单击“确定”按钮，返回创建超链接对话框。4）单击确定4.编辑超链接1）修改2）删除3）设置超链接的颜色文本超链接的颜色分为未访问色、活动色和已访问色三种。未访问色是指未点击的链接的颜色。活动色是指点击超链接后超链接地址还未打开时超链接所显示的颜色。已访问色是指访问过的超链接的颜色。§4.3使用表格1.创建表格1）把光标移动到要插入表格的位置。2）点击“表格”菜单中的“插入”子菜单下的“表格”命令3）在“插入表格”对话框中设置表格的行数和列数。4)单击“确定”嵌套表格：就是在表格中插入的表格，其创建与正常表格相同2.编辑表格1）复制、移动和删除表格元素2）设置表格标题3）给表格添删行、列4）拆分与合并单元格5）调整行高、列宽3.设置表格属性1）选中想要修改的表格2）“表格”→“表格属性”→“表格”3）在弹出的“表格属性”对话框中，设置表格的各项属性值4.设置单元格属性1）选中想要修改的单元格2）“表格”→“表格属性”→“单元格”3）在弹出的“单元格属性”对话框中，设置单元格的各项属性值5.文本表格互换“表格”→“转换”6.利用表格布局页面在设计网页布局时，要用到大量的表格（多数为无框无线的表格），但在浏览器中很难看清楚哪些是表格。其实，只要把浏览器中的网页复制到Word2000或复制到FrontPage2000中，无框线的表格线就会显示出来。一个网页往往由多个独立或嵌套的无框线表格组成。我们可以通过这种方法了解网页的结构，学习设计网页。§4.4使用多媒体一、使用图片1.图片的相关知识网页中的图片不仅增加吸引力，而且给访问者提供更多的直接信息。但使用图片会使网页的下载速度降低。对网页设计者来说，应该在两者之间做一些折衷，既不要使网页太单调，也不要使用太多没用的图片。Frontpage2000现有3种通用的图片格式：lGIF格式：图片最多可以包含256种颜色。GIF图片可以在所有的浏览器中进行浏览，并且可以选择一种颜色让它成为透明色lJPEG格式：该格式常用于含有成千上万种颜色的相片实景图片,其压缩率是非常高的，可以通过改变图片质量来控制文件压缩率，所设置的图片质量越低，文件的压缩比例越高，从而图片越小，但有失真lPNG格式：该格式可用于替代GIF，PNG格式支持包含成千上万种颜色的图片中的透明性，但有的浏览器必须安装特别的插件后才能显示PNG图片2.加入图片1）加入OFFICE剪贴画OFFICE剪贴画包含有几百幅图片，这些图片都是以GIF或WMF格式分类保存的，占用空间很小。2）加入其他类型的图片将光标移动到要插入图片的位置→“插入/图片/来自文件”→浏览选择图片文件3.图片属性1）亮度：增加或减小图片的亮度2）对比度：对比度越大，不同颜色之间的对比就越强烈3凹凸效果：可以使图片显示突出的效果，增加立体感4）自动缩略图：将原始的图片缩减后的一个副本5）图片属性对话框a)常规属性l替代表示在“低分辨率”文本框中，可以输入一个低分辨率图片的文件名。这个低分辨率图片可以在下载网页时首先显示在浏览器中，当整个网页下载完成时才出现原来的图片。在实际中一般是原始彩色图片用它的黑白图片替换表示。在“文本”文本框中，可以输入要在图片位置显示的文本，这些文本将会在图片无法显示时出现，或是当访问者将光标移到图片的位置时显示文本。l默认超链接在“位置”文本框中可输入图片超链接所指向的URL。若当前网页为框架网页，则在该选项组中的“目标框架”中显示出当前的框架，单击其旁边的更改按钮可更改目标框架b)外观属性l布局设置图片的对齐方式、图片与其他对象的水平间距和垂直间距、图片边框的粗细l大小选定“指定大小”复选框，在“宽度”和“高度”加减器中可设置图片大小选定“保持纵横比”复选框，在改变图片大小时按比例放大或缩小，不致图片失真4.使用热点a）为图片添加热点与图片映射1）单击图片，选定它2）在图片工具栏上，单击需要的热点形状按钮3）在图片上拖动笔状光标确定热点区域4）释放鼠标自动打开“编辑超链接”对话框，设置链接目标的URL5）单击“确定”b）为图片添加文本热点1）单击图片，选定它2）单击图片工具栏上的文本按钮，此时在图片上出现本文框3）适当调整文本框，并键入文本4）双击文本框边缘，在弹出的“编辑超链接”对话框中设置链接目标的URL5）单击“确定”二、使用声音1.可使用的声音文件类型常用的声音文件格式有：WAV（声音波形）和MID（MIDI格式）。在FrontPage2000中支持的声音文件格式有：WAV、MID、RAM、RA、AIF和AU等，对MP3格式，目前在FrontPage2000中还不支持。2.设置背景音乐1）选择“文件/属性”菜单命令，或在网页上单击右键选择“网页属性”2）在“网页属性”对话框中选择“常规”标签3）在背景音乐的“位置”文本框中输入音乐文件的位置或浏览选择4）设置播放循环次数5）单击“确定”三、使用视频1.可使用的视频文件类型常用格式为AVI,另一种为RealAudio。2.加入视频1）定位光标2）选择“插入/图片/视频”菜单命令，弹出“视频”对话框3）选择视频文件3.修改视频属性1）选定视频位置上出现的图片2）单击右键选择“图片属性”3）在“图片属性”对话框中设置视频的属性§4.5插入动态效果和高级选项一、横幅广告管理器在网页中的广告位可以实现不同图片之间的自动切换，以引起浏览者的注意，当单击图片时，可以链接到广告商的网页上。制作过程如下：1.定位光标2.选择“插入/组件/横幅广告管理器”菜单命令3.在出现的对话框中设置横幅广告管理器的属性，包括：广告位的宽度和高度、图片之间的过渡方式、每幅图片显示的时间、希望链接到的网页及要显示的图片等二、悬停按钮悬停按钮是指当鼠标指向按钮时可以变为另外一种颜色、并且单击时可以链接到指定的位置。其制作过程如下：1.定位光标2.选择“插入/组件/悬停按钮”菜单命令3.在出现的对话框中设置悬停按钮的属性，包括：按钮文本、链接位置、按钮颜色、效果颜色和按钮大小等三、移动字幕制作过程如下：1.定位光标2.选择“插入/组件/字幕”菜单命令3.在出现的对话框中设置字幕的属性，包括：文本内容、显示方向、速度、表现方式和文本对齐方式等四、动态HTML应用动态效果的元素可以是文本、图形或者是两者的组合。随着设置对象的不同，选择事件的不同，其动画效果和效果的类型都是不同的。我们也可以将多种效果叠加使用，产生需要的效果。1.文字突出显示2.单击鼠标时文字从屏幕上消失3.进入网页时文字产生一种飞入效果