本课题介绍的是沐风盆栽网站的设计与开发，网站包含多种多样的盆栽的信息。主要以网络销售的方式宣传沐风盆栽网站。主要开发软件是Photoshop和Dreamweaver，利用Photoshop软件对图片进行处理和加工，融合盆栽的特点，初步设计网站的效果图。使用Dreamweaver软件，基于HTML和CSS对网页代码进行编写，设计网站整体色调及展示细节，使用JavaScript设计特效并测试加载，使网站达到预期的效果。力求为用户设计一款交互效果较好的在线宣传及购物平台。本文从网站页面结构设计、网站页面设计、CSS样式布局、JavaScript页面特效等方面做了详细阐述。
目 录
一、引言 1
（一）课题开发背景 1
（二）网站开发目标和意义 1
二、工具和技术 1
三、网站设计 2
（一）总体设计 2
1.功能模块 2
2.网页布局 3
（二）详细设计 4
1．网站logo设计 4
2．导航菜单设计 5
3．页面色彩搭配 6
四、网站页面具体实现 7
（一）网站首页页面实现 7
（二）网站二级页面实现 9
1.关于多肉养殖页面 9
2.热播新闻页面 10
3.多肉图片展示页面 11
4.多肉商城页面 12
5.绿植促销活动页面 13
6.用户登录页面 14
7.新用户注册页面 15
（三）网站三级页面实现 16
1.我的购物车页面 16
2.我要下单页面 18
五、总结 20
致谢 21
参考文献 22
一、引言
（一）课题开发背景
现在工业化进程越来越快，社会环境污染越来越严重，各种企业、学校、公司对绿色植物的需求量增大，再加上现在都市快节奏的生活方式，让许多的人无法亲近自然，进而无法了解植物。绿色养殖、多肉盆栽等绿色盆景深受广大年轻人喜爱，从各个工作白领、到学生用户，越来越多的人群喜欢养殖多肉，目前针对各类多肉养殖，对于多肉 *景先生毕设|www.jxszl.com +Q: ￥351916072￥ 
商家而言，他们迫切需要开发一款基于计算机技术和网络技术的智能化软件，来宣传养殖技术，为了能让人足不出户就能了解植物，买到自己想买的绿色植物。盆栽网站的开发显得十分的必要，沐风盆栽网站是通过收集各方面关于盆栽的信息，而其主要的目的也是为了让更多的人能够更好的了解盆栽，了解盆栽的种类，体会盆栽的美观性。
（二）网站开发目标和意义
绿色养殖盆栽宣传网站的开发目标为使用HTML语言设计一款响应式静态网站，帮助养殖商家宣传多肉养殖技术，展示绿色养殖各类新闻、博客活动，帮助广大消费者了解盆栽了解多肉，并且为广大消费者用户提供购物电商平台。绿色养殖盆栽宣传网站的设计要求为用户设计符合用户需求的响应式设计多肉宣传网站。绿色养殖盆栽宣传网站的开发有利于帮助商家用户在线宣传各类多肉养殖技术，多肉新闻活动、博客等信息，帮助商家用户普及绿色植物的知识，用图片的方式更加直观的显示出绿色盆栽的美，宣传它们的健康无公害。绿色养殖盆栽宣传网站的开发，有利于帮助在线商家用户促进盆栽电商购物平台的发展，方便消费者用户来选购盆栽。
二、工具和技术
制作盆栽网站首先要收集盆栽的相关图片与信息，沐风盆栽网站的设计与开发主要运用到了两款软件: Adobe Photoshop、Dreamweaver。Adobe Photoshop，Adobe公司开发和发行的图像处理软件，简称“PS”。处理以像素所构成的数字图像是它的作用。将收集到的盆栽图片用Photoshop软件进行处理使图片达到想要的效果。Dreamweaver是网页编辑器，该软件集管理网站和网页制作于一身，利用Dreamweaver制作网站，使用HTML语言设计一款响应式静态网站,在此环境中编写代码，制作与修改网页，完成自己所想要的网页效果。
三、网站设计
绿色养殖多肉养殖宣传网站的设计主要为前台会员展示和购物页面，以及会员登录和新用户注册页面的设计。
（一）总体设计
1.功能模块
网站首页作为各类用户进入本网站最先看见的页面，为吸引各个消费者用户的注意力，要求设计动态响应式交互效果。网站首页设计是使用了JavaScript技术设计页面的动画效果，首页应设计头部导航菜单，下面设计大屏滚动图片区域、热销盆栽展示的区域、热播新闻区域、养殖技巧普及区域、多肉养殖图片展示区域及底部系统介绍等信息区域。
多肉养殖技术模块主要包含关于多肉、多肉养殖、多肉图片展示、多肉宣传文化等模块，关于多肉植物主要由多肉植物繁殖方法展示、及热销商品展示区域等部分组成。
多肉图片展示模块主要为使用JavaScript技术设计，使用图片和文字描述相结合的方式来展示多肉植物的图片信息。
热播新闻模块主要为热播新闻、养殖新闻、多肉活动等模块组成，各个模块要求使用JavaScript技术设计图文相结合的方式来进行展示，设计响应式动画效果。
多肉博客模块主要为多肉博客展示、多肉详情展示、多肉论坛专区等内容组成，方便向广大消费者介绍各类多肉养殖技术、多肉新闻博客信息，各个用户都可以通过这个平台分享自己的养殖绿植的方法和心得，以便于相互之间的交流。
多肉商城模块主要为展示各类型多肉商品，如多肉商城、绿色商城、特价商品信息等部分，推广这些绿色植物的信息为平台打造良好的形象，也为大家能够充分了解这些盆栽的信息作准备，特效的运用同时节约板块的占用，方便用户一目了然浏览各类绿色多肉商品信息。
联系我们模块设计区域主要由联系我们、留言中心和我要留言等模块组成，用户可查看联系我们信息，方便了解我们店铺的各类信息，如联系电话、联系地址信息等，可查看留言中心的各类留言信息。
用户中心模块设计主要为新用户注册功能设计、用户登录功能设计、用户操作购物车页面设计、用户查看订单页面设计。该模块主要为实现购物浏览而设计。新用户注册页面主要为用户注册表单而设计，用户只需要在注册表单中输入用户注册信息即可，用户登录功能设计为用户登录表单的设计，该页面主要为用户登录表单设计。

原文链接：http://www.jxszl.com/jsj/jsjkxyjs/61879.html