静态设计页面的制作-课程设计.docVIP

PAGE

存档资料成绩：

华东交通大学理工学院

课程设计报告书

所属课程名称网页设计与网页制作

题目静态设计页面的制作

分院电信分院

专业班级信管2班

学号20120210450221

学生姓名 熊武

指导教师魏建红

2014年12月29日

华东交通大学理工学院课程设计报告

PAGE29

第页共NUMPAGES29页

序号

项目

等级

优秀

良好

中等

及格

不及格

1

课程设计态度评价

2

出勤情况评价

3

任务难度评价

4

工作量饱满评价

5

任务难度评价

6

设计中创新性评价

7

论文书写规范化评价

8

综合应用能力评价

综合评定等级

课程设计（论文）评阅意见

评阅人职称

2014年12月

目录

TOC\o"1-1"\h\z\u第一章课程设计内容及要求 4

第二章课程设计目的及流程 5

第三章课程设计方法及步骤 6

第四章课程设计的部分代码及截图 10

第五章课程设计心得 27

第六章参考文献 28

第一章课程设计内容及要求

一.课程设计题目

用已经学过的网站开发技术及开发工具DW，根据网站首页效果图，利用DIV+CSS设计出一个《网站首页》。

二.课程设计内容及要求

内容有：1．建立站点；2．结构分析；3．搭建框架；4．切割效果图；5．布局页面——头部和导航；6．布局页面——侧边栏；7．布局页面——主体部分；8．底部和细节调整

要求有：运用DIV+CSS设计出一个静态页面，做到简洁，清晰，明了。

第二章课程设计目的及流程

一.课程设计目的：

1.通过课设的制作，来加深同学对网页设计的认识和制做。同时也加强了对同学的实际操作能力。

2.要尊重浏览者体验，网站不是做给自己看的。

一.课程设计流程：

确定主题搭建版式风格画好框架DW把div框架搭建具体内容的添加

第三章课程设计方法及步骤

确定主题

搭建版式风格

画好框架

DW把div框架搭建

具体内容的添加

一.课程设计方法：

1.建立站点

打开DW，建立名为website站点

2.结构分析

头部

LOGO

导航栏

内容框

左边部分内容

上面部分

下面部分

右边部分内容

中间部分

下面部分

尾部

3.搭建框架

4.切割效果图

5.布局页面——头部和导航

6.布局页面——侧边栏

7.布局页面——主体部分

8.底部和细节调整

第四章课程设计的部分代码及截图

1、html代码

头部和导航栏

<divid="head">

<divid="head_contend">

<divid="first">足球天下</div>

<divid="index">首页</div>

<divid="admin">登陆</div>

</div>

</div>

<divid="body">

<divid="logo">

<h1>绿茵场</h1>

</div>

<divid="rad">

<ulclass="rad">

<li><ahref="#">首页</a></li>

<li><ahref="#">联赛</a></li>

<li><ahref="#">直播</a></li>

<li><ahref="#">欧洲</a></li>

<li><ahref="#">南美</a></li>

<li><ahref="#">亚洲</a></li>

</ul>

</div>

侧边