FrontPage教程

FrontPage教程初识FrontPage1启动 FrontPage 2000单击“开始”“程序”“Microsoft FrontPage”，进入界面。标题栏：位于窗口的最上方，表示程序图标、程序名称、网页文件名和“窗口控制”按钮等。菜单栏：共有十个菜单，每个菜单都有若干项命令。工具栏：工具栏中有“常用”工具，使用方法同Word。格式栏：“格式”栏使用方法同Word。网页标签：位于网页左上方，显示当前被编辑的网页名。视图栏：位于窗口的左侧，用于在各种视图间来回切换。共有6种视图，分别是网页、文件夹、报表、导航、超链接和任务栏。编辑区：用户在此区域输入文字、插入表格、图片或其他媒体文件等，从而创建网页。编辑模式按钮：有“普通”和“HTML”两种编辑模式，用户可以选择不同编辑模式编辑网页；在“预览”模式下，可以直接浏览网页的效果，很方便。 2退出 FrontPage 2000单击“关闭”按钮或“文件”/“退出”，都可以退出FrontPage 2000。退出时系统将显示一个对话框，询问用户是否将该网页保存，选择“是”，则保存网页，否则将不保留网页。 新 建 网 页1规划网页在新建网页前要仔细规划网页（网站），这是第一步。（1）确定网页（网站）的主题和风格；（2）确定网页（网站）的内容（事先收集和整理一些相关的信息）；（3）确定网页（网站）的框架（根据内容确定框架的基本结构），如有几个副标题和几张网页；（4）分别创建不同内容的网页，包括插入图片、音乐、背景等；（5）修饰和调试网页（网站）；（6）保存网页或发布（网站）。2新建页面新建页面最简单的方法就是单击FrontPage“常用”工具栏的“新建”按钮。它的右方有一个向下的小箭头，它是用来选择要新建什么，可以用“新建”按钮新建网页、站点、文件夹和任务。默认状态下是新建网页。如果要新建网页，可以不用向下箭头键选择，而直接单击“新建”按钮。不过使用文件菜单的“新建”命令来新建网页能够有更大的选择。单击文件菜单的“新建”命令，选择“新建网页”，在“新建”对话框里，可以看到FrontPage提供的许多网页模板（如下图），可以用这些模板来建立相应的网页。在右下角的预览框里可以看到选中模板的外观。选择“两栏正文”网页，这样就创建了一个新的分为两栏的网页了。然后点“确定”。使用模板可以不用总是从空白网页开始编辑，这样就省力很多。3输入文字在编辑区内输入文字，方法同Word。注意：当按回车键后，文字会空一行显示；按shift+回车键，文字紧跟上一行显示。例1：空一行显示。 寻找记忆规律 寻找记忆规律例2：紧行显示。 寻找记忆规律 寻找记忆规律 格 式 设 置1修饰文本怎样使文字更丰富、活泼呢？一个简单的方法就是使用“格式”工具栏。（1）字体设置：选中文字，打开格式工具栏的“字体”下拉列表框，在里面选择相应的字体即可。如果浏览网页的人使用的计算机没有设置的字体，浏览器会用系统默认的字体代替设置的字体。不过，建议养成一个好习惯：一般的网页设计请使用常用字体。（2）字号设置：在“格式”工具栏“字号”下拉列表框中选择相应字体就可以了。工具栏上的B、I、U图标的作用是： 按下B按钮 ，被选中的文字就会变为粗体 按下I按钮 ，被选中的文字就会变为斜体 按下u按钮 ，被选中的文字就会带下画线（3）字的颜色设置：单击“格式”工具栏“字体颜色”按钮旁的向下箭头，选择适当的颜色，字的颜色就改变了。（4）还可以对字体进行一些其他设置。选择“格式”菜单的“字体”命令，在这里还可以作进一步的设置。这里除了“格式”工具栏可以做的设置以外，还可以设置许多效果。 “字符间距”选项卡：它是用来设置文字的间距的。单击“间距”下拉列表，可以选择字符的间距是普通、扩充还是紧缩的。选择扩充，这时预览框的文字间距就变大了。也可以调整间距大小来改变间距，输入10，文字的间距就更大了。 “定位”下拉列表：在FrontPage中每一行都有一个底线，定位就是指文字相对于底线的距离。也就是按需要上下移动文字，若选择“上移”，文字就向上移动。预览框中的黑线就是行的底线。2项目符号和编号（1）设计网页应该层次分明，结构清晰。这可以通过FrontPage的列表功能解决。选中要列表的内容，单击“格式”工具栏上的“项目符号”按钮 ，默认情况下，项目符号是一个小黑点。选择其他的项目符号，可以单击“格式”菜单，选择“项目符号和编号”命令。若要用图片作为项目符号，可选择“图片项目符号”选项卡，单击“浏览”按钮，点“剪贴画”，再点Web符号按钮，选择合适的图片，单击“确定”按钮。（2）设置缩进：单击工具栏上的“缩进”按钮 。对有顺序的内容列表需使用编号，可以单击“格式”菜单的“编号”按钮 。例如，“站点的主题”、“站点的共享边框”两行文字是属于“设计站点风格”的内容，却被编号了。解决的方法是把这两项选中，单击“增加缩进”按钮，再次单击“增加缩进”按钮（见下图）。要把这两项改为其他编号方式，可以选择“格式”菜单的“项目符号和编号按钮”，在编号框里选择合适的编号形式，单击“确定”按钮。（3）解决列表分级太多而显得不简洁的问题可通过把子列表折叠起来的方法，称为“折叠大纲”。将鼠标光标移到要折叠的列表的上一级处，单击“设计站点风格”，单击鼠标右键，选择“列表属性”命令，将“启用折叠大纲”和“开始时折叠复选框”选中，单击“确定”按钮。打开它时只要单击它就打开了。3插入水平线（1）在网页中适时的插入水平线可以使层次分明。最简单的方法是插入水平线使需要分隔的部分分开。把插入点调整到插入水平线的位置，选择“插入”菜单的“水平线”命令。（2）改变线条颜色，双击插入的线条，在弹出的“水平线属性”对话框里单击“颜色”下拉列表， 选择相应的颜色，单击“确定”按钮。（3）在对话框中有“窗口宽度百分比”和“像素”选项，它们的作用是通过调整宽度数值设置线条的宽度，但是这个数值的单位却是由它后面的选择决定。比如现在选择的是窗口宽度百分比，就表示线条的宽度就是由它占所在浏览器窗口的宽度的百分比来决定的。如果我们选择像素就表示线条宽度是100像素。单击水平线，选中它。按Alt+Enter 键，直接进入水平线对话框，调整“线条高度”为5个像素，单击“确定”按钮。线条高度就变高了。（4）水平线变化有限，装饰性不强，我们还可以插入更丰富的线条来修饰页面，那就是线条图像。 线条图像就是一个特别狭长的图像。将水平线选中，按Del键，将水平线删除，选择“插入”菜单的“图片”命令，单击“剪贴画”选项。选择“图片”选项卡，这里把FrontPage提供的剪贴画按类别放在了下面的列表框中，选择“Web框架”，选择小石头图像，单击“插入剪辑”按钮。由小石头构成的线条就插入完成了。（5）如果想把线条缩短一点，可以在线条上单击鼠标右键，选择“图像属性”命令，打开“图片属性”对话框，选择“外观”选项卡，选择“指定大小”，将宽度的单位设置为百分比，将宽度调整为80，单击“确定”按钮。4主题设置对于多个网页，需要创建风格统一的页面，可以使用主题这个功能。所谓主题就是指具有给定的外观和感觉的页面设计要素的集合。也就是说使用了主题，所设计网页中的许多固定要素都会呈现同一种风格。方法：单击“菜单”/“格式”/“主题”按钮，即会出现下图。5背景设置为了使网页具有不同的个性和特色，可以通过设置网页的背景来实现这一愿望。（1）单击“菜单”/“格式”/“背景”按钮/。（2）出现“网页属性”对话框，在“背景”选项卡中，点击“背景图片”前的勾，再点击“浏览”按钮；（3）选择背景图片的文件（可先将要用的图片存入网站的同一文件夹内）并查看效果。图 像 处 理1插入图片网页中如果插入一些与主题符合的图像，会给网页增添光彩。 在网页设计中最常用的图像有两种，其扩展名为GIF和JPEG。因为这两种图形格式不仅应用广泛，而且有利于节省存贮空间。如果图像不是这种格式，使用了其它格式的图形文件，在保存网页时FrontPage 会提示做格式转换，FrontPage 会自动进行格式转换。选择“插入”菜单的“图片”命令，单击“来自文件”按钮。在默认情况下，FrontPage认为要插入的图片总是放在所建立的网页（站点）的目录或它的子目录下的。可以说，站点就是一个目录。我们把编辑的许多网页文件放在同一个目录下，称这个目录为站点的主目录。这些网页引用的图形一般也放在这个目录下。当然，我们也可以在这个目录下建立其他的子目录，再把所有的图形放在子目录里。所以搜索下拉列表只允许在主目录和主目录下的子目录进行选择。 如果要插入的图片不在主目录下，可在“选择文件”对话框中进行选择。选择好图片文件以后，单击“确定”按钮，回到“图片”对话框。单击“确定”按钮，图片就被插入了。2保存图片（1）单击“常用”工具栏的“保存” 按钮即可。也可以在“另存为”对话框中输入新的Web页文件的名字，单击“保存”按钮。（2）出现一个对话框时,若需要插入的文件不在站点内，FrontPage可把它复制到站点内。复制时，使用什么文件名，放在站点的哪个目录下呢？这时就需要进行设置，可单击“改变文件夹”按钮； （3）单击“确定”按钮，在默认情况下，图片被保存在站点的主目录下。如现在我们选择Image目录，单击“确定”按钮。回到“嵌入式文件”窗口，再单击“确定”。这样，图片就保存在站点内了。 3插入剪贴画FrontPage自己带有许多剪贴画，可以把它们插入到自己的网页。选择“插入”菜单的“图片”命令， 选择“剪贴画”。各种剪贴画都被分类放置，可供自由地选择。不过，插入后别忘了保存网页，把剪贴画复制到站点目录下。表 格 处 理1创建表格在FrontPage的诸多功能中，制表是一个很重要的功能。利用表格不仅可以显示一些有规律的数据，还可以通过在表中插入文本和图像等元素，达到对网页进行布局的目的。案例：在图片边写上文字。不使用表格的效果： 世界只有一个地球。使用表格的效果：世界只有一个地球可见，使用表格可以起到定位的作用。 怎样创建表格呢？方法一：点击要插入表格的位置，单击“常用”工具栏“插入表格”按钮 ，拖动鼠标，直到高亮的格子的行列数与要插入的表格相同为止。下图即为3行4列的。方法二：以上方法创建的表格各单元格行高和列宽设置是相同的，如果在创建表格时需对表格进行设置，可以使用插入表格命令。 设置好插入点后，选择“表格”菜单的“插入”命令，单击“表格”命令。将行数设置为3，列数设置为4，将边框粗细设置为5，将单元格间距设为3，确认指定宽度复选框选中，并选择单位为百分比，设置百分比为80，使表格宽度为浏览器宽度的80%，单击“确定”按钮。 如此新建的表格边框变粗了，这是因为刚才设置了边框的粗细为3。另外单元格之间的分割线也变宽了，这是设置了单元格间距的缘故。此时设置也自动变为了下一次创建表格的默认设置。 方法三：还有一种创建表格的方法，即直接把表格画出来。选择“查看”菜单的“工具栏”命令，单击“表格”选项，就会显示“表格”工具栏。 单击“手绘表格”按钮 ，用拖动鼠标的方法画一个表格。 双击鼠标退出画表格状态。如果画错了就单击“擦除”按钮 ，在要擦除的线条上拖动，这时线条会变红，放开鼠标，线条就被擦除了。表格工具栏的其他按钮都与表格菜单的各条命令相对应，它们的使用方法也是一样的。2编辑表格一般表格是指整体，单元格是指表内某一个、或几个单元。 换行：一般情况下，创建好表格后直接输入文字就可以了，文字到达单元格末尾时会自动换行。有时候，想使文字在没有到达末尾时就换行，这时仅仅通过按回车键不行，因为这样做会把文本分成两个段落，文本的行距就会变大。下图就是使用回车键的效果。 此时，可以按Shift+Enter键，文本会被强制换行。再输入换行文字，这时行距就正常了。 表内文字对齐：单元格里的文本与单元格的对齐方式有时也需要调整。可以用“格式”工具栏的左对齐、居中对齐、右对齐进行设置。也可以使用如下的专门的设置方式：首先单击要调整格式的单元格，单击鼠标右键，选择“单元格属性”命令。在这里，既可以设置水平对齐方式也可以设置垂直对齐方式。 如按上图把水平对齐方式调整为“水平居中”对齐。再单击“确定”按钮，文本就水平居中对齐了。还可以把水平和垂直对齐方式组合使用，这样就可以任意地调整对齐方式了，也可以同时选中多个单元格，一起设置对齐方式。格式操作：有时要对单元格进行某种操作，比如要删除几个单元格，就要把这些单元格先选中。 选中单元格：单击要选中的单元格，插入点就在单元格中， 选择“表格”菜单的“选定”子菜单，单击“单元格”命令，单元格即被选中。 就已经选中的一个单元格，按住Ctrl键，单击其他单元格，这些单元格也就同时被选中。用这种方法可以选中不连续的单元格。选定单元格后就可以对单元格做操作了。 合并单元格： 如果把几个连续单元格合成一个单元格，应先把单元格一、单元格二选中，执行“表格”菜单的“合并单元格”命令，两个单元格就合并成为一个单元格了。 拆分单元格：要把一个单元格分成几个单元格：应把插入点放到要拆分的单元格里，选择“表格”菜单的“拆分单元格”命令，在“拆分单元格”对话框里可以设置是拆分成行还是列，若选择列，并将列数设置为2，单击“确定”按钮，这样一个单元格就被拆分为两个单元格了。 表格属性的设置：创建好的表格，根据需要进行具体设置。选中整个表格，按右键，弹出菜单，选择“表格属性”，出现“表格属性”的对话框。 对齐方式：选择“左对齐”、“右对齐”或“水平对齐”等方式，使表格按要求对齐。指定宽度：在框内输入表格具体的宽度数值，即确定表格的宽度。边框粗细：默认值“1”，数值越大，边框线越粗；数值“0”，边框线为虚线，可以起到定位作用。如将上面案例中的表格边框线设置为“0”，则显示时看不见边框线（见下图）。世界只有一个地球背景颜色：在下拉框中，选择某种颜色；如果表格或（单元格）背景需要图片，则单击“浏览”按钮，选择图片文件即可。 链 接 设 置怎样才能使自己做的各个网页能相互联系起来呢?也就是说，怎样才能让别人通过点页面上的图形或文本就能跳转到其他页面呢？在网页里，我们把这种点击后会使页面进行切换的网页界面元素叫超链接。 1用文字来建立链接（1）首先创建一个指向站点内其他网页的超链接。选择“插入”菜单的“超链接”命令，在文件列表框内选择“页面1.htm”文件（注意在URL文本框中显示了该文件的地址），单击“确定”按钮，超链接就制作成功了。（2）切换到预览模式（单击预览按钮） 。当把鼠标指向“主页”两字时鼠标变成手形，单击它，就切换到主页了。为什么不在普通模式下尝试呢？因为普通模式主要是用来编辑网页的，在普通模式下，把鼠标指向“主页”两字时鼠标没有变成小手状，因此不能进行页面切换。但是，如果想在普通模式下进行页面切换，可以按住Ctrl键，这时鼠标就会变成小手状，再单击就可以进行切换了。也就是说，在普通模式中按住Ctrl键才能激活超链接。我们也可以将超链接指向其他站点的网页。选中作为超链接的文本，单击“常用”工具栏的“超链接”按钮 ，这和选择插入菜单的超链接命令是一样的。单击“确定”按钮就可以了。（3）改变已经设置好的超链接。 首先确认是普通模式，在要改变的超链接下单击鼠标右键，选择“超链接属性”命令，输入新的URL地址即可。要想取消超链接，删除所有URL地址框里的内容就可以了。2用文字链接电子邮件还有一种超链接，是链接电子邮件，由此可以与网上朋友通过E-mail 及时建立联系。这通常是网站站长和网友交流的重要手段。（1）首先选中需要作为超链接的文本，如：请给我来信。单击“超链接”按钮，单击“信封”按钮 ，输入自己的邮箱地址。（2）单击“确定”按钮，退出对话框，选择“确定”，这时超链接就建立好了。尝试切换到预览模式，单击邮件链接，这时会激活Outlook Express，此时就可以发E-mail了。 3用图像建立链接刚才讲的都是用文本建立超链接，怎么用图形来建立链接呢？其实图形超链接和文字超链接的制作方法是一样的，只要在建立超链接时选择某一图像就可以了。 首先要选中超链接的图像，即单击图形；再单击“常用”工具栏中的“超链接”按钮，选择要链接的文件，如：“页面1.htm”，单击“确定”按钮。在普通模式中，按住Ctrl键，单击图形，就跳到主页页面了。其 他 效 果1使用音频网页除了显示图像和文字之外，还能实现多媒体功能。 对多媒体的良好支持是FrontPage的一个突出的特色。我们能够很容易地在网页里播放音频和视频。 （1）选择“插入”菜单的“高级”命令，单击“插件”属性选项。（2）在打开的“插件”属性对话框中，单击“数据源浏览”按钮，选择要播放的音频文件（我们可以选择扩展名为WAV、MID、SND、AU的音频文件），单击“确定”按钮。 在普通模式下，为了表示插入音频的位置，FrontPage就会使用这样的插头标记。现在我们切换到预览模式，音乐就自动播放了。这时，插头变成了一个播放器。这个播放器名字叫Active Movie，它是Internet Explorer浏览器自带的一个媒体播放插件。浏览器检测到我们在网页里插入的音频文件，就会在插入音频的位置显示一个Active Movie 播放器，并用它来播放音频。 （3）插件属性的设置。 最新版本的Internet Explorer 和 Netscape Navigator都带了播放多媒体的必要插件，不过如果浏览者的浏览器没有带插件或没有安装，最好给出一个不能播放文件的提示信息。我们可以在先前插入的音频文件图标上单击右键，选择“插件属性”命令。 在“浏览器不支持插件时显示的消息”文本框中输入“对不起，您的浏览器不支持这种文件格式的播放”，这样，当使用的浏览器不能播放音频时，浏览者就会在网页上看到提示信息。 改变音频图标的大小：单击音频图标，拖动图标四周的小黑点，图标就变大了，切换到预览模式，播放控件就也变大了。这和改变图片大小的操作方法是一样的。 如果想精确地调整插件在网页中显示的大小，可在普通模式下的音频图标上，单击右键，选择“插件属性”命令，只要修改“大小”部分的数值就可以调整插件的大小。 “布局”部分中：对齐方式用来调整插件与网页中其他文字的对齐方式。这也和图片的对齐方式一样；水平和垂直间距是用来调整插件与周围文本的距离的，边框粗细是用来设置图标边界的宽度的。把“隐藏插件”选项选中，可把浏览器不支持插件时显示的消息去除。 切换到预览模式。插件没有了，音乐却在播放。这说明插件仍然在播放音频文件，只不过被隐藏起来了。先前我们曾除去了浏览器不支持插件时显示的消息，这样就实现了网页的背景音乐。（4）插入音频。嵌入的使用插件才能播放的音频文件，离开了插件就不能够正常地播放。而插入则不同，它在播放多媒体时并不依赖插件，只和我们使用的浏览器有关。目前，插入的音频只能在Internet Explorer上播放。怎么插入音频？（1）在网页内单击右键，选择“网页属性”。 （2）单击背景音乐框的浏览按钮，选择插入的音频文件，单击“确定”按钮。 在默认情况下，不限次数复选框是选中的，表示文件将不断循环播放， 单击“确定”按钮。我们也可以设置播放的次数。只要在“网页属性”对话框中，去除不限次数复选框的选中，就可以调整播放次数。因为插入的音频不使用插件播放，所以播放的方式是事先设置好的，在浏览网页时，用户是控制不了的。使用音频还有一种方法，就是链接音频。只要选中“播放音频”文字，单击“常用”工具栏“超链接”按钮，选择音频文件，确定即可。 用浏览器来看一下效果：单击超链接，音频文件就在独立的Active Movie 中播放了。我们还可以下载音频文件：在超链接上单击右键，选择“目标另存为”命令即可。2使用视频用FrontPage可以灵活地使用音频，也可以很方便地使用视频。这和使用音频的方法差不多，嵌入、插入和链接的方法都能使用视频。（1）嵌入视频。单击要插入视频的地方，设置好插入点，选择“插入”菜单的“高级”子菜单，执行“插件”命令。单击“数据源浏览”按钮，选择视频文件，单击“确定”按钮，选择“确定”。 切换到页面模式，视频就可以播放了。 嵌入视频和嵌入音频一样，都要使用插件来播放。使用插件，浏览者可以方便地控制媒体的播放。如果播放的控件太小，可以把它变大一点：回到普通模式，单击视频的图标，拖动视频图标周围的小黑点。 （2）插入视频。插入视频也和插入音频一样，只有Internet Explorer才支持，在Netscape Navigator中是不能看到插入的视频的。现在来看一个插入视频的网页。一旦把鼠标移动到画面上，先前还未播放，只是显示了视频的第一帧的画面，立即就动了起来。单击要插入视频的地方，设置插入点，选择插入“菜单”的“图片”命令，选择“视频”选项，打开“视频”对话框，选择插入的视频，单击“确定”按钮。切换到预览模式。视频就能自动播放了。 在默认设置下视频是自动播放的，我们也可以改变设置：切换到普通模式，在插入的视频上单击鼠标右键，选择“图片”属性命令，单击“视频”选项卡，这个选项卡列出了插入视频的设置。 我们可以通过更改视频源插入另一个视频；还可以在“重复”部分设置播放的遍数和每遍播放的间隔时间。“播放”中的“打开文件时”，表示视频将在打开网页进行浏览时播放；“当鼠标移过时”表示当鼠标在视频位置上经过时开始播放视频。（3）链接视频。选中要作为超链接的文字，单击“常用”工具栏的“超链接”按钮，选择要链接的文件，单击“确定”按钮，选择“确定”，超链接就做好了。用嵌入、插入、链接的方法都能使用视频和音频。三种方法各有特点，一般常用的是链接的方法。通常音频、视频文件都比较大，把它们放在站点里不太合适，而链接可以指向Internet上的任何位置，这样，我们就可以在其他地方存放媒体文件，甚至链接到别的站点的音频、视频文件上；同时链接还可以让用户方便地进行媒体文件的下载。嵌入的方法可以使音频、视频和网页融为一体，也被许多浏览器支持，可以用它来增强网页的吸引力；插入音频、视频文件目前只能在Internet Explorer中才有效，不过它既可以在设计时设置媒体播放的方式，也可以响应浏览者激发的事件，同时不需要插件来播放，制作网页特效时就可以采用它。发 布 网 页完成网页制作以后，可以将网页保存下来。只要单击“文件”菜单的“另存为”，在弹出的对话框中输入文件名称即可，其扩展名为HTML，是软件自己追加的。 另外，也可以将网页或网站发布到网上。（1）单击“文件”菜单，选择“发布站点”。（2）在弹出的“发布站点”对话框中，在“指定发布站点的位置：”文本框里输入已申请好的个人网站的地址，如“”。（3）单击“发布”按钮，这时，FrontPage就开始向网上发布站点了。（4）站点发布成功，会显示如下窗口。选择“单击此处可以察看您发布的站点”，这时我们发布的站点的主页就在浏览器中显示出来了。