七月网

frontpage教程(frontpage基本操作)

七月网2290

一、FrontPage简明教程:网页布局

1、通常网页的布局使用到的是FrontPage中的表格和框架菜单栏里的命令。

frontpage教程(frontpage基本操作)

2、表格(TABLE)是将页面中的内容以表格的形式排列,常用于单一页面内图片与文字的安排,是最常用的布局命令。

3、框架(FRAMES)是在同一浏览器窗口中显示多个相互隔离的HTML页的结构。使用框架组织页面时,每个框架显示一个不同的独立页面或者图像,你可以将一些框架中的内容永远保留在浏览器窗口中,而其余窗口则发生改变。

4、表格的使用十分简单,一般经过如下步骤:

5、点击“表格”菜单中的“插入表格”,在弹出的对话框中可以对所需表格的行列数及边框属性进行设置。插入一个大概样子的表格,自己调整它在整个网页中的位置,为之后填充内容做好准备。

6、二、对表格外观进行前所未有的美化

7、鼠标左击已经插入的表格,弹出的菜单中选择“表格属性”选项。弹出的对话框可以让你对表格的外观进行设置。基本上除了行列数这些需要使用插入行列等菜单完成的功能,在此设置的大都和表格的外观有关。

8、FrontPage 2002的新功能:表格自动套用格式提供了快速和容易的方法,来创建具有专业外观的表格。用户可以选择他们想要使用的样式,可以自动更改表格的边框、底纹和颜色。使用新的填充表格,用户可以将一个单元格的内容快速地重复输入到该单元格右侧的单元格(向右填充),或输入其下面的单元格(向下填充)。当用户想要将相同内容复制到多个单元格中时,该功能将节约用户的时间。拆分表格让用户能够将任何位置的表格快速和容易地拆开。当用户想要在表格的各行之间添加文本或图形时,这会很方便。

9、§在 FrontPage中编辑任何表格时,单击该表格,并从表格菜单中选择表格自动套用格式。从几个表格格式和设计中选择,以创建想要的外观。

10、§从表格菜单中单击插入,插入五个新行,然后选择行或列。在想要复制的内容下面,添加所需数量的行。选中想要复制的文本和想要填充的单元格。从表格菜单中选择表格填充,然后选择向下填充或向右填充,以匹配突出显示的单元格。

11、§在表格中间挑选一个单元格,然后从表格菜单中选择拆分表格。

12、只需点击鼠标在表格中与插入的地方,就可以输入文字或者创建图像,或者导入文字图像等等,简简单单的操作之后,一张有条有理的网页就做好了。

13、与以往的FrontPage一样,在FrontPage 2002中可以非常方便地利用框架来组织页面。

14、一般地,利用框架组织WEB页面需要经过如下步骤:

15、在FrontPage 2002中,点击新建图标旁的小三角调出新建网页模板选择窗口,选择满意的模板创建框架Web页面。如果没有模板符合需要,你可以选择最接近的风格,然后改变框架大小或者增加框架以得到想要的结构。

16、可以拖拉框架边改变框架大小;增加或删除框架则可以使用框架菜单中的拆分框架和删除框架命令。

17、在这里我们建立一个目录框架页面。

18、点击页面右键菜单中的框架属性,在弹出的对话框中设置框架属性。你可以指定框架名称、控制框架之间边界的大小、在一个框架内是否允许滚动等。

19、在显示滚动条选项框中选择在该框架中是否允许存在滚动条。点击框架网页按钮进入该框架的页面属性设置窗口。在框架间距标签中设置框架之间的边界的宽窄,也可以取消显示边框的选项,不显示框架边框。记住,框架之间的边界越大,对于读者观看页面就越困难。

20、一般地,我们把左、右两个框架名称定义为“contents”(目录)和“main”(主框架)。

21、作为Web设计者,你要决定当第一次出现框架页面时,在每个框架内显示哪个页面即初始页面。只要框架的初始页面存在于你的Web中,这个页面就能够在每次显示框架时自动出现在框架中。

22、点击工作区域上的“设置初始页面”按钮,在对话窗口中设置初始页面。这时你可以选择点击原有文件中的浏览按钮查找需要的页面,或点击新建页面按钮直接在框架中新建一个页面。在这里我们新建一个页面。

23、在使用框架时一定会遇到如何处理框架间的调用关系的问题,即点击一个框架中的超链接后目的页面将会出现在哪一个框架内,或是新打开一个浏览器窗口。我们接着上面的例子来学习如何处理调用关系。

24、现在,我们需要在左边的页面中加入超链接,选中页面中任一蓝色按钮作为加入超链接的对象,这时我们希望所链接的页面在调入时出现在框架“main”中。你会发现在设置超链接窗口的右侧有一目标框架按钮,点击按钮将出现目标框架窗口,在这个窗口中你可以随意设定目的页面将出现在哪个框架中。你可以直接在“当前框架网页框”中选择左或右框架作为目的框架。你也可以选择“公共目标区框”中的选项来确定目标页面的出现形式:

25、“默认网页(main)”:目标页面将出现在默认目的框架中,默认目的框架可以在框架的页面属性设置窗口中设置。如果不加以说明,系统将按照默认目的框架调用目标页面。

26、“当前相同网页”:目标页面将出现在同一框架中,也就是覆盖调用页面。

27、“整个网页”:目标页面将覆盖整个框架页面,独立地出现在浏览器窗口中。

28、“新窗口”:目标页面将出现在新打开的一个浏览器窗口中,而在原来的浏览器窗口中不发生任何变化。

29、在上面的例子中,我们将“Contents”框架中所有链接的目的框架都设为“main”框架。

30、好了,你已经能够在你的主页中利用框架来组织页面了!很简单,是吗?

31、新功能:FrontPage 2002现在支持由高级技术(例如 HTML 4)实现的功能,包括嵌入式框架、语言属性以及表单中的按钮和字段集。让这些特性帮助您做出更具动感和专业的Web站点

32、从插入菜单中,选择嵌入式框架,然后选择“设置初始网页”并浏览到您的站点上或 Internet上的任何 Web页,(插入项的名称/地址应当出现在地址窗口中),然后单击确定。所选页将出现在 Web页的框架中。通过选中它然后拖动角落,还可调整该框架大小。(连载)

二、FrontPage教程编辑网页

现在进入FrontPage。单击任务栏“开始”按钮,选择“程序”选项,单击“Microsoft FrontPage”选项就可以了。可能你会发现FrontPage界面和Word很相似[图2-1],这是因为编辑WEB页面和编辑Word文档有很多同样的设置,这些设置所用的图标和Word中的是一样的。

  [图2-1]FrontPage2000界面

视图中的组框是用来切换视图的,单击里面的小图标就可以切换到不同的视图。FrontPage共有6种视图[如图2-1左],使用不同的视图可以从不同的侧面查看设计的WEB站点。对一个WEB站点而言,不断更新是很重要的。随着站点的成长,维护站点的工作量会越来越大。建立站点可能很快,但是如果没有这6种视图的帮助,维护起来就很困难了。

这些视图的使用不用一下就全部掌握,只要知道有这些视图就可以了。

下面看一看同一个WEB站点在不同视图中是怎样显示的。

(1)单击“网页”按钮,切换到网页视图,再单击工具栏上的“文件夹列表”按钮,窗口中增加了一个文件夹列表框[图2-2]。网页视图是用来显示选中的网页的,双击文件夹列表中的某一个HTM文件,在最右方的工作区中就会显示该网页的内容。

注意,此时工作区的左下角有三个切换显示模式的选项卡[图2-3]。单击“普通”选项卡,就切换到了普通模式。在普通模式可以编辑网页的内容以及设置各种格式。单击“预览”选项卡就到了预览模式。如果要看一看当前编辑的文件在浏览器中的显示情况,就使用预览模式,在预览模式下,是不能编辑网页的。也可以切换到HTML模式直接对网页对应的HTML文本文件进行编辑,从而为网页作一些特殊的设置,前提是你要懂一点HTML语言(在教程附录中有相关说明)。

  (2)文件夹视图以列表的形式给出了当前WEB站点的文件夹和文件夹里包含的文件[图2-4]。由于一个WEB站点要涉及到许多文件,因此将这些文件分类并分别放到不同的文件夹就很有必要。比如,可以把所有的图形文件放入IMAGES文件夹。FrontPage还提供了一个_PRIVATE文件夹,用来存放一些对网络浏览者不可见的信息。下面为当前站点再添加一个SOUND文件夹,用来存放WEB站点用到的声音文件:选中站点的根目录,然后单击“文件”菜单的“新建”项,在弹出的子菜单中选择“文件夹”命令。在输入SOUND,新文件夹就建立好了[图2-5]。

  其实一个站点实际上就是一个目录,在这个目录下可以建立许多子目录,并将站点的各种文件放在这些目录里。

(3)报表视图给出了当前站点的一些统计信息。这里可以知道在站点的目录中哪些文件被链接进站点了,哪些没有。

(4)导航视图可以方便地组织站点中各网页的层次关系,在本视图中,每一个页框代表一个网页。如果站点设置了导航功能,就可以先在这里设置好各网页的层次关系,然后用导航栏把这种层次关系表现出来。

(5)超链接视图是用来察看选中网页中设置的超链接的。通过它可以方便地知道在网页中设置了多少超级链接,以及是什么类型的链接。

(6)任务视图里放着关于站点维护的任务列表,如果站点大到由许多人共同维护,他们就可以通过任务列表知道工作的进展情况了。

创建页面最简单的方法就是单击FrontPage“常用”工具栏的“新建”按钮。它的右方有一个向下的小箭头,它是用来选择要新建什么,可以用“新建”按钮新建网页、站点、文件夹和任务。默认状态下是新建网页。

  如果要新建网页,可以不用向下箭头键选择,而直接单击“新建”按钮。不过使用文件菜单的“新建”命令来新建网页能够有更大的选择。

单击文件菜单的“新建”命令,选择“新建网页”,在“新建”对话框里,可以看到FrontPage提供的许多网页模板[图2-6],我们可以用这些模板来建立相应的网页。在右下角的预览框里可以看到选中模板的外观。选择“两栏正文”网页,这样就创建了一个新的分为两栏的网页了。然后点确定。

使用模板可以不用总是从空白网页开始编辑,这样就省力很多。

怎样使文字更丰富、活泼呢?一个简单的方法就是使用“格式”工具栏。

字体设置:选上文字,打开格式工具栏的“字体”下拉列表框,在里面选择相应的字体就可以了。如果浏览网页的人使用的计算机没有设置的字体?浏览器会用系统默认的字体代替你设置的字体。不过,使用常用字体是一个好习惯。

字号设置:在“格式”工具栏“字号”下拉列表框中选择相应字体就可以了。

工具栏上的B、I、U图标的作用是:

按下B按钮,被选中的文字就会变为粗体.

按下I按钮,被选中的文字就会变为斜体.

按下u按钮,被选中的文字就会带下画线.

字的颜色:单击“格式”工具栏“字体颜色”按钮旁的向下箭头[图2-9],选择适当的颜色,字的颜色就改变了。

  还可以对字体进行一些其他设置。选择“格式”菜单的“字体”命令,在这里我们还可以作进一步的设置。这里除了“格式”工具栏可以做的设置以外,还可以设置许多效果。

“字符间距”选项卡:它是用来设置文字的间距的。单击“间距”下拉列表,可以选择字符的间距是普通、扩充还是紧缩的。选择扩充,这时预览框的文字间距就变大了。也可以调整间距大小来改变间距,输入10,文字的间距就更大了。

“定位”下拉列表:在FrontPage中每一行都有一个底线,定位就是指文字相对于底线的距离。也就是把文字上下移动,现在选择“上移”,文字就向上移动了。预览框中的黑线就是行的底线。

设计网页应该层次分明,结构清晰。这可以通过FrontPage的列表功能解决。

选中要列表的内容,单击“格式”工具栏上的“项目符号”按钮,默认情况下,项目符号是一个小黑点。你也可以选择其它的项目符号,单击“格式”菜单,选择“项目符号和编号”命令。选择“图片项目符号”选项卡,单击“浏览”按钮,点“剪贴画”,再点Web符号按钮,选择合适的图片,单击“确定”按钮。

对有顺序的内容列表可以使用编号。单击“格式”菜单的“编号”按钮。现在有一个问题,“站点的主题”、“站点的共享边框”两行是属于“设计站点风格”的内容,可是也编号了。解决的方法是把这两项选中,单击工具栏上的“增加缩进”按钮,再次单击“增加缩进”按钮,这样就可以了[图2-12]。要把这两项改为其他编号方式,可以选择“格式”菜单的“项目符号和编号按钮”,在编号框里选择合适的编号形式,单击“确定”按钮。

怎样解决列表分级太多而显得不简洁的问题?方法是把子列表折叠起来,称为“折叠大纲”。将鼠标光标移到要折叠的列表的上一级处,单击鼠标右键,选择“列表属性”命令,将“启用折叠大纲”和“开始时折叠复选框”选中,单击“确定”按钮。打开它时只要单击它就打开了。

在网页中适时的插入水平线可以使层次分明。最简单的方法是插入水平线使需要分隔的部分分开。把插入点调整到插入水平线的位置,选择“插入”菜单的“水平线”命令。

双击插入的线条,在弹出的“水平线属性”对话框里单击“颜色”下拉列表,选择相应的颜色,可以改变线条颜色。在对话框中有“窗口宽度百分比”和“像素”选项,它们的作用是通过调整宽度数值设置线条的宽度,但是这个数值的单位却是由它后面的选择决定,调整“高度”的数值,可以改变线条高度。

单击水平线,选中它。按ALT+ENTER键,也可直接进入水平线对话框。

水平线变化有限,装饰性不强。我们还可以插入更丰富的线条来修饰页面,那就是线条图像。线条图像就是一个特别狭长的图像。将水平线选中,按DEL键,将水平线删除,选择“插入”菜单的“图片”命令,单击“剪贴画”选项。选择“图片”选项卡,这里把FrontPage提供的剪贴画按类别放在了下面的列表框中,选择“WEB框架”,选择小石头图像,单击“插入剪辑”按钮。由小石头构成的线条就插入完成了。

如果想把线条缩短一点,可以在线条上单击鼠标右键,选择“图像属性”命令,打开“图片属性”对话框,选择“外观”选项卡,选择“指定大小”,将宽度的单位设置为百分比,将宽度调整为80,单击“确定”按钮。

在Internet上我们经常看到许多网页上都有一个最新更新日期,用来告诉用户页面上一次更新是什么时候,这是怎么做的呢?看完下面的部分你就知道了。

时间标记当活动网页被重新编辑或自动更新之后,会自动改变。设置起来也很容易:在页面末尾输入:“更新时间”,执行“插入”菜单的“日期与时间”命令,在“日期时间属性”对话框中选择“该网页上次编辑日期”,如果要改变日期的格式,可以单击“日期格式”下拉列表,选择合适的格式。

怎么在网页里插入注释呢?(在我们创建编辑和修改网页的过程中,经常需要插入一些文字,表明设计的意图和方法,在编辑网页时作为参考和提示,这就是注释。)

插入注释的方法是:普通模式下单击当前网页要插入注释的位置,把插入点设置到那里。选择“插入菜单”的“注释”命令,这样就会弹出“注释”对话框,在“注释”文本框中输入注释的内容,单击“确定”按钮。

在指定的位置注释出现了。现在单击“预览”选项卡,切换到预览模式,注释没有出现。实际上注释并不是在浏览器中显示的网页的一部分,浏览者通过浏览器是看不到网页里的注释的。

设计好的页面,应该检查它在浏览器中是否显示正常。

方法是,一般只要切换到预览模式就可以了。单击“预览”选项卡,在这个预览模式下的显示和在浏览器中的显示是一样的。但这并不意味着我们就不必用浏览器来检查编辑的网页了。因为即使是同一个页面,可能在不同的浏览器中显示会不太一样。比如在Internet Explorer中是这样显示的,但是在Netscape中又是那样显示的。所以,我们要在自己的机器上多装几个浏览器,用来检查网页的兼容性。

怎么用不同的浏览器来检查呢?选择“文件”菜单的“在浏览器中预览”选项,在浏览器列表框中选择不同的浏览器[图2-18]。(以Internet Explorer 5.0为例)单击“确定”按钮。就可以看到新建页面在浏览器中的效果了。

这一部分内容很简单,但是这些内容在制作网页的过程中几乎每次都会用到,“万丈高楼平地起”,不要小看这些最基本的操作呀。

三、怎么用frontpage制作网页

1、Frontpage是由微软公司于1995年率先推出的一款网页制作入门软件,其特点就是简单易学易上手,但是该软件已于2007年停止更新了,目前该软件主要有三种模式分别是设计、程式码、预览。但是,有一点毋庸置疑即frontpage为我们的工作学习带来了很大的便利,我们在学习网页制作的前期,可以将frontpage和Dreamweaver结合去练习,便于我们更好的学习网页的制作。

2、下载Frontpage软件安装包,下载时为了安全起见尽量不要下载破解版;

3、打开该软件——选择文件菜单栏下的新建(右边空白栏也有新建空白文档,二者选一即可)

4、网页中表格的插入:菜单栏上的表格——插入——表格,

5、最后还要设置表格的属性,选中表格右击——属性,即可;

6、网站规划,表格——布局表格或单元格;

7、导航栏设置表头、表中等,直接选择插入——图片——来自文件、新建图片等根据自己的需要去选择;

8、网页的制作一定要美观大方,才能获得更好的用户体验,不可敷衍了事;

9、掌握一定的代码知识,因为网页制作需要能看懂最基本的代码;

10、网页制作要有一定的创作意识,所以在平时的生活中要注重创作能力的培养。

文章分享结束,frontpage教程和frontpage基本操作的答案你都知道了吗?欢迎再次光临本站哦!