网页设计与制作 第2章

第二章FrontPage基本知识标题栏菜单栏工具栏编辑窗口滚动条视图栏第二章FrontPage基本知识一、创建站点创建一个空站点，其中并不包含任何内容和信息，即搭起一个架子。操作步骤：1)在“文件”菜单上指向“新建”，然后单击“站点”。2)在“站点”列表中，选择用来创建新站点的模板。3)在“指定新网站的位置”框中键入或选择新站点名称。FrontPage将自动为站点创建下列文件和文件夹：1)用来存放图片、视频和其他的图像文件夹(Image)。第二章FrontPage基本知识2)用来存放表单结果和其他任何不想被浏览站点的站点访问者看到的文件的_private文件夹。3)将根据站点所使用的服务器类型创建一个名为Index.htm或Default.htm的新主页。4)如果将图片文件粘贴到网页上，当在保存站点时，FrontPage将根据图片类型提示将图片保存为GIF或JPEG的格式。第二章FrontPage基本知识二、创建、删除网页和文件夹1、各类模板可以创建不同种类的网页：创建空白网页。创建带有特定布局的网页，例如带有多重栏的网页。为特定功能创建的网页，例如目录、搜索表单等等。使用多种框架格式之一创建框架网页。操作步骤：在“文件”菜单上指向“新建”，然后单击“网页”；单击想使用的模板选项卡，然后单击模板（该模板的缩略图，或来自该向导的输出，就会显示在“预览”区域）。第二章FrontPage基本知识2、在文件夹列表内创建一个新网页是一种可以在站点上添加网页的简单方法：于“文件夹列表”内，在想创建新网页的文件夹上，单击右键，然后于快捷菜单上单击“新建网页”；键入新网页的名称，再单击Enter键。3、创建文件夹也可以在站点中创建一个新文件夹来组织网页和文件。例如：可会创建一个名为Multimedia的文件夹来存放声音效果、视频等对象。在“文件夹列表”中单击鼠标右键，然后单击快捷菜单中“新建文件夹”；键入新文件夹名称，然后按“确定”键。第二章FrontPage基本知识4、保存网页如果之前网页尚未保存，单击“保存文件”；在站点中找到要保存网页的位置，然后在“文件名”框中键入网页的文件名称，单击“保存”。如果网页从当前站点中打开，单击“保存文件”。如果网页从当前站点外打开，单击“文件”菜单中的“另存为”。在站点中找到要保存网页的位置，然后在“文件名”框中键入网页的文件名称，单击“保存”。注意：如果在网页中添加图形、ActiveX控件、声音文件或其他对象，系统会提示将其保存在与网页相同的位置。5、从当前站点中删除网页在文件夹视图模式下，选择网页后单击Delete。第二章FrontPage基本知识6、在Web浏览器中预览网页如果已经在计算机上安装MicrosoftInternetExplorer3.0以上版本，可单击网页视图模式下的“预览”选项卡或“文件”菜单上的“在浏览器中预览”，来快速预览当前网页。若要以站点访问者用站点浏览器浏览的角度来正确预览网页的话，就应该先保存网页。可以将MicrosoftFrontPage设置成预览网页前自动保存。单击“文件”菜单上的“在浏览器中预览”，然后选择“自动保存网页”复选框。（快捷键Ctrl+Shift+B）第二章FrontPage基本知识三、资源管理器视图1、网页视图该视图中主要用来制作网页。2、文件夹视图该视图中列出了站点中的所有文件，能看到文件名称、标题、大小、类型、修改日期等。3、报表视图该视图列出了图片、未链接的超级链、未完成任务等项目，有助于更块查找网页中不容易发现的错误以迅速改正。第二章FrontPage基本知识4、导航视图该视图显示整个网站的组织结构和各个网页之间的关系，即注重的是层次关系。5、超链接视图该视图中清晰的显示出站点中所有灵活的超链接，即只是单纯显示网页之间的链接关系，可以无限展开。6、任务视图该视图可以维护一个动态的项目表，可以协调工作内容、工作进度等。第二章FrontPage基本知识四、网页格式1、设置网页背景颜色操作步骤：在网页视图模式下，右键单击网页，再单击快捷菜单中的“网页属性”，然后单击“背景”选项卡。在“背景”框中，选择一种背景颜色。2、设置网页背景图片可以使用站点、文件系统、全球广域网或剪贴画中图片。操作步骤：a、在网页视图模式下，右键单击网页，然后单击快捷菜单中的“网页属性”。b、单击“背景”选项卡。c、选择“背景图片”复选框，然后单击“浏览”。第二章FrontPage基本知识选择背景图片：如果图片在站点中，在包含此图片的站点和文件夹中浏览，选择所需的图片，然后单击“确定”。如果图片在局域网上，单击“从计算机上选择一个文件”，在局域网上浏览找到此图片，然后单击“确定”。如果图片在全球广域网上，单击“使用Web浏览器来选择网页或文件”。在Web浏览器中，浏览到所需的图片，然后回到FrontPage。访问过的网页位置就会显示在“URL”框中，单击“确定”。如果图片为剪贴画，单击“剪贴画”来显示Microsoft剪贴库，选中所需的图片，单击鼠标右键，然后单击快捷菜单中的“插入”。第二章FrontPage基本知识也可以将背景图片设置为水印，即此图片不会像网页一样滚动。然而，并非所有的Web浏览器都支持水印。3、将一个网页的背景和颜色应用于另一个网页操作步骤：在网页视图模式下，打开想要应用背景和颜色的网页。右键单击网页，然后单击快捷菜单中的“网页属性”。单击“背景”选项卡，选择“从另一网页获得背景信息”复选框。单击“浏览”，选择包含使用的背景和颜色的网页。第二章FrontPage基本知识4、设置网页边距可以设置网页的上边距和左边距。操作步骤：在网页视图模式下，右键单击网页，然后单击快捷菜单中的“网页属性”。单击“边距”选项卡。要设置上边距，选择“指定上边距”复选框，然后键入边距高度的像素值。要设置左边距，选择“指定左边距”复选框，然后键入边距宽度的像素值。第二章FrontPage基本知识5、设置网页文本格式可以象使用字处理软件（word或wps）一样的方式来设置文本格式，从而增强可见的组织性、重点强调和结构。如：更改字体、大小、样式、颜色、段落间距等。1）文本的编辑输入文本复制文本（快捷键Ctrl+C）粘贴文本（快捷键Ctrl+V）剪切文本、删除文本：均是将文字从文档中除去，而剪切文本会在剪贴板中复制一份。第二章FrontPage基本知识2）设置文本字体（快捷键Alt+Enter）可以通过选择文本字形、样式、大小和颜色来设置所选文本的字体；也可以将不同的效果应用到文本，例如∶删除线和小型大写字母。在网页视图模式下，选择要设置其格式的文本，单击鼠标右键，然后单击快捷菜单中的“字体”。在“字体”选项卡中，从“字体”、“字型”、“大小”和“颜色”框中，选择选项来设置文本格式；也可以在“效果”下选择一个或多个选项。在“预览”区域中，将显示文本在应用设置值之后的效果。3）插入特殊字符在网页视图模式下，将光标放在要插入字符的位置。在“插入”菜单中，单击“符号”；选择插入字符单击“插入”，然后单击“关闭”。第二章FrontPage基本知识4)在文本周围添加边框可以在文本周围添加边框，然后设置其属性，例如边框的样式、颜色、边距和宽度。当添加边框时，它会被应用到整个段落。在网页视图模式下，选择要添加边框的段落。单击主菜单“格式/边框与阴影”命令，弹出其对话框：若想要四边边框，在“设置”下单击“方框”。要设置边框的属性，单击“样式、颜色和宽度”中的选项。若要创建自定义边框，在“设置”下单击“自定义”。自定义边框可以在特定边具有边框，而且每边可以有不同的样式、颜色和宽度。第二章FrontPage基本知识要指定边距（文本和其边框间的距离），在“填充”下的“上”、“下”、“左”和“右”框中，输入磅数值。5）给文本添加底纹可以给文本添加底纹，底纹（如同网页背景）可以是颜色或图片。当添加底纹时，它会被应用到整个段落上。在网页视图模式下，选择要添加底纹的段落。单击菜单“格式/边框和阴影”命令，然后单击“阴影”选项卡：要为所选文本设置背景颜色，在“背景颜色”框中选择颜色；要为所选文本设置颜色，在“前景颜色”框中选择颜色；要为所选文本设置背景图片，在“背景图片”框中键入图片的名称和位置，或单击“浏览”来查找和选择图片。第二章FrontPage基本知识6）增加或减小字符间距可以增加或减小字符间距来放松或紧缩文本。在网页视图模式下选择文本，单击鼠标右键，然后单击快捷菜单中的“字体”。单击“字符间距”选项卡：在“间距”框中，单击“扩充”或“紧缩”来更改文本的间距；在“间距大小”框中，选择所需的文本间距选项。7）设置行和段落的缩进（换行快捷键Shift+Enter）可以指定所要的段落缩进方式。例如∶可以缩进段落的右边或左边，或只缩进第一行。在网页视图模式下，选择一个或多个段落，单击鼠标右键，然后单击快捷菜单中的“段落”。第二章FrontPage基本知识在其对话框的“缩进”中：要缩进段落的左边，在“文本之前”框中输入磅数；要缩进段落的右边，在“文本之后”框中输入磅数；要缩进段落中文本的第一行，在“首行缩进”框中输入磅数。8）设置行距和段落间距操作步骤：在网页视图模式下，选择一个或多个段落，单击鼠标右键，然后单击快捷菜单中的“段落”。在“段落间距”中，设置文本的段落间距：设置每个段落之上的间距，在“段前”框中输入一个值；设置每个段落之下的间距，在“段后”框中输入一个值；设置每行文本间的垂直间距，单击“行距大小”框中选项；设置字间距，请在“单字间距”框中输入一个值。第二章FrontPage基本知识五、超链接超链接是从一个网页指向另一个目的端的链接，例如指向另一个网页或者相同网页上的不同位置。这个目的端通常是另一个网页，但它也可以是一幅图片、一个电子邮件地址、一个文件或者一个程序。超链接可以是文本或者图片。当创建一个超链接时，它的目的端将被编码为URL（统一资源定位符），例如或file://ComputerName/SharedFolder/FileName.htm。URL包含了站点服务器或者网络位置、路径和文件。第二章FrontPage基本知识1、创建指向一个站点中的网页或文件的超链接可以创建指向一个目的端，如一个站点中的网页或文件的超链接。当站点访问者单击该超链接时，该目的端将显示在Web浏览器上。操作步骤：在网页视图模式下，键入要将其用作超链接的文本然后选中它。单击“超链接”图标，浏览目标网页或文件所在的站点，然后选择该网页或文件。（快捷键Ctrl+K）第二章FrontPage基本知识2、书签超链接1）创建一个书签书签是网页中被标记的位置或被标记的选中文本，可以将书签用作超链接的目的端。例如∶如果要向站点访问者显示网页上某个部份，则可以添加一个以书签为目的端的超链接；当站点访问者单击该超链接时，将显示网页的相关部分而不是网页的上端。如果文本被标为书签，文本就会以下底线显示。操作步骤：在网页视图模式下，将插入点定位在想要创建书签的地方，或者选择想要指定书签的文本。单击主菜单“插入/书签”命令，在“书签名称”框中键入书签的名称。第二章FrontPage基本知识2）创建指向一个书签的超链接在网页视图模式下，键入要将其用作超链接的文本然后选中它。单击“超链接”，选择包含书签的网页。在“书签”框上，单击要将其作为目的端的书签。3、创建用来传送电子邮件消息的超链接可以创建一个超链接来打开和传送电子邮件的消息到所指定的位置。在网页视图模式下，键入要将其用作超链接的文本，然后选中它。单击“超链接”按钮，单击“制作发送电子邮件的超链接”按钮，键入要将消息送至的电子邮件地址。第二章FrontPage基本知识4、设置超链接颜色可以选择Web浏览器用来显示超链接的颜色，通常选择三种颜色来用于超链接的不同状态：超链接—即未被选中的超链接。当前超链接—即当前被选中的超链接。已访问过的超链接—即已经被浏览过的超链接。操作步骤：在网页视图模式下，右键单击网页，