网页制作实验报告 2.docx

网页制作实验报告 2.docx

《网页制作实验报告 2.docx》由会员分享，可在线阅读，更多相关《网页制作实验报告 2.docx（22页珍藏版）》请在冰点文库上搜索。

网页制作实验报告2

《网页设计与制作》

实验报告

院系名称：

管理学院专业班级：

电子商务11级3班

学生姓名：

许世谦学号：

201117050308

项目

实验一

（25分）

实验二

（35分）

实验三

（40分）

总分

（100分）

得分

2013年6月4日

实验一：

HTML语言实验

一、实验目的

1、掌握利用HTML语言编写网页的能力；

2、掌握利用HTML语言编写表格的能力；

3、掌握利用HTML语言编写表单的能力。

二、实验课时

2学时

三、实验内容

1、表格实验的结果

试验1.1

A

B

C

D

E

F

G

H

I

2、表单实验的结果

试验1.2

姓名：

密码：

性别：

女

男

爱好：

篮球

足球

乒乓球

籍贯：

开封郑州洛阳

四、实验小结

通过这次试验，我掌握了许许多多以前不知道的代码细节，让我对网页设计与制作有了更深层次的了解，同时我对编写代码也渐渐的熟悉了。

刚开始编写的时候有点漫无目的，但是慢慢的就找到了感觉，最高兴的是最后当自己的代码在网页中显示出来的时候，自己的努力是值得的，越来越喜欢网页制作了！

实验二：

FireWorks和CSS实验

一、实验目的

1、掌握为给定效果图规划切图方式的能力；

2、掌握利用FireWorks切图的能力；

3、掌握利用CSS+DIV制作网页的能力。

二、实验课时

2课时

三、实验内容

1、规划切图方式的思路

首先，将网页的布局了解清楚，然后，根据不同的模块分类，导航条分为一类，其余的各归各类，之后利用FireWorks切图。

2、利用FireWorks切图的步骤

运用FireWorks将图片切为自己所需要的部分和比例，如图所示：

3、CSS+DIV制作网页的结果

body{}

.top{margin:

0pxauto;border:

0px;text-align:

center;}

.topmain{margin:

0pxauto;width:

940px;height:

25px;padding:

0px;text-align:

cente;}

.topmainul{margin:

0px;padding:

0px;list-style-type:

none;text-align:

center;}

.topmainulli{width:

72px;float:

left;height:

25px;text-align:

center;}

.topmainullia{width:

72px;height:

25px;text-align:

center;}

.content1{margin:

0pxauto;border:

0px;text-align:

center;}

.content2{margin:

0pxauto;border:

0px;text-align:

left;position:

absolute;left:

168px;top:

352px;width:

301px;height:

533px}

.content3{margin:

0pxauto;border:

0px;text-align:

left;position:

absolute;left:

468px;top:

352px;width:

465px;height:

533px}

.content4{margin:

0pxauto;border:

0px;text-align:

left;position:

absolute;left:

933px;top:

352px;width:

211px;height:

529px;}

.bottom{margin:

0pxauto;border:

0px;position:

absolute;left:

168px;top:

885px;width:

977px;height:

105px;text-align:

center;}