初中九年级信息技术制作快乐小朋友网页

制作“快乐小朋友”网页一个网站一般由许多个页面组成，其中被浏览者首先访问的页面被称为主页，它相当于网站的大门，所以，主业的设计最好能够简洁、美观，能够体现网站的整体风格和作者的审美情趣。主页设计的好坏直接关系到网站的访问流量。本节从制作如图所示的“快乐小朋友”网页开始，学习制作简单网页的知识。制作本页的方法是在网页的适当位置插入图片、文字、列表、动画等元素，并且把它们有机地整合到一起，使之看起来美观、大方。一、定义本地站点在开始制作之前，应该首先定义一个本地的站点。作为一个网站，里面有很多网页文件、图片，甚至Flash动画等，如果不进行管理归档，使它们分散在硬盘的各个地方，日后就无法方便地进行网页发布。做一做在计算机上建立个人网页的站点。操作步骤第一步：选择“站点”→“新建站点”菜单命令，弹出如图所示的“站点定义”对话框。第二步：在“站点名称”框中输入网站的名称，在“本地根文件夹”中输入用于存放网站内容的文件夹位置，单击“确定”按钮，弹出如图所示的提示对话框。第三步：单击“确定”按钮，右边面板组中弹出如图所示的“站点”管理窗口，这个程序可以用来对站点进行管理。第四步：移动鼠标到“本地根文件夹”窗口，单击右键，通过弹出的快捷菜单在站点文件夹中新建如图所示的若干文件夹，用于存放制作网页所需要的素材文件，最后关闭这个窗口，这样就完成了“快乐小朋友”站点的创建。合理的站点结构能够加快对站点的设计，提高工作效率，节省时间。如果你将一切网页都存放在一个文件夹下面，则当站点的规模越来越大时，管理起来就会变得很不容易。一般来说，应该在站点的根文件夹中创建不同的文件夹，用来合理地存放网站中的各种分类文档。如“F:\MyDocuments\MyWebs\”是本网站的根文件夹，你可以在“MyWebs”中再创建images、txt、swf、gif等文件夹用于存放网站所需要的图片、文本、动画等文件。说明合理使用文件名也可以有利于日后管理网站，文件名应该容易理解，让人看了就能够知道网页表达的内容。但是应该避免使用中文名称，因为很多Internet服务器不能够很好地支持中文文件夹。网站中的文件名最好都使用小写字母，因为有些服务器对大小写字母是敏感的，例如它会认为index.html和index.HTML是完全不同的两个文件。二、添加网页文字在网页中插入正文内容。做一做操作步骤第一步：将光标移到文档窗口的适当位置，输入文字“快乐小朋友”作为网页的标题。第二步：按Enter键，使光标移到下一段中，输入如图所示的一些主页说明文字。第三步：移动光标到第1段文字中，单击“属性”面板中的“居中”按钮，使标题文字居中对齐。第四步：选中标题文字，打开“属性”面板中的“大小”下拉列表框，选择字号为6，设置文字颜色为森绿色，将文字加粗并且居中放置，如图所示。第五步：移动光标到第2段文字开始处，选择输入法为全角方式，在段首插入两个全角的空格。第六步：用同样的方法设置第2段文字为绿色、4号字，如图所示。第七步：选择“文件”→“保存”菜单命令，弹出如图所示的“保存为”对话框，在“文件名”中输入index，在“保存类型”下拉列表框中选择“HTML文档”选项，单击“保存”按钮即可。在文档窗口中编辑文字的方法与FrongPage十分类似，只是对文字的属性设置要通过“属性”面板来实现。

Dreamweaver中不能够直接在段落前插入半角的空格符号。如果要使段首文字缩进，可以插入全角的空格符号。网页中的文字应该选择常用的字体，否则，如果访问者的计算机中没有这种字体，就不能够正确显示网页的实际效果。一般情况下网站主页的文件名都是index.htm。说明一个页面只有文本是枯燥而无法吸引人的，下面我们插入一幅图片，使页面图文并茂，显得更加生动。三、插入图片做一做给网页插入图片。第一步：将光标定位在正文欲插入图像的位置段落中，单击“插入”面板中的“插入图像”按钮，弹出如图所示的“选择图像源”对话框。操作步骤第二步：在对话框中打开存放图片的文件夹images，再选定将要被插入的图片文件，单击“选择”按钮，图片就要被插入到网页中，如图所示。第三步：选中图片，打开在“属性”面板中的“对齐”下拉列表框，选择“右对齐”；设置“属性”面板中的“垂直边距”和“水平边距”分别为5和10，如图所示。第四步：在“属性”面板中的“替代”栏中输入文字“网中图片”，最后的效果如图所示。网页中将会用到许多图片，可以用Photoshop、Fireworks等图像处理工具事先把需要的图片进行加工，并将图片存放在images文件夹下。为提高主页下载速度，制作的图片不能过大，一般控制在60KB以内。可以插入到网页上的图片格式只有3种，即GIF、JPG和PNG，所以如果图片是BMP、TIF等其他格式，就需要经过转换才可以在网页中使用。说明设置图片“替代”属性的作用是告诉用户提供图片的名称，因为在用户的浏览器中不能显示图形时，这个图片的位置会出现所加的“替代”属性（图中图片的“替代”属性为“小屋图片”）；如果浏览器支持图片，则将鼠标停在这个图片上一小会儿，也会出现这行说明文字。当页面中插入一张图片时，图像是不具有任何名称的，这时可以在图片的“属性”面板中输入一个图片名称，这个名称将用于JavaScript以及其他的应用程序对页面中的图片进行调用。四、标题和页边距设置再看一下我们做好的页面，页面还没有标题，背景也显得单调，下面我们就来添加标题和背景图片。做一做给网页添加标题和背景图片。第一步：选择“修改”→“页面属性”菜单命令，弹出如图所示的“页面属性”对话框。操作步骤第二步：在“标题”框中输入文字“欢迎进入快乐小朋友网”，单击“背景图像”右边的“浏览”按钮，在弹出的“选择图像源”对话框中选择将要作为背景图片的图像文件，单击“选择”按钮。第三步：设置“左边界”值为10、“顶部边界”值为20，单击“确定”按钮。按F12键，预览网页效果，如图所示。第一，网页的标题与网页内容的标题是不同的。访问者浏览该网页时，网页标题会显示在浏览器的标题栏中，而网页内容的标题一般放置在页面的上部，并且使用显著的字体和字号，它就好像一个文章的题目。第二，网页的标题也可以在文档窗口中的“标题”框中直接修改。说明第三，