本章学习后,每个人要制作一个个人网页(站),由主页和几个网页组成。整个制作由每节课作业逐步完成。
7.1制作网页(自我介绍)
学习目标
掌握制作网页的基础知识,学会在网页中插入文字、图像、表格。
HTML语言简介
网页文件是一个HTML(HyperTextMarkupLanguage超文本标记语言,由WWW(WorldWideWeb环球信息网)的创始人蒂姆发明的。)语言规则编写的纯文本文件,一般以htm或html作为文件的扩展名。我们看到的网页是浏览器对HTML文件进行逐条解释、显示的结果,网页中除了文字保存在HTML文件中外,其它对象(声音、图像、动画等)只保存相应的标识和有关参数。
在用IE浏览网页时,可以选择“查看”菜单中“源文件”选项,该网页的HTML文件就会显示在记事本中。
例:HTML文件格式
<html>文件开头
<head>
<title>使用说明</title>title后是文章的标题
</head>
<body>body表示以下为正文
<Ahref=”http://tsinghua.edu.cn”>清华大学主页</A>
表示在“清华大学主页”嵌入链接,在网页中单击“清华大学主页”几个字,就可跳转到清华大学的主页
</body>正文结束
</html>文件结束
今天可以通过“所见即所得”的网页编辑器,就可轻松地制出漂亮的网页。
FrontPage:
·单击“开始”→“程序”→“MicrosoftFrontPage”打开“FrontPage”窗口;
·单击菜单“文件”→“新建”→“站点”,选择“只有一个网页的站点”
1.网页中使用表格
在制作网页时,一般先利用表格,在表格中套表格的方式,对网页进行整体规划,然后在表格的单元格内插入各种元素(文字、图像、图表等),使整个网页规划清楚。
·单击“常用”工具栏的“插入表格”按钮→选择表格行数、列数,单击
·表格的编辑和Word中的表格基本相同。
·单击“表格”→“属性”,将表格的边框粗细设置为0,浏览时就看不到表格的痕迹。
2.制作网页标题
·换行:使用回车键换行,行距较大,使用普通换行符换行,行距为0。普通换行符:“插入”→“换行符”→“普通换行符”→确定
·行距:选定→“格式”→“段落”,在对话框中可调整“段落间距”和“行距大小”
·字符间距:选定→“格式”→“字体”→“字符间距”→调整“间距大小”
3.网页添加图片
网页中使用图像时需考虑下载速度和图像颜色两个方面的问题。网页中使用的图像的文件格式一般为压缩过的GIF(最多256颜色,一般无特别需求时使用)、JPEG(16兆颜色)、PNG等图像。
在FrontPage中可以随意调整图像大小,但它的字节数不变,如果需要的图像尺寸与原图像大小相差很大,用Photoshop等将它缩小或增大,可以在保持图像质量的同时减少字节数。
·添加图片:单击“常用工具栏”的“插入文件在的图片”按钮
或单击“插入”→“图片”→“剪切画/来自文件”
·打开图片工具栏:单击“查看”→“工具栏”→“图片”
“文本”按钮:在图像中加入文本(操作的图像必须是GIF格式);如果不是,自动把它转换成GIF格式。
“自动缩略图”按钮:将选中的图像生成一个图像的缩略图,并在缩略图中建立一个链接到该图像的超链接,单击它,可看到原图。
除去自动缩略图的边框:右击图片→图片属性→外观→边框粗细→为0
·在网页中加入背景图片:单击“格式”→“背景”→在“网页属性”对话框→“浏览”,选定背景图片→确定。
·在单元格中加入背景图片:单击“表格”→“选定”→“单元格”,单击“表格”→“属性”→“单元格”→在“单元格属性”对话框选择“背景”→“浏览”,选定背景图片→确定。
注意:保存包含图像的网页:不仅要将网页作为一个文件保存,而且要将图像文件单独保存起来。
作业:制作个人网页:主页第7章创建网上家园这一教案