一. 两个网站,一个是孙悟空,一个是HTML,交到作
业管理系统,也就是110
二.一个自拟网页,一份实验报告,自拟网页以附件上传至111,实验报告写在111的总结上面。实验报告为用FrontPage制作网页进行小结,并对思考题的命题进行简要的论述(字数500-800)。
一. 思考题
一. 如何管理网站文件?
二. 如何规划和设计较复杂的主页?
制作网站需要哪几个阶段?
各阶段应完成的基本任务是什么?
实习一 网页设计(1)
一、实习目的
1. 了解HTML文档结构;
2. 初步掌握基本标记的使用;
3. 能够运用文本编辑器制作简单网页。
二、实习内容
1. 学习EditPlus文本编辑器的使用。
2. 使用EditPlus制作只有一行文字的网页,了解HTML文档结构,并在IE浏览器中打开编写的网页文件,查看运行效果; 3. 在网页中添加多段文本内容,并对页面格式进行设置排版,制作一个简单文字内容的
网页;
4. 在网页中添加图片,并对页面格式进行设置排版,制作一个简单图文内容的网页; 5. 制作一个索引网页,建立与前面网页之间的超连接; 6. 制作一个简单的个人主页。
三、预备知识
1. 网页的基本组成;
2. HTML语言:常用HTML标记及其属性; 标记 Html Body P br H1~h6 Hr Font img a
作用
网页文件标记 页面标记 段落标记 换行标记 标题标记 水平线标记 字体标记 图像标记 超链接标记
常用属性
bgcolor,background,text align align
size,width,color size,face,color
Src,height,width,alt,align Href
3. 网页制作方法。
四、实习步骤
1.学习EditPlus文本编辑器的使用
打开EditPlus显示如图1-1界面,通过“文件”→“新建”→“html网页”新建一个页面,如图1-2所示。
在代码区中最外层是html标记,html标记中包含了head标记和body标记,实习中我们只改head标记中内嵌的title标记中的文本,制作页面的内容通过相关标记在body中标记。
在工具栏中分两行,第一行是编辑器的工具栏,第二行是快捷插入标记的工具栏。
现在鼠标分别停留在第二行的工具上,注意提示并记录,以备后用; 特别强调颜色工具只是直观输入颜色编码(用在给颜色相关属性赋值中)。
图1-1 editplus界面
图1-2 新建html 网页界面
2.使用EditPlus制作一行文字的网页 ? ?
使用EditPlus新建一个空白网页,观察网页的基本结构,了解基本结构所用标记的作用,保存文件,在IE浏览器中查看网页运行效果。
将
3. 制作一个简单文字内容的网页
① 新建一个空白网页; ② 添加适量文字;
③ 利用HTML文字标记进行版面编排,要求: ? ? ? ?
使用标题;使用h1-h6标记 分段(p标记)、分行(br标记)、段落对齐方式(在p标记中设置align属性); 设置字体(font标记中设置size,face,color属性),设置字型(b,I,u标记); 插入水平线(hr标记)等。
④ 保存文件(文件名为1.htm);
⑤ 在IE浏览器中查看网页运行效果;
⑥ 重复③的过程,更改标记属性,观察运行效果。 4. 制作一个简单图文内容的网页
① 新建一个空白网页,在网页中添加适量文字,利用HTML文字标记进行版面编排; ② 运用HTML标记插入图片(img标记),设置图片的属性(修改img标记的Src,height,width,alt,align属性),进行图文混排; ③ 保存文件(文件名为2.htm),查看网页运行效果。 5.建立超连接
① 新建一个空白网页,在网页中添加三个超链接,分别链接到前面制作的网页(1.htm和2.htm)上,保存文件,查看网页运行效果,进行链接测试。
② 在网页中建立其它网站的超链接,分别链接到“西北农林科技大学”主页
(http://www.nwsuaf.edu.cn),“新浪网”主页(http://www.sina.com.cn),查看网页运行效果,进行链接测试。 6.制作一个简单的网页
制作一个网页,要求:字体属性设置、段落(行)设置、插入图片并进行属性设置、超链接设置等内容,尽量作到页面美观、内容充实。
五、实习要求
1. 独立完成实习内容;
2. 保存制作的网页(包括图片文件),提示应建1个文件夹,将有关文件存到这个文件夹中; 3. 同学间进行测试(通过文件拷贝方式到其他同学的计算机上); 4. 提交测试通过的网页文件(压缩包)到作业系统。

