南阳理工学院
静态网页设计实验指导书静态网页设计实验指导书
（2011版）
软件学院数据库教研室
20119
f目录
实验一实验二实验三实验四实验五实验六实验七实验八实验九实验十网页和各种标签……………………1熟悉HTML网页和各种标签网页表格和表单的制作…………………………3熟悉CSS基本结构………………………………5CSS背景样式控制………………………………7CSS字体和文本样式设置……………………9使用（熟悉DREAMWEAVER使用（一）…………10使用（熟悉DREAMWEAVER使用（二）…………14JAVASCRIPT基本语法基本语法………………………16JAVASCRIPT函数……………………………17JAVASCRIPT对象对象……………………………19
f静态网页设计实验指导书软件学院数据库教研室［2011版］
网页和各种标签实验一熟悉HTML网页和各种标签1、实验目的、
1、掌握HTML文档的基本结构、标记和标记属性的概念及作用2、学会使用文本编辑软件建立和编辑HTML文档的方法3、能够使用标记在网页中插入和编辑基本的网页元素4、学会使用超级链接的方法
2、实验内容及步骤、
1、建立一个空的HTML文件（1）在机器上建立自己的文件夹；（2）进入文件夹内，单击鼠标右键，建立一个文本文档；（3）在文档中输入HTML的基本标签，构建HTML文档的基本结构；（4）保存文本文档，为文档命名，并将文档的扩展名修改为html或htm；2、修改HTML文件的标题（1）用记事本程序打开HTML文件，在title标签中输入HTML文件的标题；（2）保存；3、为HTML文件添加主体内容（1）用记事本程序打开HTML文件，在body标签中输入HTML文件的主体内容；（2）保存；4、对HTML文件的主体部分进行相应的排版（1）使用标题标签设置文档的标题，并利用标题标签的alig
属性使标题居中显示；（2）使用段落标签为文档设置段落，并利用段落标签的alig
属性设置段落的对齐方式；（3）在文档中使用换行标签；（4）利用水平分割线标签，在文档中添加水平分割线；（5）使用字体样式标签设置文档的字体，并利用字体样式标签的face、size、color属性修改文档的字体、字号、颜色；5、无序列表和有序列表的使用（1）在网页中插入一个无序列表，将无序列表的type属性值设为”square”，效果如图1所示：
1
f静态网页设计实验指导书软件学院数据库教研室［2011版］
图1
（2）在网页中插入一个有序列表，将有序列表的type属性值设为”a”，效果如图2所示：
图2
6、利用img标签，为HTML文r