网页课程设计报告

————————————————

网页制作课程设计

班级: BO41101

学号: BO4110110

姓名: 程加达

设计时间： 20##年11

指导教师： 孙娜

目录

一. 课程设计目的. 2

1.1 设计要求. 3

1.2 设计思路. 3

二.实训设计报告内容. 4

2.1 设计方案. 4

2.2 设计过程. 4

2.3 设计结果. 32

三．结论与心得. 32

一.课程设计目的

本次课程是运用网页制作的知识，在掌握理论的基础上再加以实践，进一步提高，根据我们自己的兴趣，设计一个静态网站，围绕一个主题体现出自己的个性，可以达到全面理解、运用网页制作的知识，并使之得以融会贯通，在掌握运用Dreamweaver制作网页的基础上再加以实践，进一步提高、加强自身的综合能力。

在制作这一网页前第一要做的就是要准备网页素材，然后制作主页，再通过主页扩展主分页再又通过主分页扩展出子分页。动态网页的制作是通过静态网页主页链接出来的这样就可以显示出该网页的美观，功能总的来说，希望通过此次课程设计，能够将网页制作的课程理论与实践联合起来，通过我们以自己搜索书籍，网站等方式来收集文字资料，图像资料及页面效果等。从而来培养自己独立动手的工作能力。

1.1 设计要求

1网站题材选择

内容，题材不限，可以选择你所感兴趣的内容和专题，内容充实、健康。网站标题自拟。

2网站技术要求

页面布局合理，色彩和谐，链接正确，图文并茂。

1.2 设计思路

二.实训设计报告内容

2.1 设计方案

主页用表格布局，以NBA5个具有代表性的球队为背景，突出主题，在主页中放置了5个球队的图片、超链接、一个登陆框、日志列表。先是主页然后是通过主页内容链接到各个分主页，最后通过分主页内容链接到到分页。从而层层深化使网页结构清楚，内容更丰富。格调统一，色彩搭配协调。

2.2 设计过程

1、建立站点，规划主页

图1

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>NBA-首页</title>

<style type="text/css">

<!--

body {

background-color: #F00;

}

.A-sty {

}

.A-sty {

color: #000;

}

.A-sty {

font-size: 36px;

}

.A-sty .A-sty {

}

.A-sty {

text-align: center;

}

.B-sty {

font-size: 12px;

color: #0F0;

text-align: center;

}

.sty- {

font-weight: bold;

text-align: center;

}

-->

</style></head>

<body>

<p><img src="images/nbalogo.jpg" width="65" height="113" /> <span class="A-sty"><span class="A-sty">NBA资料站</span>

</span></p>

<hr />

<p><img src="images/湖人.jpg" width="220" height="136" />湖人队于1948年加盟<a href="/view/582.htm" target="_blank">NBA</a>，原来属于<a href="/view/52636.htm" target="_blank">明尼阿波利斯</a>，于1960年搬迁到了<a href="/view/7731.htm" target="_blank">洛杉矶</a>。洛杉矶湖人队是NBA历史上为数不多的常青树之一，该队的夺冠次数仅次于<a href="/view/1264603.htm" target="_blank">凯尔特人队</a>，共获得16次总冠军，打造了数个“湖人王朝”。湖人队的最大特点是总有超级<a href="/view/151790.htm" target="_blank">中锋</a>跟他们联系在一起，<a href="/view/61654.htm" target="_blank">乔治·迈肯</a>、<a href="/view/28376.htm" target="_blank">威尔特·张伯伦</a>、<a href="/view/79308.htm" target="_blank">贾巴尔</a>、<a href="/view/83849.htm" target="_blank">比尔·沃顿</a>、<a href="/view/20133.htm" target="_blank">奥尼尔</a>，现在是<a href="/view/403982.htm" target="_blank">德怀特·霍华德</a>了。20##年6月18日，湖人在抢七生死战中以83-79击败<a href="/view/38089.htm" target="_blank">波士顿凯尔特人</a>，以4-3的总比分夺得09-10赛季NBA总冠军，实现了联盟历史上自21世纪初湖人三连冠以来的首次卫冕。 </p>

<p> </p>

<p><a href="index.html">返回首页</a></p>

<hr />

<p> </p>

</body>

</html>

图2

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>NBA-首页</title>

<style type="text/css">

<!--

body {

background-color: #F00;

}

.A-sty {

}

.A-sty {

color: #000;

}

.A-sty {

font-size: 36px;

}

.A-sty .A-sty {

}

.A-sty {

text-align: center;

}

.B-sty {

font-size: 12px;

color: #0F0;

text-align: center;

}

.sty- {

font-weight: bold;

text-align: center;

}

-->

</style></head>

<body>

<p><img src="images/nbalogo.jpg" width="65" height="113" /> <span class="A-sty"><span class="A-sty">NBA资料站</span>

</span></p>

<hr />

<p><img src="images/凯尔特人.jpg" width="198" height="220" />凯尔特人队是<a href="/view/582.htm" target="_blank">NBA</a>历史上的一支强队，有着优秀的球队传统和鲜明的球队特色。球队获得过的17次总冠军位居NBA球队之冠。曾在1957年到1969年的13年间11夺总冠军，在1959年至1966年连夺8次冠军。 </p>

<div></div>

　　北京时间20##年6月18日，凯尔特人在主场以131-92大胜湖人，以4-2的大比分夺得球队历史上第17个总冠军。这是凯尔特人自1986年以来首次夺得总冠军，22年之后，他们终于重回巅峰。

<div></div>

<p>在此赛季之前，球队刚刚从超音速队（现雷霆队）、森林狼队挖来了<a href="/view/20326.htm" target="_blank">雷·阿伦</a>和<a href="/view/54892.htm" target="_blank">凯文·加内特</a>，与<a href="/view/241530.htm" target="_blank">保罗·皮尔斯</a>组成三巨头，这个冠军意义非凡。

</p>

<p> </p>

<p><a href="index.html">返回首页</a></p>

<hr />

<p class="B-sty">制作人：B04110110 程加达</p>

<p> </p>

</body>

</html>

图3

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>NBA-首页</title>

<style type="text/css">

<!--

body {

background-color: #F00;

}

.A-sty {

}

.A-sty {

color: #000;

}

.A-sty {

font-size: 36px;

}

.A-sty .A-sty {

}

.A-sty {

text-align: center;

}

.B-sty {

font-size: 12px;

color: #0F0;

text-align: center;

}

.sty- {

font-weight: bold;

text-align: center;

}

-->

</style></head>

<body>

<p><img src="images/nbalogo.jpg" width="65" height="113" /> <span class="A-sty"><span class="A-sty">NBA资料站</span>

</span></p>

<hr />

<p> </p>

<p><a href="index.html">返回首页</a></p>

<hr />

<p class="B-sty">制作人：B04110110 程加达</p>

<p> </p>

</body>

</html>

图4

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>NBA-首页</title>

<style type="text/css">

<!--

body {

background-color: #F00;

}

.A-sty {

}

.A-sty {

color: #000;

}

.A-sty {

font-size: 36px;

}

.A-sty .A-sty {

}

.A-sty {

text-align: center;

}

.B-sty {

font-size: 12px;

color: #0F0;

text-align: center;

}

.sty- {

font-weight: bold;

text-align: center;

}

-->

</style></head>

<body>

<p><img src="images/nbalogo.jpg" width="65" height="113" /> <span class="A-sty"><span class="A-sty">NBA资料站</span>

</span></p>

<hr />

<p><img src="images/火箭.jpg" width="220" height="117" />火箭队是一支有高中锋传统的球队，从早期的<a href="/view/163634.htm" target="_blank">摩西·马龙</a>（Moses Malone）、拉尔夫-桑普森到<a href="/view/6009.htm" target="_blank">奥拉朱旺</a>（Hakeem Olajuwon），以及20##年首轮选中的中国中锋<a href="/view/2271.htm" target="_blank">姚明</a>。1967火箭队年加入NBA，当时落户于<a href="/view/55541.htm" target="_blank">圣地亚哥</a>，经历了4个平淡的赛季后，于1971年搬到<a href="/view/36093.htm" target="_blank">休斯敦</a>。 </p>

<p> </p>

<p><a href="index.html">返回首页</a></p>

<div id="album-links-19065"></div>

<hr />

<p class="B-sty">制作人：B04110110 程加达</p>

<p> </p>

</body>

</html>

图5

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>NBA-首页</title>

<style type="text/css">

<!--

body {

background-color: #F00;

}

.A-sty {

}

.A-sty {

color: #000;

}

.A-sty {

font-size: 36px;

}

.A-sty .A-sty {

}

.A-sty {

text-align: center;

}

.B-sty {

font-size: 12px;

color: #0F0;

text-align: center;

}

.sty- {

font-weight: bold;

text-align: center;

}

-->

</style></head>

<body>

<p><img src="images/nbalogo.jpg" width="65" height="113" /> <span class="A-sty"><span class="A-sty">NBA资料站</span>

</span></p>

<hr />

<p><img src="images/雷霆.jpg" width="220" height="202" />20##年9月3日早晨，随着俄克拉荷马的原超音速队召开新闻发布会，宣布了自己的新队名——雷霆。NBA最新的一支球队终于诞生，也代表着“<a href="/view/204115.htm" target="_blank">西雅图超音速队</a>”的告别。20##-10赛季，球队在核心新科得分王<a href="/view/920482.htm" target="_blank">凯文·杜兰特</a>和<a href="/view/1700555.htm" target="_blank">拉塞尔·威斯布鲁克</a>的带领下闯入<a href="/view/23331.htm" target="_blank">季后赛</a>并在与卫冕冠军<a href="/view/21039.htm" target="_blank">洛杉矶湖人队</a>的系列赛中表现出色，虽败犹荣。</p>

<p> </p>

<p><a href="index.html">返回首页</a></p>

<hr />

<p class="B-sty">制作人：B04110110 程加达</p>

<p> </p>

</body>

</html>

点击NBA进入资料

2制作各个分页

这是对自己的一个简单介绍

迈阿密热火队，于1988年成立并加入NBA，在最初的7个赛季，尽管热火拥有格伦·莱斯这样的超级得分手，但常规赛战绩从未超过50胜，期间只有两个赛季进入季后赛。1995年帕特·莱利成为热火总裁兼主教练，他先后招入阿朗佐·莫宁和蒂姆·哈达威两位全明星球员，并以他们两人为核心打造了一支作风顽强的铁血之师。20##-06赛季，热火队重金引入沙奎尔·奥尼尔、加里·佩顿、安东尼·沃克等球星，在德文·韦德的率领下夺得总冠军。20##年7月9日，勒布朗·詹姆斯和克里斯·波什加盟迈阿密热火，联手德文·韦德一同冲击总冠军。

返回首页

图6

凯尔特人队是NBA历史上的一支强队，有着优秀的球队传统和鲜明的球队特色。球队获得过的17次总冠军位居NBA球队之冠。曾在1957年到1969年的13年间11夺总冠军，在1959年至1966年连夺8次冠军。

在此赛季之前，球队刚刚从超音速队（现雷霆队）、森林狼队挖来了雷·阿伦和凯文·加内特，与保罗·皮尔斯组成三巨头，这个冠军意义非凡。

返回首页

图7

湖人队于1948年加盟NBA，原来属于明尼阿波利斯，于1960年搬迁到了洛杉矶。洛杉矶湖人队是NBA历史上为数不多的常青树之一，该队的夺冠次数仅次于凯尔特人队，共获得16次总冠军，打造了数个“湖人王朝”。湖人队的最大特点是总有超级中锋跟他们联系在一起，乔治·迈肯、威尔特·张伯伦、贾巴尔、比尔·沃顿、奥尼尔，现在是德怀特·霍华德了。20##年6月18日，湖人在抢七生死战中以83-79击败波士顿凯尔特人，以4-3的总比分夺得09-10赛季NBA总冠军，实现了联盟历史上自21世纪初湖人三连冠以来的首次卫冕。

返回首页

图8

火箭队是一支有高中锋传统的球队，从早期的摩西·马龙（Moses Malone）、拉尔夫-桑普森到奥拉朱旺（Hakeem Olajuwon），以及20##年首轮选中的中国中锋姚明。1967火箭队年加入NBA，当时落户于圣地亚哥，经历了4个平淡的赛季后，于1971年搬到休斯敦。

返回首页

图9

20##年9月3日早晨，随着俄克拉荷马的原超音速队召开新闻发布会，宣布了自己的新队名——雷霆。NBA最新的一支球队终于诞生，也代表着“西雅图超音速队”的告别。20##-10赛季，球队在核心新科得分王凯文·杜兰特和拉塞尔·威斯布鲁克的带领下闯入季后赛并在与卫冕冠军洛杉矶湖人队的系列赛中表现出色，虽败犹荣。

返回首页

图10

返回首页

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<bgsound src="images/杨坤 - 空城.mp3"

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>NBA-首页</title>

<style type="text/css">

<!--

body {

background-color: #F00;

}

.A-sty {

}

.A-sty {

color: #000;

}

.A-sty {

font-size: 36px;

}

.A-sty .A-sty {

}

.A-sty {

text-align: center;

}

.B-sty {

font-size: 12px;

color: #0F0;

text-align: center;

}

.sty- {

font-weight: bold;

text-align: center;

}

-->

</style></head>

<body>

<hr />

<p><img src="images/nbalogo.jpg" width="65" height="113" /> <span class="A-sty"><span class="A-sty">NBA资料站</span>

</span></p>

<hr />

<p>著名球队信息：</p>

<table width="794" height="288" border="0" cellpadding="0" cellspacing="0">

<tr>

<td width="159" height="218"><a href="热火.html"><img src="images/热火.jpg" width="159" height="220" border="0" /></a></td>

<td width="159"><a href="凯尔特人.html"><img src="images/凯尔特人.jpg" width="159" height="220" /></a></td>

<td width="159"><a href="湖人.html"><img src="images/湖人.jpg" width="159" height="220" /></a></td>

<td width="159"><a href="火箭.html"><img src="images/火箭.jpg" width="159" height="220" /></a></td>

<td width="158"><a href="雷霆.html"><img src="images/雷霆.jpg" width="159" height="220" /></a></td>

</tr>

<tr>

<td height="70" class="sty-"><a href="热火.html">迈阿密热火队</a></td>

<td class="sty-"><a href="凯尔特人.html">波士顿凯尔特人队</a></td>

<td class="sty-"><a href="湖人.html">洛杉矶湖人队</a></td>

<td class="sty-"><a href="火箭.html">休斯敦火箭队</a></td>

<td class="sty-"><a href="雷霆.html">俄克拉荷马雷霆队</a></td>

</tr>

</table>

<hr />

<p class="B-sty">制作人：B04110110 程加达</p>

<p> </p>

</body>

</html>

2.3 设计结果

网站设计完成，静态网站能够实现主页与分页之间的链接，背景图片、页面链接效果等显示正确。通过打开开场图片选项进入主页，点击主页导航条里的链接能很好的连接到分页面，对每个分页面进行相应的介绍，使得整个网站协调，突出主题。

三．结论与心得

近一周的实训转瞬即逝，在这短暂的时间里，第一个完整版的自制网站圆满完成，同时，也让我们对于网页设计与制作有了进一步的了解。

整个网站设计中，我能把散乱的网页链接成框架体系，使平时学习的知识点由散到整，并且能够合理的在实训中进行实践。在本次实训的过程中，我搜集了大量的素材，也看了很多网页设计技巧方面的材料，增加了知识面，给我以后能够制作出更好的网页打下了基础。最后让我感触最深的是：想要做好一个网站，好的素材和技能是十分重要的。

整个网站设计由静态网站。静态网站组成了整个网站的框架结构，由一个主页面然后链接到其他分页面。在静态网站中，设置了背景图片和背景音乐等一系列效果。增加网站的美观度和色彩协调度。这次网页设计与制作我们是利用Dreamweaver 来完成设计的，在计算机上面操作，这次课程不仅让我们将课本上的理论知识得到了实践，更重要的是让我们知道学习是一个步步渐进的过程，需要认真，细心，努力的去完成。

相关推荐

网页课程设计报告

一.课程设计目的

1.1 设计要求

1.2 设计思路

二.实训设计报告内容

2.1 设计方案

2.2 设计过程

2.3 设计结果

三．结论与心得

专栏推荐