使用Frontpage制作网页

1、使用Frontpage制作网页李胜龙2006年8月前 言v FrontpageXP是OfficeXP中的组件之一，它的使用和Word在很大程度上有些相似，所以只要会用Word，那么学习网页制作将会是件十分容易的事。 常见的制作网页的工具有flash、dreamweaver、frontpage等，其中因为frontpage使用简单，制作方便，深受初学者的青睐。今天我们就以frontpageXP为例，来讲讲如何来制作一个简单网站。 启动v开始程序icrosoft Frontpage认识FrontpageXP的界面v从这里，我们可以看到， FrontpageXP的界面和WordXP相似，最上面蓝色一

2、条称为“标题栏”，显示的是文件的名称，下面是“菜单栏”，包括文件、编辑等菜单项，接下来是“常用工具栏”和“格式工具栏”关于工具栏中按钮的使用，我们下面的学习中将一一了解。左侧这边是“视图栏”，里面有6种视图方式，单击就可选择其中的一种，一般我们只使用其中的一种，就是“网页视图”。当然，如果你觉得这一条就在这边有点碍眼的话，可以到“查看”菜单中单击一下“视图栏”命令，就可以将它隐藏起来。右边这一块空白区域是“编辑区”，就是在这里制作我们的网页。“编辑区”下方我们可以看到有三个“切换按钮”，第一个是“普通”按钮，也就是切换到现在这个界面。第二个是“HTML”，单击了这个按钮之后，你会看到编辑区有很

3、多代码，事实上这些就是网页的源程序，在这里我们可以为网页加一些网页特效，用来美化我们的页面。第三个则是“预览”按钮，当我们做了一些网页之后，就可以通过这个按钮来看看有没有达到自己预期的效果，如果不满意，就可以点“普通”回过去修改一下你的网页。到手开始做网页v接下来，我们就可以开始动手做网页了。但是大家现在想一想，你想做的网页是不是只是一张页面呢，当然不会，事实上，你要做的肯定是由多张页面，多张图片，甚至是音乐组合而成的，那么首先我们就必须建立一个站点来放这些内容。v在“文件”菜单中指向“新建” “站点”，（如右图），就会出面下图三v选择“空站点”，在位置中输入站点的路径和名称。（注意：一般默认

4、的是C盘下的我的文档，不过为了给C盘节省空间，我们建议不在C盘下建立站点，可以直接输入路径，如在E盘下建立，就直接输入E : My web,就可以在E盘下建立一个名为My web的站点。名称可以自己随便取，但一定要是英文的 ）。建好站点之后，你会看到标题栏上显示的是该站点的路径及名称，这说明你已经打开了这个网站。v现在我们可以开始做第一张网页了，首先单击“常用工具栏”上的“保存”按钮，将第一张页面保存下来，第一张一般取名为“index”, 保存好后，我们可以看到左侧的“文件夹列表”中就多了这个网页文件。下面的工作就是在这张页面上输入文字、插入图片等。首先我要强调很重要的一点，文字、图片不能直接

5、输入，一定要先制作表格，用表格来为网页布局。而且一张网页不能只用一个表格。v一般页面顶部是放置标题图片的，所以就可以插入一个一行一列的表格，然后在表格内插入标题图片。下面则可以根据网页的布局需要由插入其他表格。（注意：插入表格的时候要把表格的边框改为，否则在做出来的网页上我们会看到一条条表格线，很不雅观）。如我们再在标题图片的下面插入一个一行多列的表格，然后输入需要链接的文字，比如“作者简介”，“文章内容”等。再下面再插入一张大的表格，输入主要的文字内容。当然，表格怎么插，插在哪，都是根据你的网页布局来制作的，并不是一定要和我这个一样。vFrontpageXP中文字格式的设置和WordXP中是

6、一样的，只要选择“格式工具栏”上的相应按钮就可以了。v现在我们就当这张网页已经完成了，那么显然接下来就要做个保存工作了。保存非常重要，如果没有保存，那么前面的内容就白做了，但是如果保存了，却没有正确地保存，那么也会前功尽弃的，网页中的图片、声音等文件都需要做一个保存。一般可以先单击“保存”按钮，然后按提示保存，图片保存在图片文件夹 “images”中，页面可以直接保存在站点的一级目录下，声音可以另建一个文件夹保存，也可以直接保存在一级目录下。（注意：所有的文件名必须是英文、数字或英文与数字的结合，绝不能出现在一个中文字，否则将来挂到网上的时候就将不能显示。）v接下来我们将制作其他的几张页面，来

7、看看如何建立页面与页面之间的链接，先新建一张页面，同样取名保存，在页面上设置好内容，然后回到“index”页面上，先选定相应的链接文字，右击，选择“超链接”命令，在弹出的创建超链接对话框中选择所需要链接到的页面，然后单击“确定”按钮就可以了。v我们经常在打开一张页面后就听到动人的歌曲，这是给网页加上了背景音乐。背景音乐的加入是首先将所需要的音乐文件放到站点的相应文件夹内，然后在该网页的空白处右击，选择“网页属性”命令，在“网页属性”对话框的“常规”标签中背景音乐的位置项中单击“浏览”按钮，然后选择音乐文件所在位置，选定该文件，再单击“确定”按钮。然后再单击“常用工具栏”中的“保存按钮”即可。v

8、前面我提到了可以在网页中加入一些网页特效来美化页面。网页特效在网上可以找到很多，你只要打开一个搜索网站，然后输入“网页特效”，就可以找到了，再根据自己的需要选择合适的特效，把源代码复制，然后在Frontpage中单击“”，将代码粘贴到相应的位置就可以了，具体的位置一般提供该特效的网页会告诉你的。并且你还可以对一些特效进行文字上的简单修改。v内容内容：v网页框架的处理v网页图像处理v在网页中使用超链接一、网页框架的处理v（一）、创建框架网页v 1、认识框架网页 v框架网页是种特殊的HTML网页，它可将浏览器窗口分成不同的区域，称为框架区域。每个区域都可以显示不同的网页.v（1）框架网页的特点 v

9、（2）框架网页的种类v常用到的框架网页是：标题、标题页脚和目录、垂直拆分、横幅和目录、脚注、目录、嵌套式层次结构、水平拆分、页脚和自顶向下的层次结构v2、创建框架网页（二）、编辑框架网页v1、在框架网页中添加和格式化文本v在框架网页中添加和格式化文本与在普通的网页中添加和格式化文本相同。v2、调整框架的大小v（1）拖动框架的边框调整框架大小v（2）精确设置框架大小v3、拆分框架v在框架网页中不但可以调整框架的大小，还可以设置网页中显示的框架的多少。在框架网页中可以任意地拆分框架。v（1）拖动边框拆分框架v（2）将框架平均分成两行或两列v4、删除框架v注意：从框架网页中删除框架时，该框架中显示的

10、网页也会被删除，但是框架网页中其余的内容并没有被删除。若框架网页仅含有一个框架，就不能删除该框架。v5、为框架网页设置背景颜色和背景图片 v（1）设置框架网页的背景颜色v（2）设置框架网页的背景图片（三）、设置框架网页属性v1、示和隐藏框架边框v可以根据所需的网页外观来选择显示或隐藏框架网页的框架周围的边框。v2、显示和隐藏框架滚动条v在“框架属性”对话框中，从“显示滚动条”的下拉列表中选择“显示”或“不显示”或者“需要时显示”。(四)、在框架网页中设置超链接v在框架中设置文本超链接v2、在框架中设置图片超链接v（五）、保存框架网页二、图像处理v网页中的颜色v图像与颜色是分不开的。在网页中是以

11、RGB方式来表示颜色的，RGB颜色包括几百万种之多，这么多的颜色却有一个共同点，都是由红、绿、蓝这三种基色调混和而成的，RGB其实就是Red、Green、Blue的缩写。v2、图像格式vGIF格式、JPEG格式、PNG格式、矢量格式 v3、使用网页图像的要点v在Web页上显示图片之前，通常需要考虑下列三个问题：v 确保文件较小；v 控制图像的数量和质量；v 合理使用动画。v4、设置网页背景v改变网页背景的状态可以通过两种方法来实现，一种是设置背景颜色；另一种是设置背景图像。三、在网页中使用超链接v1、创建文字超链接v（1）什么是超链接v所谓的超链接是指从一个网页指向一个目标的连接关系，这个目标可以是另一个网页，也可以是相同网页上的不同位置，还可以是一个图片、一个电子邮件地址、一个文件，甚至是一个应用程序。而在一个网页中用来超链接的对象，可以是一段文本或者是一个图片。当浏览者单击已经链接的文字或图片后