班级网站设计报告Word格式文档下载.docx
- 文档编号:16896442
- 上传时间:2022-11-27
- 格式:DOCX
- 页数:17
- 大小:1.70MB
班级网站设计报告Word格式文档下载.docx
《班级网站设计报告Word格式文档下载.docx》由会员分享,可在线阅读,更多相关《班级网站设计报告Word格式文档下载.docx(17页珍藏版)》请在冰豆网上搜索。
通过这学期的网页学习和上机实训我们需要的是将自己所学的知识用在具体的网页中。
所以本人结合所学专业的内容制作了班级网站,作为专周的成果。
3)关于班级网站
网站名字为蓝色心晴,整个网站的色调定位为不同深浅的蓝色,包括背景、文字以及photoshop制作的图片都是以蓝色为主。
整个页面以简洁为主要特色。
简洁的蓝色风情给人带来好的心情,让人卸下一天的疲惫。
让人在自由随性的环境下做自己爱做的事。
给人带来轻松愉快的心情来浏览网页。
二、专周目的
通过一个学期的网页开发课程的学习。
我们已经具备咯应用Dreamweaver开发简单网页的能力。
而且纸上得来终觉浅。
我们需要不断的进行实践才能让知识更加好的在我们的掌握范围之内。
设计一个班级网站展示属于我们班的风采也是我们每个同学的心愿。
本次专周目的就是完成同学们的心愿制作一个班级网站。
让大家合作创新了解网页开发的基本知识且能够独立开发一些基础的网页。
至于网站的模块是不强行规定的。
三、设计过程
1)网站模块
班级首页
班级新闻
班级相册
同学录
教师朋友
登录
留言板
2)设计中遇到的问题及解决方法
1)在这次班级网站制作的工程中总想使自己的网页更加丰富多彩,所以在网页中插入图象,动画,动态特效。
在布局方面用很多的div盒子定位。
原意是想让整个页面布局尽可能的精准结果预览的时候发现页面一团糟。
内容重叠现象总是出现。
内容排版也总遇到这样那样的问题,后来才发现原来可以是每个盒子设置不一样的长宽高以及绝对定位属性来确保排版的精确。
这是网页页面混乱的状况
修改后的网页布局
2)还有就是做班级相册的时候,用Flash动画到入Dreamweaver里,结果预览的时候毫无效果。
开始不明白后来才知道是在Dreamweaver里先插个层,这样就可以浏览出效果了。
3)还有是有时上传到网页上的图片不显示,原因是它们没有在一个文件夹内。
四、心得体会
终于在自己的摸索以及同学的帮助完成了这个班级网站的制作。
但是在制作后期看到了一些知名的网站开发出的网页,不仅栏目内容丰富,信息量大,而且页面图文并茂,五彩缤纷,使得网民赞叹不已,流连忘返。
自己开发的网站就报露出很多问题咯。
以我们的经验,当前的软件的功能日趋复杂,不学到一定的深度和广度是难以在实际工作中应付自如的。
因此反映出学习的还不够,缺点疏漏。
虚在加以刻苦钻研及学习,不断开拓视野,增强自己的实践操作技能,为以后能做出出色的网页而努力。
五、致谢
在本次课程设计的整个过程中,要特别感谢自始至终给我提供帮助和指导的杨雅志老师,是他耐心的指导才使得本次设计得以顺得完成,同时,也要感谢我周围同学的不懈努力和互相配合,是他们的鼓励和热心指导让我继续完成我的网页。
在此还要特别感谢为我们提供良好上机环境的学校.如果没有以上老师,同学和学校的帮助和支持,本次设计实难完成.再次感谢老师的精心辅导和同学的相互帮助,使我们顺利完成此次设计以及为学习以后的科目打下良好的基础.
六、参考文献
Javascript效果大师
Web网页开发10列
七、网站截图
八、网页一部分代码
1、网页代码、
<
!
DOCTYPEhtmlPUBLIC"
-//W3C//DTDXHTML1.0Transitional//EN"
"
http:
//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
>
htmlxmlns="
//www.w3.org/1999/xhtml"
head>
metahttp-equiv="
Content-Type"
content="
text/html;
charset=utf-8"
/>
title>
班级首页<
/title>
linkhref="
../main.css"
rel="
stylesheet"
type="
text/css"
styletype="
--
a:
link{
color:
#666666;
text-decoration:
none;
}
visited{
#0033FF;
hover{
active{
#FFFFFF;
/style>
scriptlanguage="
JavaScript"
varoMyDate=newDate();
variYear=oMyDate.getFullYear();
variMonth=oMyDate.getMonth()+1;
//月份是从0开始的
variDate=oMyDate.getDate();
variDay=oMyDate.getDay();
switch(iDay){
case0:
iDay="
星期日"
;
break;
case1:
星期一"
case2:
星期二"
case3:
星期三"
case4:
星期四"
case5:
星期五"
case6:
星期六"
default:
error"
document.write("
今天是"
+iYear+"
年"
+iMonth+"
月"
+iDate+"
日,"
+iDay);
/script>
/head>
body>
div>
divclass="
one"
imgsrc="
images/蒙版.gif"
width="
1024"
height="
150"
/div>
div>
ahref="
#"
class="
daohang"
b>
班级主页<
/b>
/a>
班级新闻.html"
class="
班级新闻<
班级相册.html"
班级相册<
同学录.html"
同学录<
教师朋友
(2).html"
教师朋友<
留言板.html"
留言板<
登录.html"
登录<
two"
>
MARQUEEdirection="
left"
behavior="
scroll"
scrollamount="
3"
scrolldelay="
10"
loop="
0"
align="
middle"
onmouseover=this.stop()
onmouseout=this.start()
最新公告
▲通知:
全校师生:
下学期开学后,学校将进行2011-2012年度家庭经济困难学生的认定工作。
为此,请需要参与认定的09、10级学生在暑假回家期间办理《高等学校学生及家庭情况调查表》,此表需要加盖当地乡、镇政府或街道办事处公章。
成都电子机械高等专科学校
/MARQUEE>
bj"
five"
<
pclass="
four"
/p>
ul>
li>
李飞跃男讲师硕研生西南师范大学计算机应用操作系统<
images/new0.gif"
28"
11"
/li>
杨勇男讲师本科四川轻化工学院计算机及应用Web编程技术
”<
王蓉女讲师硕士电子科技大学<
谢春女助教硕士四川大学计算机应用技术<
杨蕾,一个美丽大方的老师,
一口流利的英语,让我们折服<
/ul>
seven"
班级举办端午发粽子活动<
…<
我班同学积极参与我校举办“纪念党成立九十周年红歌会”<
我班圆满完成数据结构专周<
我班圆满完成c++专周<
期末考试在即。
我班同学正在积极的进行复习<
将步入大二。
我班同学冷静直面挑战<
three"
images/img_03.gif"
331"
324"
pic"
相册展示<
images/img_07.jpg"
marqueedirection="
right"
images/http_imgloadCARCA1HP.jpg"
alt="
天险"
200"
bk"
/>
images/http_imgloadCA3AZAK0.jpg"
balt="
公益益身"
images/http_imgloadCAB0UTJ6.jpg"
环境很重要"
images/http_imgloadCANM33R7.jpg"
泰安古镇"
/>
images/http_imgloadCAZ0B91Z.jpg"
记得"
images/http_imgloadCABPSORS.jpg"
青城留念"
images/http_imgloadCA44O861.jpg"
pose"
images/http_imgloadCA6XD711.jpg"
假蛇啦"
/marquee>
bq"
center"
p>
spanclass="
STYLE4"
网站归电子高专计算机信息管理专业所有<
/span>
您对本网有何意见或建议请登录:
br/>
index.htm"
target="
_blank"
关于我们|联系我们|版权申明<
/body>
/html>
2)css代码
.daohang{
font-size:
14px;
#F1E474;
background-image:
url(my%20web/images/20041130_gzxc.gif);
height:
32px;
padding-left:
24px;
display:
block;
float:
left;
line-height:
.one{
150px;
width:
1024px;
left:
7px;
top:
-15px;
.two{
position:
absolute;
202px;
216px;
1022px;
background-color:
#66FF99;
.three{
absolute;
529px;
246px;
332px;
325px;
border:
1pxsolid#00FFFF;
url(my%20web/images/%E6%9C%AA%E6%A0%87%E9%A2%98-1.gif);
.pic{
220px;
574px;
divpimg{
body{
margin-right:
100px;
margin-left:
200px;
url(my%20web/images/5d79f4e12c1b9d7dc4da4eab82a80211.jpg);
1100px;
mediumsolid#0000FF;
background-repeat:
no-repeat;
.bk{
10pxsolid#00FFFF;
.more{
50px;
231px;
.esx{
201px;
841px;
173px;
b{
url(images/yuanjiao2.gif);
background-position:
righttop;
padding-right:
.bj{
.four{
font-weight:
bolder;
#0000FF;
30px;
center;
url(my%20web/images/more02.jpg);
thinsolid#00FFFF;
.bq{
18px;
#6F3;
207px;
960px;
127px;
.five
{
321px;
1pxsolid#00CCFF;
url(my%20web/images/%E6%9C%AA%E6%A0%87%E9%A2%98-2.gif);
.seven
865px;
357px;
#tupian{
-5px;
-68px;
考核情况(由指导老师填写)
项目
考勤
(20%)
验收
(40%)
报告
总分
得分
记录
考勤日期
出勤记录
验
收
情
况
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 班级 网站 设计 报告