网页制作课程设计文档模板.docx

1、网页制作课程设计文档模板Web编程基础课程设计报告课题名称 凯美丽美容机构整站设计 姓 名 班 级 指导教师 成 绩 信息技术与工程系二一年六月一、总体设计1.1 网站定位与总体设计公司企业名称：凯美丽美容机构建网目的： 宣传企业形象 、提高管理效率 、提高经济效益 网站进度要求：一周需要的栏目 (请根据您的建站需求修改填写以下内容)序一级栏目二级栏目栏目功能要求1. 集团介绍集团构架集团理念集团文化集团风采采用自定页面生成系统2. 量子医学量子医学详述本机构对量子医学的应用使用产品图片展示功能3. 产品专区产品图片产品生产公司产品用途产品适用人群及注意事项使用产品图片展示功能4. 加盟指南加

2、盟项目加盟细则使用产品图片展示功能5. 专家在线专家简介沟通平台使用图片展示功能6. 官方论坛选用新闻信息发布系统7. 联系我们公司地址联系方式乘车路线客户资料产品/服务图片资料：客户提供的所有素材包括公司logo和产品服务图片，都刻成光盘形式供设计使用。网站Banner设计468*60 Gif图片、760*90像素Jpg图片 (不限以上格式)网站风格设计：1. 美观大方 2. 简洁实用3. 粉红浪漫 4. 红色喜庆 5. 蓝色魅力 6. 苹果树下7. 香橙浓郁 8. 冷色蓝调 9. 灰色轨迹 10.紫色雅致 11.黑白搭配 12.节日风格13.绿色清爽 14.流行时尚 15.古典怀旧 (以美

3、观大方为主, 其它风格仅供参考)参考网站1、 网站制作资料1、新闻信息发布系统 2、产品图片展示功能 3、访问统计(计数器)4、访客留言管理功能 5、友情链接管理功能 6、投票调查管理功能7、在线招聘管理功能 8、产品在线订单系统 9、广告发布管理功能10、自定栏目管理功能 11.数据库在线备份功能 12、网站信息设置管理13、自定页面生成系统 14、会员管理系统功能 15、模板修改管理功能16、站内信息检索系统 17、文件上传管理功能 18、社区论坛管理系统 选定的功能模块：1、2、12、13、 (请填写选定的功能模块代号)(各功能模块说明详见) 特殊功能要求： 无 其他设计及制作要求公司企

4、业简介：凯美丽美容机构是一家具有国际标准化正式注册的美容机构。拥有先进的医疗设备，专业的美容服务和行业的最新资讯。 企业公司产品服务内容：美容护理，出售美容产品产品/服务图片资料：客户提供的所有素材包括公司logo和产品服务图片，客户都刻成光盘形式供设计使用。创意简述1. 该公司是美容机构，整体感觉按照客户提供的需求划分，通过清晰的布局和直观的图片展现方式直接提供给客户。2. 主要采用蓝色魅力的感觉 让浏览者感觉到舒适、优雅、美丽 而且不失商业特点3. 网站的主图主要是给人感觉优雅美丽，让浏览者体会到行业的直观感受其他参考资料清单KML- WD -20071120项目立项打包文件客户签名凯美丽

5、美容机构承接方签名填表日期2010年6月20 日1.2 网站各栏目说明画出网站结构，以文字说明各部分的功能。1、主要分类首页集团介绍量子医学产品专区另盟指南专家在线官方论坛功能说明：作为主要业务进行有效的分类和功能的简单理解。可使浏览者通过点击快速1.3 网站新增功能或特效原有网站没有的各类特效，如Flash，特效JS等如果小组完成的是图片转换为网页的题目，可以补上没有效果图的网页。 二、网站建设2.1 网站进度表安排编号工作任务计划完成时间完分成百比负责人1. 完成首页6302. 集团介绍6273. 量子医学6254. 产品专区6。255. 加盟指南6276. 2.2 小组分工安排说明小组每

6、个人所负责的网页。 石晓明 本站首页 叶德顺 集团介绍 张嘉鸿 量子医学 王洁召 加盟指南2.3网站的实现对整个网页的开发过程，应包括页面的截图，对代码进行说明（包括页面布局div块说明，主要CSS布局代码，其它效果代码等等）列出未解决的问题。网页主要分为以下几个逻辑块：id名如图所示； 主要代码如下：1、HTML代码： 滚动公告： 中新网1月1日讯 台当局“总统府”今天召开记者会回应胡锦涛对台谈话，肯定大陆对台政策展现新思 COPYRIGHT (C) 凯美丽美容机构 ALL RIGHTS RESERVED. CSS代码：!-#footer border-top:6px solid #DEDE

7、DE; margin-top:260px; padding:8px; background-color:#EEEEEE; text-align:left; width:1003px; height:50;#container margin:0px; padding:0px; width:1003px; height:40px; #zhong background-color:#F1F3F2; margin:0px; padding:0px; width:1003px; height:40px; background-color:#F1F3F2;#b margin:0px; padding:0p

8、x; text-align:left; width:610px; position:relative; top:0px; left:-197px;#f position:relative; top:30px; left:-111px;#g position:relative; top:0px; left:160px;#j position:relative; top:160px; left:-180px;#k position:relative; top:-73px; left:0px;#l position:relative; top:-73px; left:-190px;#m positi

9、on:relative; top:-73px; left:-190px;#o position:relative; top:65px; left:0px;#p position:relative; top:5px; left:100px;#q position:relative; top:-52px; left:-70px; #y background-image: url(images/fen.jpg); background-repeat: repeat-x; background-position: left bottom; top:0px; left:10px; text-align:

10、left;2、HTML代码： 加盟指南  当前位置：首页>> 加盟指南    新闻中心 正文内容： COPYRIGHT (C) 凯美丽美容机构 ALL RIGHTS RESERVED. CSS代码：#tou text-align:center; padding:0px; width:1003px; height:0px; position:relative; top:0px; left:0px#tou1 padding:0px width:1003px; height:0px; position:relative; top:-17px; le

11、ft:0px; #tu background-image:url(images/lmzuo1.jpg); padding:0px; width:220px; height:27px; position:relative; top:0px; left:0px;#tu1 background-image:url(images/lmjianbian2.jpg); text-align:center; width:150px; height:500px; position:relative; top:0px; left:0px;#alltu background-image:url(images/lm

12、jianbian1.jpg); padding:0px; width:220px; height:600px; position:relative; top:410px; left:-380px;#mian text-align:left; padding:0px; width:700px; height:750px; position:relative; top:-190px; left:110px;#jiameng text-align:left; background-image:url(images/lmzhongshangtiao1.jpg); padding:0px; width:

13、700px; height:25px; position:relative; top:0px; left:-29px;#houmian text-align:left; padding:0px; width:700px; height:50px; position:relative; top:1px; left:-29px;#zuihoumian border-top:6px solid #DEDEDE; margin-top:0px; padding:8px; background-color:#EEEEEE; text-align:left; width:1003px; height:50

14、; position:relative; top:-330px; left:20px; 3、HTML代码： 加盟指南  当前位置：首页>> 加盟指南    新闻中心 COPYRIGHT (C) 凯美丽美容机构 ALL RIGHTS RESERVED. CSS代码：#tou text-align:center; padding:0px; width:1003px; height:0px; position:relative; top:0px; left:0px#tou1 padding:0px width:1003px; height:0px;

15、 position:relative; top:-17px; left:0px; #tu background-image:url(images/lmzuo1.jpg); padding:0px; width:220px; height:27px; position:relative; top:0px; left:0px;#tu1 background-image:url(images/lmjianbian2.jpg); text-align:center; width:150px; height:500px; position:relative; top:0px; left:0px;#all

16、tu background-image:url(images/lmjianbian1.jpg); padding:0px; width:220px; height:600px; position:relative; top:410px; left:-380px;#mian text-align:left; padding:0px; width:700px; height:750px; position:relative; top:-190px; left:110px;#jiameng text-align:left; background-image:url(images/lmzhongsha

17、ngtiao1.jpg); padding:0px; width:700px; height:25px; position:relative; top:0px; left:-29px;#houmian text-align:left; padding:0px; width:700px; height:50px; position:relative; top:1px; left:-29px;#zuihoumian border-top:6px solid #DEDEDE; margin-top:0px; padding:8px; background-color:#EEEEEE; text-align:left; width:1003px; height:50; position:relative; top:-330px; left:20px; .4、HTML代码： 加盟指南 / 当前位置：首页>> 加盟指南     任何困难和挑战都无法挫败伟大的中国和伟大的中国人民