网页制作软件----FrontPage2003计算机文化基础课前回顾网站与网页计算机文化基础HTML网页的结构现在我们先看一个简单的HTML文件,从中体会用HTML语言编写网页时的层次结构。【例9-1】用HTML语言编写一个简单的网页。htmlheadtitle我的第一个Web页/title/headbodyh1欢迎进入HTML世界!/h1p这里我们首先介绍HTML语言的基本知识和语法。然后,讲授如何使用HTML语言编写您的Web页面。/p/body/html是Office2003组件之一,运行与启动Office其他软件相同。启动成功后,出现的初始画面可能因机器使用情况的不同而不同,菜单部分与Office中的其他软件相似,最大区别是工作区的左端有一个视图栏,包含:网页、文件夹、报表、导航、超链接、任务。8.1认识FrontPage2003图8-1FrontPage2003启动后显示页面视图1.网页。编辑网页需在“网页”视图中进行。在“网页”视图中,有“设计”、“拆分”、“代码”和“预览”4张选项卡。2.远程网站视图。同步此网站和远程网站之间的文件。3.文件夹视图。用于管理站点中的文件和文件夹。4.报表视图。分析网站并管理其内容。5.导航视图。显示站点的导航结构,用于对站点结构的管理。6.超链接视图。用于显示站点中每一页的超链接。7.任务视图。用于创建和管理站点中的任务。图8-3个人就职网站主页站点的创建所谓站点就是多个相关网页通过各种链接关联起来的集合。在使用FrontPage2003设计网页之前,应建立一个本地站点,用来管理创建的网页。在FrontPage2003的主窗口下,单击菜单栏上的“文件”,在弹出的下拉菜单中选中“新建”,在窗口的右边出现“新建”面板,在新建项中选择“其他网站模板”。在“站点”列表框中,选中“只有一个网页的网站”图标,并在右边“指定新网站的位置”框中,输入新站点的名称。如图8-4“网站模板”对话框。图8-4“网站模板”对话框网页的基本编辑一、新建一个网页在FrontPage2003的主窗口中,单击“视图”栏上的“网页”视图,使当前处于网页视图模式下。单击菜单栏上的“文件”,在弹出的下拉菜单中选中“新建”,在窗口的右边出现“新建”面板,在新建网页项中选择“其他网页模板”。打开如图8-4所示的“网站模板”对话框。单击“常规”选项卡,在列表框中显示了FrontPage2003提供的创建网页的11种模板,包括有普通网页、表单网页向导、常见问题、目录、确认表单等。使用各类模板可以创建不同的网页。网页属性设置网页的属性包括网页的背景颜色、图片、网页的标题和网页的页边距等。选择菜单“文件”→“属性”命令或在页面空白处右键单击选择“页面属性”命令则可以在弹出的对话框中进行设置,网页的标题、背景音乐、背景、背景图片、网页边距等图8-5网页属性对话框计算机文化基础高级属性文本设置一、输入文本可选择两种方式:第一种是和在Word一样,可以直接在FrontPage2003的普通视图中输入文字,文字的编辑修改和Word基本一样;第二种是可以通过复制和粘贴从其他地方复制文字。二、设置文字及段落格式文字格式,包括“字体”、“字型”、“大小”、“颜色”、“效果”以及字符间距的设置,以直接在格式工具栏中进行,也可以选择菜单“格式”→“字体”命令,也可以选择字符后右键单击选择“字体”命令。弹出如图8-7所示对话框。图8-7文字格式对话框网页元素的插入一、插入换行符网页中插入换行符可将网页中的一段网页内容断开。FrontPage中的换行分成“隔行换行“(两行之间有空行)和“紧凑换行”(两行间没有空行)两种,这两种换行符的插入方法分别是:(1)插入“隔行换行”。直接在插入点按Enter键。。(2)插入“紧凑换行”。先定位插入点,选择“插入”菜单“换行符”命令,或按Shift+Enter组合键。二、插入水平线方法:光标定位于表格第二行,单击“插入”菜单“水平线”命令,就可以在第二行中插入水平线。单击刚插入的水平线,右键单击在快捷菜单中选择“水平线属性”。如图8-8水平线属性对话框。图8-8水平线属性对话框三、插入图片插入图片将插入点定位欲插入图片位置,选择“插入”菜单上的“图片”命令。从“图片”子菜单中选择“来自文件”命令,在对话框寻找需要的图片文件,单击“确定”按钮插入图片。在图片上右键单击,在快捷菜单中选择“图片属性”,在图片属性对话框中可以设置图片属性。如图8-9插入图片对话框。图8-9插入图片对话框四、层操作1.插入层方法是:“插入”菜单“层”命令。然后鼠标在1行2列上拖动即可。2.选择层可以单击层的选择手柄、单击层边界等方法,选择多层时候可以使用shift键来配合使用。3.调整层大小选中层,然后在属性面板中输入宽度和高度值。或直接用鼠标的在层的八个控点上拖动调整大小。4.移动层无论是移动一个或多个层,先选中层,用鼠标拖住最后一个选中层的手柄随意移动。超链接超链接概念:超链接是指站点内不同网页之间、站点与站点之间的一种链接关系,它不仅使站点内的每一个网页有机地联系在一起上,而且使不同的站点之间建立了联系。使用超链接,浏览者可以从一个网页转到另一个网页,从一个站点转到其他的站点。除了指向网页和和站点,超链接还可以指向图片、电子邮件地址、多媒体文件,甚至可以指向一个程序。一、为文本创建超链接1.链接到网页首先选定要建立超链接的文本,单击“插入”→“超链接”命令,或右键单击选定的文本在快捷菜单中选择“超链接”,打开如图8-10所示的“插入超链接”对话框。根据超链接的目标,用户可以从列表框中选定某个网页文件,也可以直接在“地址”文本框(URL)中输入要链接的目标地址,还可以单击图标,从弹出的“选择文件”对话框中选定链接的目标文件。选定的目标文件地址均会出现在地址文本框(URL)中。图8-10插入超链接对话框.链接到其他网站的网页方法如下:(1)首先选定要建立超链接的文本,单击“插入”→“超链接”命令,或右键单击选定的文本在快捷菜单中选择“超链接”,打开如图8-10所示的“插入超链接”对话框。(2)在“编辑超链接”对话框中的地址文本框中输入所需要链接的其他网站的网页如“”,单击“确定”按钮即可完成超链接的设置。.链接到电子邮件方法如下:(1)选中要电子邮件链接的文本,单击工具栏中的“插入超链接”按钮,打开“插入超链接”对话框;(2)单击“电子邮件地址”选项,对话框变成图8-10所示;(3)在“要显示的文字”文本框中输入要显示的文字,在“电子邮件地址”文本框中输入邮件地址,在“主题”文本框中输入主题;(4)单击“确定”按钮。二、为图像创建超链接1.图像的默认超链接先选中图片,单击鼠标右键,在弹出的快捷菜单中选择“超链接”菜单项,会弹出一个“编辑超链接”对话框或者单击“插入”菜单上的“超链接”。(1)如果要链接的是当前站点中的文件或计算机中某个目录下的文件,则从列表框中选择网页文件,查找该文件,单击“确定”按钮。(2)如果要链接的网页或文件夹来自Web,在“插入超链接”对话框中的地址文本框中输入所需要链接的网站,单击“确定”按钮。(3)如果要链接的是电子邮件,打开“插入超链接”对话框,单击左边的电子邮件地址,在“电子邮件地址”文本框中输入邮件地址,单击“确定”按钮。.图像的热点链接热点是图像上具有超链接的区域,一幅图片上可以包含若干个热点,单击图片中的这些热点可以跳转到不同的目标。热点形状可以是矩形、圆形或多边形,热点位置可自行确定。设置热点的方法如下:(1)选定图片后,在编辑区的底部会自动弹出如图8-11所示的图片工具栏。(2)单击图片工具栏的热点形状按钮(例如长方形按钮),这时鼠标变成铅笔形状,将光标定位到需创建热点区域的左上角或右下角,然后拖动鼠标形成一个热点区域,松开鼠标后会自动弹出“创建超链接”对话框。(3)在“创建超链接”对话框中设定链接目标。图8-11图片工具栏二、保存网页当前网页是新建的网页并且尚未保存,则单击“常用”工具栏中的“保存”按钮,在弹出的“另存为”对话框中找到并双击要保存网页的文件夹,然后在“文件名”下拉列表框中输入网页的文件名“index.htm”,再单击“保存”按钮即可。如果当前网页是从当前网站打开的,则单击“常用”工具栏中的“保存”按钮即可。如果当前网页是从当前网站之外的位置打开的,则单击“文件”|“另存为”命令,在弹出的“另存为”对话框中找到并双击要保存网页的文件夹,并在“文件名”下拉列表框中输入网页的文件名,最后单击“保存”按钮即可。表格一、插入表格在“表格”菜单“插入”级联式菜单中选择“表格”命令,出现如图8-6所示。单击“确定”就可以网页中插入表格。图8-6插入表格属性对话框二、设置表格属性表格属性设置若想设置表格的边框粗细、颜色以及表格的背景可指向表格,用鼠标右键单击表格,在弹出快捷菜单中选择“表格属性”命令,打开“表格属性”对话框如图8-6所示。大小:设置表格的行列数目。布局:设置表格的对齐方式、边框粗细(无边框为0)、单元格边距(表格内单元边框线之间的距离)、单元格间距(单元格内容与边框线之间的距离)。指定宽度:指定宽度前,则在复选框前打上“∨”,宽度单位有两种分别为像素和百分比,百分比