html表单上机指导,HTMLCSS上机实验指导书网页设计实验指导.pdf

南阳理工学院

HTML+CSS上机实验指导书

(2011 版)

软件学院· .NET 教研室

2011.8

1

目 录

实验一 熟悉 HTML 网页如何手工制作 3

实验二 熟悉 HTML 网页和各种标签 3

实验三 熟悉使用 DREAMWEAVER制作 HTML 网页的方法 4

实验四 列表标签和超链接标签 4

实验五 网页表格的制作 5

实验六 网页表单的制作 5

实验七 熟悉 CSS基本结构一 6

实验八 熟悉 CSS基本结构二 6

实验九 熟悉 CSS基本结构三 7

实验十 熟悉 CSS基本结构三 7

实验十一 熟悉 DREAMWEAVER使用(一) 8

实验十二 熟悉 DREAMWEAVER使用(二) 9

2

实验一 熟悉 HTML 网页如何手工制作

【实验目的】

熟悉 HTML 的基本结构和常用标记，使用记事本编写网页文件。

【实验内容】

建立一个简单的 HTML 文件，并输入相应的内容，要求使用相应标签对网

页内容进行排版。 排版中涉及到的标签包括： 标题标签、字体标签、 分段标签等。

【实验步骤】

1、打开记事本程序，编写网页的基本结构

2、对网页进行编辑，输入文本内容，并用相应的标签对文本内容进行排版设置

3、将文件保存为 *. Html

4 、用浏览器打开所保存的网页文件，在浏览器中显示效果

5、根据结果重新调整原代码

6、重复步骤 4，步骤 5

实验二 熟悉 HTML 网页和各种标签

【实验目的】

熟悉 HTML 的基本结构和常用标记，使用记事本编写网页文件。

【实验内容】

建立一个简单的 HTML 文件，并输入相应的内容，要求使用相应标签对网

页内容进行排版。

进一步， 向网页中加入图片， 使用相应标签对网页进行美化。 网页美化中涉

及到的标签包括：图像标签、超链接标签等。

【实验步骤】

1、打开记事本程序，编写网页的基本结构

2、对网页进行编辑，输入文本内容，并用相应的标签对文本内容进行排版设置

3、将文件保存为 *. Html

4 、用浏览器打开所保存的网页文件，在浏览器中显示效果

5、根据结果重新调整原代码

6、向网页中加入图片，利用相应标签对图片进行设置，达到美化网页效果

7、重复步骤 4，步骤 5

3

实 验 三 熟 悉 使 用 Dreamweaver 制 作

HTML 网页的方法

【实验目的】

熟悉使用 Dreamweaver制作 HTML 网页的方法

【实验内容】

使用 Dreamweaver建立一个站点，然后建立简单的 HTML 文件，并输入相

应的内容， 要求使用相应标签对网页内容进行排