|
|
|
|
网页制作 |
1. 制作你的第一份网页
我们先来做一份简单的网页：(FrontPage 2000,2002)
首先打开File菜单下的new（或者点击工具条第一个图标）建立一个空白页面。
在这个页面中你可以象使用WORD那样键入文字，例如先设置网页的标题，用鼠标拖拽选中键入的标题，然后点击工具条中中的大A放大字号直至满意的大小，你还可以点击图标将其设置为加重显示的字体。点击行对齐图标中间的图标将文字设置为居中显示。回车（注意回车时的设置和WORD有所不同，Shift+Enter为行回车，而直接按Enter则是段落回车，段落回车后的两行之间会插入一个空白行）。在HTML代码中两者的区别在于行回车的代码为<BR></BR>，而段落回车的代码为<P></P>。）
由于在网页中常常需要加入各种图片来增加网页的观赏性，为了控制图片在网页中的位置，你需要将文字和图片都放置在表格单元中来控制网页的布局。打开Table菜单下的Insert Table，在弹出的对话框的size中设置表格的行数和列数，在 layout中设置表格的对齐方式（alignment）、表格边框尺寸（Border Size）、表格单元中文字或图象同单元边框的空白（Cell Padding）、以及表格单元之间的距离（Cell Spacing）。如果你将这3个选项都设置为0，则在网页中不显示表格的边框，表格单元都紧贴在一起。如果你选中设定宽度（Specify Width）的复选框，则可以在右边的方框中设定表格的宽度，并选择以象素（in Pixels）或百分比（in Percent）为单位。
你可以在表格中加入文字、图象甚至动画等各种内容。表格可以作为你的网页布局的基本框架。你还可以在表格中套用表格，以实现更复杂的布局。表格的单元还可以拆分或合并，如果拆分或合并后的结果仍然不能达到你的布局要求，则你需要在表格中套用变革。例：在该大表格的右下角的单元中又插入了一个2X2的表格，加入的表格中的行宽和大表格左下角的单元的行宽不同。如果你不插入新的表格就实现不了这种区别，在键入中文字符的时候注意一点：将字体设置为宋体，因为目前浏览器只支持宋体中文字符的显示，如果你用其他的字体，则有可能出乱码。
2.插入图片将光标置于需要插入图片的位置，打开Insert菜单下的image选项（或者点击工具条中的插入图片的图标，则弹出一个对话框：你可以直接键入图片所在位置的URL 或者点击图标在弹出的文件夹对话框中选择所要加入的图片文件名。你还可以点击Clip Art按钮，从windows自带的图片库中寻找合适的图片，或者点击Scan，然后从扫描仪中扫描所需的图片。
图片的对齐方式可以通过工具条行对齐图标来设置。如果你希望文字包围在图片周围，如本文左边的图片那样，则需要点击鼠标右键，在弹出的菜单中选择Image Property选项，则会弹出图象属性对话框：点击Appearance标签，从中选择layout项下alignment的下拉选单，在弹出的菜单中选择相应的位置，例如左边的这幅图片选择的是right，如果有时候出现图片是在右首但文字无法在左首包围图片的情况，你还可以通过在HTML源代码中在<img>标签中加入valign="top" ，则文字就会和图片的顶端对齐。
valign=“center”则会使文字同图片的中部对齐，valign ="bottom"则会使文字同图片的底端对齐。在图象属性的Appearance对话框中你还可以设置图片同周围文字的水平和垂直垂直距离(horizontal spacing和vertical spacing)，是否给图片加边框以及边框的厚度(specify border thickness的复选框及参数设置框）等设置。
3.设置链接网页最重要的特点之一在于你可以通过网页上的各种链接进入下一级网页或者条到别的网站。
在HTML 代码中主要通过<a href ="......"> </a>或者<a img src="......"> </a>设置链接。
在FrontPage2000中你通过鼠标点击等简单的动作就可实现链接的设置。
例如：如果你想设置这样一个链接，让读者点击“my first page"就可进入你的"my first page"这份网页，你只需在网页中适当的位置键入my first page，用鼠标拖拽选中这几个文字，然后点击工具条中的图标，则弹出的对话框URL框中键入所对应的链接，或者点击对话框中的图标，然后在弹出的文件夹对话框中选择相应的文件。
通过选择文件夹对话框中的文件名设置的链接为相对路径的链接，注意将来上传你所制作的网页到你所在的服务器时必须将所链接的文件也放在相应的路径（子目录）中，否则就会出现我们常说的missing link。所以尽量将URL设置为绝对路径，即以http://开头的完整的路径名，这样虽说比较费事，但是不容易出现missing link这样的问题。
给图片设置链接时，首先用鼠标选中图片，然后点击图标，之后的方法和文字链接的设置方法相同。
4.设置图像映射设置图象映射的过程用HTML代码编写的方式是一件很令人头疼的事情，因为你必须计算每个坐标的位置。但在FrontPage2000 Editor中就象捻死一只苍蝇那样容易（其实捻死苍蝇可不是简单的事情，你首先得设法抓住一只苍蝇，然后忍着恶心捻死它）
废话少说，转入正题。首先，在网页中插入适当的图象，例：然后点击该图片，你会发现在FrontPage2000界面的底部出现了图象编辑工具条：假设你要在鳄鱼的鼻子上做一个链接，将其链接到mynose.htm文件（当然这个文件得先制作好）。你可以先用鼠标选择工具条中的形状工具，例如我们选择方框图标，然后在鳄鱼的鼻子周围拖出一个方框来，则会弹出设置链接的对话框，之后的工作就和文字链接的设置方法一模一样了。你还可以用圆圈或不规则图形的图标在图象上设置圆圈或不规则图形的图象映射。
5.设置页面的背景属性在今天的课程中你将学习如何设定页面、文字、表格及表格单元的背景色、背景图象甚至背景声音等等，设定网页的边距、留白、单元格内文字和图象的显示位置、字体、字号，如何增加、拆分和合并单元格（其实它的设置方法和Word十分相似）等等，学习完本篇之后你已经可以设计出专业水准的网页。
我们首先学习如何设定页面、文字、表格及变革单元的背景色或背景图象。
打开FrontPage2000的界面，建立一个空白新文件。在页面中插入一个2X2的表格，在表格中随意键入一些文字（以便使下一步中弹出的菜单中也显示表格属性（table property）表格单元属性（cell property）及文字属性（font property）编辑子菜单。在页面中点击鼠标右键，然后在弹出的菜单（如左图所示）中选择page Property...（页面属性），则弹出页面属性编辑对话框：在该对话框中有5个标签：General( 基本属性)、Background(背景属性)、Margin (边距）、custom（定制）、Language（语言）。
点击Background标签，则显示右图所示的背景属性对话框。如果你想将一幅图象设置为背景图案，则点击选中Background Image复选框，则该项下面的长条方框变为白色，表示你可以在其中键入背景图象所在的路径和文件名。你也可以点击长条框右边的Browse按钮，在弹出的对话框中选择文件路径和文件名。设定之后点击确定按钮你旧会发现页面的背景已经变成了你所喜欢的图象。如果你利用Photoshop或其他图象编辑软件将图片做一些特殊处理之后再用页面背景，则更能增加网页的艺术效果。如果你不想用图片作为背景（因为图片体积一般都比较大，容易造成下载时间过长的问题），你也可以选择某种颜色作为网页背景。首先点击Background右边的下拉选单，在弹出的颜色选单中选择适合的颜色。
你还可以点击颜色选单中的Custom项，在弹出的调色板中配置自己中意的颜色。你还可以在背景属性对话框中设置文字的颜色，方法是点击Text项右边的颜色下拉选单，然后从中选择喜欢的颜色。另外，在该对话框中你还可以设置链接的颜色。链接颜色的缺省设置是蓝色，你也可以选择其他的颜色作为链接（Hyperlink）的颜色。Vsisted Hyperlink指的是你点击过的链接所显示的颜色，以便使你能很容易地分辨出那些链接的项目你已经能够访问过了。Active Hyperlink是指当你点击某个链接的同时该链接所显示的颜色。
6.在网页中加入背景音乐除了设置背景图象或背景颜色，你还可以设置一种背景音乐或声音。但这个设置是在页面属性对话框的General标签下。所以，点击general标签，则显示以下对话框：
在该对话框的中下部你可以看到有一项是Background Sound，在该项目下面的location框中你可以键入你所要加入的声音文件所在的路径和文件名。你也可以点击右边的Browse键在弹出的对话框中选择文件所在的路径和文件名。在loop选单中你可以设定背景声音文件循环播放的次数，如果你选中loop右边的Forever选框，则你所设定的背景声音将一直循环播放，直到你转到别的网页或网站浏览时为止。
一日学会做主页
（本文适合所有还不会做主页的人阅读）
很多人问我：怎么学做主页啊？我说做主页一天就可以了。其实学做主页一点都不难，关键是去做，去做就会了。
要学主页，分三步走就行了，请看下图第二行（可直接点击每个阶段的文字）：
首先找一个网页编辑器，例如DreamWaver或者Frontpage，然后就可以制作主页了，制作主页无非是添加文字、添加图片、添加链接，跟用word没什么区别（详细可以看这里），倒腾一番后，其实你已经开始会制作主页了！第三步，就是用一个FTP软件，把你的主页传上去（请看如何上传主页）就完了！原来就那么容易！
假如你要提高基本功的话，可以学习HTML基础知识，假如想网页漂亮点的话，可以学习图片制作，这样你就会一步一步提高了。
当然你看到上面的主页只是非常简单， 但是这是你的第一步，也是良好的开端，然后再一步步学习：如何把网页制作漂亮一些？如何制作动画？对于新手，千万不要一下子就想：我看到某某某网页这么漂亮，它是怎样做出来的？我很想马上做出来，于是马上就去研究复杂的网页，这样你会发现网页制作很难（尤其是对于女性），学两下就放弃了，这样永远学不会制作主页。想当初，我对于我的网页能产生链接也高兴了半天，于是产生了更大的兴趣。记住：一步一步来，不要一下子想成为高手，否则很难成为高手。
|
|
|
