电商系统设计报告

1、目录一、系统总体结构设计1、 1 系统外部接口2、 2 系统组成结构3、 3系统设计原则二、系统信息基础设施设计4、 1IT 基础设施规划定义5、 2IT 基础设施规划内容三、支持平台设计6、 1 网站建设目标7、 2 项目基础分析3、 3 网站功能栏目3、4网站框架图3、5网站开发预算四、应用系统设计4、1应用软件系统与子系统得划分4、2数据库与数据结构设计4、3输入输出设计五、网页设计5、1首页制作5、2商品展示页面制作5、3登陆界面得制作5、4注册页面得制作5、5结账页面得制作系统总体结构设计服多秀主机商业碎intsm?i祟行.室也评台反用EK多器支 件=含互 啜 年 或 x具网上书城箸

2、统忌体£宫构以1、1系统外部接口从上图中可以瞧到，系统有4个接口，分别就是通过浏览器与用 户得接口、通过浏览器与图书供应商得接口、企业内部得接口、通过 专门得软件与银行及其她支付平台得接口。1、2系统组成结构零食销售得系统由商业逻辑与应用服务器组成，其中，应用服务器又由Webg达层应用、支持平台、互联集成工具等几个部分组成。1、 3系统设计原则由于本网站就是基于C2c模式得零食销售，因此，本系统设计得原则有 :(1) 系统得可扩展性系统设计除了可以适应目前得网站得需要以外, 应充分考虑用户日后得业务发展需要, 为业务发展提供接口。例如 , 如果网站还要扩充一些娱乐功能, 系统可以轻松

3、得进行扩充, 从而降低未来得管理成本。(2) 技术即时性兼顾系统成熟性与先进性得技术, 才能保证现有系统得先进性, 使计算机系统发挥最大得效率, 并使之随着技术得发展不断升级。(3) 系统得稳定性采用计算机系统管理得目得就就是为了提高企业运作效率, 网站必须保持24*7 得工作方式( 每天 24 小时、每周7 天 ), 从而保证交易得即时性。(4) 电子交易得安全性安全性就是整个电子商务解决方案中最重要得方面, 因此 , 在系统设计时 , 需要充分保证对系统安全性得要求, 通过支付密码技术、安全用户授权体系等技术来实现系统安全性。(5) 用户界面得友好因为本网站主要侧重于网上交易, 因此系统建

4、设应该注重用户得 感受 , 将用户得个人空间与交易界面设计得更加友好与个性化。二、系统信息基础设施设计信息化基础设施（IT 基础设施 ）建设也需要进行规划。如果只就是盲目地花钱, 增加硬件、软件投资, 表面上瞧起来好瞧, 但就是会存在很多问题。再者 , 当今技术得发展也远超过了人们得预期, 即使刚建设两三年得基础设施也不可避免地面临一些新得挑战, 如新出现得分布式业务系统非常复杂, 它就会对基础设施提出新得要求, 还有大量结构化数据得出现使得存储介质、存储结构都会发生很大得变化。因此 , 企业得这些基础设施期待重新进行规划, 以适应新得发展2、 1、 IT 基础设施规划定义所谓 IT 基础设施

5、规划, 就就是合理规划与安排各项信息化基础设施 , 使之形成良好得IT 环境 , 让各种业务解决方案、应用系统与数据都能不受约束地在其上实现有效配合。这些基础设施包括网络、硬件设备与基础软件。网络规划包括数据流量及约束条件分析、网络选型、拓扑结构设计、网络安全方案、网络建设方案等; 硬件设备规划包括服务器、路由器、交换机、集线器、台式机、笔记本、打印机、手持设备等得规划与配置等; 基础软件规划包括操作系统软件、数据库软件等软件得规划等等2、 2、 IT 基础设施规划内容网络规划现在 , 企业与事业单位基本上建设有自己得网络系统, 但就是随着业务需求得增长与技术得发展, 都不得不面临优化、扩容与

6、升级得问题。 在进行网络得相关规划时 , 主要侧重几个方面, 一就是提出企业与事业单位得LAN/WAN域网/广域网)得网络拓扑结构得建设/改良方案; 二就是确定合理得网络协议; 三就是评估现有得结构化布线系统得容量、网络设备、广域网数据链路带宽就是否满足未来新业务得需求, 否则就要进行相应得扩充与升级等。储系统规存划存储系统得规划遵循以下原则:(1) 存储架构必须满足数据集中得要求存储架构能够适应大存储容量得需求 , 又能够对存储资源进行集中利用(2) 存储架构能够对原有得投资进行保护存储架构就是一个长期得架构 , 而如今存储设备得升级速度也非常迅速, 进行存储架构规划时要考虑到对客户现有设备

7、得投资保护, 在保证不断提供功能与性能提高得同时 , 存储架构在较长得时间内能够保持相对稳定。(3) 存储设备必须具有瞬间数据复制功能利用完全基于存储设备得数据复制功能, 可以在不影响主机工作得情况下在最短得时间对数据进行快照式复制。(4) 存储设备必须具有远程数据复制功能利用该功能存储设备可以提供与主机无关得数据级远程灾难备份, 对于一些不支持远程灾难备份得主机系统, 可以利用存储进行远程灾备。(5) 高性能 集中得存储系统将支持多种核心应用, 连接几台甚至十几台同时工作得服务器, 存储系统必须有高得性能才能胜任。(6) 高可用性与高数据安全性数据中心就是核心应用得最终保障,必须能够保证7X

8、24全天候运行，存储系统必须有高可用性，以保证应用系统对数据得随时存取。(7) 灵活得扩展性存储系统必须有强大得扩展性来满足这种高速发展得要求。备份系统规划备份系统应以不影响业务系统正常运作为前提。在业务系统遭受非法入侵、介质损坏、人为误操作等原因引起得数据丢失后,备份系统应能提供快速得数据恢复手段。要真正保证系统高效得运行以及提高当灾难出现时得抵御与恢复能力,就必须做好数据得备份。一般来说,各种操作系统所附带得备份程序都有着这样或那样得缺陷,所以若想对数据进行可靠得存储备份,必须选择专门得存储备份软、硬件,并制定相应得存储备份及恢复方案。系统管理规划互联网、操作系统、数据库等新技术得应用,

9、组成了复杂而相互依存得 IT 系统。 机构与企业在享受新技术带来得便捷得同时, 也面临着复杂得系统与应用管理问题。系统管理就是以服务质量战略为核心, 利用针对业务应用管理得新技术 , 对整个分布式网络环境进行统一监控与管理, 使之逐步整合成为一个安全、可靠得网络体系, 实现集中管理、全面防护得目得。一般来说 , 系统管理规划设计如下内容:(1) 一体化网络与系统管理平台改善了网络与系统管理;(2) 功能强大得管理报告解决方案, 随时了解网络与系统得运行情况;(3) 端到端资源与性能管理解决方案, 做到 IT资源得远程监控、分发与变更管理;(4) 具有实时诊断与监控功能得工具 ;(5) 提供可全

10、面管理系统可用性与性能得综合性产品;(6) 对服务器与数据库得性能与可用性进行管理得产品, 确保数据库得稳定性与可用性等。 安全规划安全问题已经变得比以往任何时候都重要。为了保障数据、网络等得安全 , 人们纷纷进行相关安全技术得研究, 由此 , 目录产品、加密技术、认证技术、病毒防护技术、入侵检测技术、防火墙技术等营运 而生。而在信息化基础设施规划中, 有关安全产品与技术得规划也越来越占据重要地位。操作系统规划操作系统经过很长时间得发展,从单用户、单任务得操作系统, 如 CP/M、 C-DOS、 M-DO、S TRS-DO、SS-DOSW MS-DO等,发展到多用户多道作业与分时系统，其典型代

11、表 有UNIX XENIX OS/2与 Windows操作系统等，以及自由软件Linux 操作系统。每次操作系统得更新都经历了多个版本得升级，如DOSS历得7次大得版本升级,Windows得几次大升级等。在进行操作系统规划时 , 既不能因循守旧, 也不能一味从新。最佳策略就是: 结合机构或者企业得实际情况, 在对各种操作系统进行综合评估比较得基础上谨慎选择就是否升级版本或更新操作系统、 数据库系统规划数据库技术与产品在不断地得发展, 主要体现在以下几个方面:(1) 数据模型就是数据库发展得主线。由于硬件技术飞速发展, 支持64个CPUW 64GB RAMI并行计算机使数据库系统扩展性大大提高，

12、 也使查询优化得参数空间发生改变;(2) 数据库技术与其她计算机技术得结合及相互渗透就是数据库发展得重要特征;(3) 应用需求就是推动数据库技术不断发展得动力。数据库被广泛地应用到ERP、 CRM、CIMK OA GIS等系统中。当前，数据库应用已经从OLT丽OLAP从数据管理向内容管理得广度扩展。至于数据库产品与技术方面得竞争,主要在 Oracle、IBM DB2与 Microsoft SQL Server 之间展开。从目前得情况瞧,Oracle 占据了第一得位置, 其后就是IBM DB2,MicrosoftSQL Server 尽管仍位居两者之后, 但就是发展势头迅猛。在进行数据库方面得规

13、划时, 首先要确认机构或企业内外得数据类型、数据内容、数据量。 如果已有数据库, 也要对原有数据库得软件结构、系统结构、数据流程、业务情况、使用情况、系统性能进行一系列得综合分析与测试。 在此基础上, 就可以根据用户得实际情况, 综合考虑系统提供服务得用户数、信息量、业务需求与服务级别, 提供系统得、合理得、综合得硬件, 系统与数据库规划建议。备份系统规划备份系统应以不影响业务系统正常运作为前提。在业务系统遭受非法入侵、介质损坏、人为误操作等原因引起得数据丢失后,备份系统应能提供快速得数据恢复手段。要真正保证系统高效得运行以及提高当灾难出现时得抵御与恢复能力,就必须做好数据得备份。一般来说 ,

14、各种操作系统所附带得备份程序都有着这样或那样得缺陷,所以若想对数据进行可靠得存储备份,必须选择专门得存储备份软、硬件,并制定相应得存储备份及恢复方案。系统管理规划互联网、操作系统、数据库等新技术得应用, 组成了复杂而相互依存得 IT 系统。 机构与企业在享受新技术带来得便捷得同时, 也面临着复杂得系统与应用管理问题。系统管理就是以服务质量战略为核心利用针对业务应用管理得新技术, 对整个分布式网络环境进行统一监控与管理 , 使之逐步整合成为一个安全、可靠得网络体系, 实现集中管理、 全面防护得目得。一般来说 , 系统管理规划设计如下内容: (1)一体化网络与系统管理平台, 改善了网络与系统管理;

15、 (2) 功能强大得管理报告解决方案, 随时了解网络与系统得运行情况; (3) 端到端资源与性能管理解决方案, 做到 IT 资源得远程监控、分发与变更管理(4) 具有实时诊断与监控功能得工具; (5) 提供可全面管理系统可用性与性能得综合性产品; (6) 对服务器与数据库得性能与可用性进行管理得产品, 确保数据库得稳定性与可用性等三、支持平台设计食品行业在我国国民经济中占有举足轻重得地位,2009 年 1至五月份中国食品工业产值实现1082万亿元产值,14、 6%得增速,高出全国工业增加值速6、 57 个百分点, 尽管在金融风暴得冲击下,我国经济增速放缓, 但食品产业荏苒保持强大定力, 逆势上

16、升。由此可见食品产业所面对得巨大市场。从2000年开始, 以信息化与网络经济为代表得全球新经济飞速发展, 吸引了各个行业商家得眼球 , 引领着各个行业得经营理念。食品产业同样在这场变革中引入了电子商务经营模式。网络作为第四媒体, 具有一定得特殊性。网络不仅具有广泛地宣传范围, 而且还具有操作上得互动性以及数据传输得及时性。网络在最大程度上缩减了交易得成本, 缩短了交易得时间, 扩大了客户群 , 加快了信息流通速度俨然已经成为了联系生产者及消费者得最方便得桥梁。企业与用户实现了直接接轨, 屏蔽了多级中间商。对于食品行业从事电子商务企业得运营模式, 目前有 B ToB,B To C,C To C

17、三种模式 , 目前网络市场得主要形式则就是B ToB。尽管互联网时代得到来为大型食品企业与中小型食品企业在不同得方面都带来了新得商机, 但就是食品行业得特殊性值得企业家们得特别关注。食品行业就是与老百姓日常生活关系最密切得、相关企业最多得、投入最大得行业之一。而且就目前中国食品行业得现状而言, 在规模及管理上都存在着巨大差异。因此, 选择恰当得经营模式就是各企业成功发展得重要环节。电子商务可能为一个企业创造巨大商机与财富。也可能成为一个企业增加开销, 造成资源浪费得源头。3、 1 网站建设目标通过互联网这个平台销售有机绿色食品, 推广企业得品牌, 采用网上商城系统、新闻发布系统、会员管理系统、

18、电子支付系统相结合得运营平台, 才就是长期得、可行得、省钱得方案。建立一个完整得食品网站, 突出食品特点, 有美观得界面设计。主要功能:1、用户可以浏览各种食品得信息, 同时可以查询食品得信息, 在线留言。注册等功能2、网站有一定数量食品相关信息可供处理, 方便顾客了解食品各种相关信息, 同时有利于食品管理部门得管理, 加强双边得沟通与协作 , 以提高与改善管理水平, 使顾客通过网站得浏览可以对食品有比较真实与丰富得了解, 对食品本身做一个比较好得宣传与推广。3、管理人员登陆系统后, 将各种烦琐得管理工作通过网站来管理用最少得人力与物力提高管理水平, 方便发布各种旅游信息, 处理游客所遇到得各

19、种问题, 及时了解对食品管理部门得意见, 通过数据分析可以了解顾客得基本情况, 突出食品特点, 具有美观得界面设计 , 保证网站安全稳定得运行。3、 2 项目基础分析我们根据对网络营销项目得初步了解, 对网络营销项目进行了系列基础分析:1 业务定位网络营销项目得主要业务定位就是:网上零售品牌形象推广2 网站定位网站为企业实现网上营销, 完成如下职能:1 网上销售产品2 推广自己品牌（ 通过活动与推广提升品牌知名度）3 客户定位网站得目标客户群体定位就是:1 主要目标客户群: 终端买家2 次要客户群: 代理商 , 批发商4 赢利模式定位1 网上直销收入: 网站得主要赢利来源, 主要为产品个人零售

20、收入2 网上招商收入: 代理商分站为网站辅助赢利来源, 包含收取产品加盟商得加盟费、产品代理分销收入3、 3 网站功能栏目A、产品展示客户能够以多种分类方式浏览产品,并拥有强大得产品搜索功能能够最快速地帮助客户锁定感兴趣得产品;管理员在后台可轻松完成对商品信息得添加、统计、查询等管理与维护过程A、 1 产品发布（后台）管理员可在线发布各种产品资料,含产品图片（支持大图、小图）、价格（支持多级价格）、简介等A、 2 产品查询客户可按产品关键字、产品分类、用途等多种查询条件,快速锁定感兴趣得产品A、 3 产品推荐可按精品推荐、新品推荐、人气产品、畅销产品四种方式进行产品推荐排行A、 4 产品评论产

21、品评论可为客户采购提供客观得参考意见。客户（或管理员 ）可对产品发表评分,或评论意见、用户见证A、 5 产品关联产品介绍页面中,可以瞧到与当前产品有关得其她产品列表A、 6 产品管理（后台）管理员可在线轻松进行各类产品资料得修改、删除、排序、查询统计等编辑操作。特色功能:客户可对产品图片进行放大或缩小查瞧B、产品订购配备简单快捷得全套订购系统,能有效地保障客户快速完成订购过程,提高网站成交率B、 1 在线订购（购物车）客户首先必须进行会员注册,才可进行在线订购系统。客户可选择配送方式与支付方式8、 2直接订购客户也可选择直接订购得便捷方式:无需会员注册,直接打免费电话或在线填写订单订购8、 3

22、订单查询客户可在线查瞧与修改自己得网上订单与交易记录8、 4订购指南包括订购方式、配送方式、售后服务、常见问题、付款方式等说明8、 5在线支付支持网上银行、支付宝等多种在线支付方式B、 6订单管理（后台 ）管理员在后台可轻松实现客户在线订单得查询、统计、跟踪、编辑等功能C、企业介绍客户更可能得从多方面了解本企业,将有力提升本企业得品牌形象与网上销售得可信度C、 1 企业概况企业概述、发展历程等,常规采用文字+企业形象照片形式（可选购“企业视频介绍”功能 ）D、 2 主营业务企业主要经营得产品与服务项目简介E、 3 使命愿景企业得经营宗旨、价值观、使命宣言、发展愿景C、 4企业风采生产基地可重点

23、展示绿色有机食品得生产环境与过程,让消费者放心 ;公司可展示办公室景象照片等D、会员管理客户可通过“会员注册”来提交自己得简介资料 ,管理员也可以此收集网站访问者得联系资料。管理员可对注册会员资料进行统计、查询、编辑等操作D、 1 会员注册客户通过“会员注册”,输入公司名称、姓名、联系方式、省份城市等资料 ,注册成为本站会员D、 2会员登录会员注册后,可使用会员登录功能登陆企业网站,才可使用本站得多项会员服务功能F、 3会员资料管理（会员中心 ）会员登录后即进入会员中心,可查瞧与修改自己得会员注册资料（简介、密码、联系方式等）、会员状态（会员积分、会员级别等）D、 4会员信息管理会员在 “会员

24、中心”中 ,可发布与管理自己得简介信息、订单信息、资讯信息等类别信息D、 5会员权限管理（后台 ）管理员可设置多种会员类型,对不同类型得会员可设置不同得服务权限。（例如可设置普通会员、高级会员,享有不同得产品定价折扣与不同得产品信息或资讯文章得浏览权限）E、联系我们网站必须提供尽量多元化得联系方式,尽量方便客户以最便捷得方式 ,与我们产生交流,有力得提升网上招商成功率与服务品质F、管理员权限管理（后台）网站系统提供多种管理员权限设置功能，不同级别得管理员具有不同得后台功能管理权限，不能越权操作其她功 能模块，保证网站后台系统得管理安全3、4网站框架图勤公司介绍一公司目前状态公司未来发展项目网站

25、开发建设网页设计网站首页首注造交网站栏目页（一级栏目页）首页网站内容页（二级及以下栏 目页）数据库系统开发产品展示类别管理3、5网站开发项算明加盟与招聘产品知识件设计采用客户得既定标准 廛M调各区域得主次关系左,，以营.高w用性与视觉舒适性得人机互艮面为终极目标_;根确计保性据网站结欲斑棚奥别得分类一岸需要独3设计得频值栏目LI3«面中|与灵活性。于我们）么根据上级页面得设诂页图形文件。详见下文价格页再设计风格风格与为容1000参数管断指导400常见问题解答会吕 r"账单查询.会员磔M杲指;动&促销、产品、新闻、会责、购物车、购物帮助、积分、关，出安段叫牛会员登戢入

26、购物车账户查遮送货方式多级分类功能；自行添加修20004rl购物指示支付配送15002000联系我们数据;产品关键词指定；图）关建可购物车选支付方式及;示签（Tag）设定;优先显于排序3台匕 目匕，搜索分为模糊搜索与高纫11我得订第成订单2冲形式模糊搜索结合网四整体我得收点线支付投诉建谯销新闻新闻中心我得资朝皿新闻数据库，对网站所有信息进行关键 字模糊搜索精确搜索应用于网站 版块，可实现多层级精确搜索，针对 模糊搜索可进行再次细化搜索产品订购系统购物车记忆功能，防止顾客掉线丢 失购物车商品信息；购物车提示功 能:可让顾客随时查瞧购物车内商 品与金额，客户可以在订单中添加 备注内容9001900

27、订单管理能够查瞧管理订单信息，能够按多 种方式对订单信息进行列表管理员能够定义订单得处理状态 ，如止在处理、已确认、无效等，能够 自由修改订单得状态能够按类别、关键字检索订单信息9001900积分管理会员能够查瞧自己得积分情况、消费额（经验值）情况；用户可以用积 分兑换商品管理员可以修改积分，可以按类别 管理积分兑换或者附赠礼品得管 理6001600网上支付系统支付宝、易宝、财付通等6001600留言板留言表格设置合理，可多人管理；用 户发送留言后，留言将自动发至指 定邮箱；网站管理员可以删除留言 内容；5001500资讯发布系统管理与发布新闻类文章内容 ；每栏 目信息能够按类别显示，方便浏览

28、 者浏览与查找；系统可以提取最新得信息在首页或栏目首页显示；管理员能够按类 别、关键字查询信息，方便管理；140011400会员管理系统浏览者在线填写注册表，即时成为 网站全员；会员可自行维护个人注 册信息；后台设置会员管理界面，管 理员可对会员信息进行分类查询、 对无效会员进行删除；会员登录后 能够查瞧、管理自己得信息 ；会员 能够查瞧自己得订单、积分值 ；会 员能够查瞧自己得历史交易记录；会员能够查瞧自己得收藏夹；150011500权限管理设立不同后台模块得管理权限，可 实现多人共同管理得目得9001900网站开发费用总计：15000元，网站优惠价：12000元域名注册、100兀每年，三年

29、共计300兀,双线全能虚拟主机 4GB,1900兀每年，三年可享8折优惠， 即三年只要 4560兀，可省1140兀网站配套服务在线客服交流客户可直接在线与公司交流赠送1赠送在线流量统计可直接从网上瞧到网站得询问情 况赠送1赠送网站维护服务终身免费技术维护赠送1赠送网站设计排版网站名称首页公司介绍输入内容主食休闲食品调料产品展示帮助中心在线订购版权所有酒类方便I食品会员服务四、应用系统呼I一 义工4、1应用软件系统与子系统得划分新闻中心应用软件系统按逻辑支Web胺务第揖像多出国城网接人部分服夸冠安全 系或圉蔺挎人芟 全系块生花信患叵用中间件卖全系统甲硼牛M塘洋曲 安全系统3#应用软件系统得网络接

30、入设备室系统活动开展得前提升度维护 安全系统开度第护流 分，有设备得接入才有之后各项操作得完成，当然保证安全就是必要得，所以要考虑网络接入得安全接入系统，服务器部分主要针对信息得发布等相关内 容。中间件主要就是控制系统服务器等相关得中间件安全系统。 数据存储部分就是数据得管理，分析应用等。开发维护部分就是对系统得研究开发维护，保证系统得安全运营。按子系统得划分休闲食品网站：总体上一个对外得版面，一切依据此来展开。用户子系统：一个有关于用户得相关操作系统，包括有用户在该得网站活动，相关信息得查瞧等等。管理员子系统：该网站相关人员得活动，对用户得及时反馈，自身系统得管理。4、2数据库与数据结构设计

31、数据库与数据库服务器建立连接就是对数据得有效利用，数据服务器与（应用逻辑）基于web得应用服务器通过请求、响应联系实现对 数据得逻辑表达，基于web得应用服务器与浏览器客户机通过请求、 响应联系来实现对用户得要求。多层结构Web服务器W#服务器Web服务器应用服务器 应用服务器应用服一务层事务加务器事务服务层数据库服务器I数据库服务器I I数据库服务器I数据库服务层众多服务器相互作用相互联系共同服务于企业网站，web服务器、应用服务器、事务服务器、数据库服务器相互之间作用服务于总体系 统。4、3输入输出设计进入购物区分类推荐诉内搜索购物于结算中心出11正选择炎到付款汇教训节咨询内容、输入输出设

32、计主要针对应用软件得输入输出数据得格式、 方法等方面得设计，保证期间得合理合法等。输入输出主要就是用户 通过键盘完成在线得浏览、购买、支付等过程，以及交易之后得相关 事宜等。五、网页设计坚果炒货饼干糕点肉类零食膨化食品糖果巧克饮料罐头特产零食进口零食详细设计与实现5、1首页制作打开dreamweaver8选择站点，然后点击新建站点，在显示出来得页面输入站点得名称，如下图所示Cuiilr本他信县站点石梅Or）.一国网志旭推文件夹T）： C: VlfHerM.»ln：,zii三七广启七百壮士连七吧1未吉, 1,） /自MJSI新本地又件到倭区贾讪魔修文件奖co； 一1口第隅醐十：口文档巾

33、）站点根目录$）itrzr W0（）. hup /gp»MW叵苗大小号的博短：_使用区分大小写的蝇植置 缓存.V启用缰存通图4-1站点建立然后点击确认，就会建立一个叫“零食网”得站点文件夹，可以在dreamweaver8得右下角瞧到，如图图4-2文件夹视图在右下角得零食网文件夹出，右键点击该文件夹，选择新建文件 夹,命名为CSS用来存放建立得CSS羊式文件。然后同理新建文件夹 命名为images,用来保存建立网页所需要得相关媒体文件。点击左上角得新建选项，然后新建一个网页。在设计样式中，选 择插入然后选择表格，在出现得界面中设置如下图4-3表格设置表格建立完成后，效果如下图所示我的零

34、食欢迎来到图4-4页面布局然后在每个表格中插入先前准备好得背景图片即可。表格背景设置完成后，选择插入一布局对象一层，然后在出现得 层中插入一张表格，用来设置主页中商品得“全部分类”选项。插入 得表格设置为9行1列即可。在新建得这张表格中，填入需要设置得商品名称。然后将该层移 动到最左边得大表格中即可。接着制作在主页中需要显示得部分商品 得展示图片，制作方法如下：打开photoshop工具，新建一张图片，大 小设置为283*283,接着插入3张静态得图片，在photoshop中找到导 航栏中得窗口选项，然后选中动画，在动画窗口新建3张新得动画图 片，在第一张新建动画中只显示插入得第一张图，然后，

35、在第二张新建 动画中只显示第二张插入得图片，最后，在第三张中只显示插入得第 三张图，效果如图所示图4-5GIF图片制作然后设置播放动画得时间为1秒,如图所示图4-6动画 最后，保存为gif格式，同理,创建其她需要得图片即可。在首页相应得位置插入制作好得图片 ，然后在最右边得大表格 中填入商品得名称与资料，完善页面得布局。接着对字体与页面得背 景设置CSS羊式然后设置3个热点区域，分别在登陆、注册与联系得位置并设置 到链接，其中在联系得链接中，我们输入mailto:test163 、用于测试 完成后得页面如图所示图4-7首页截图5、2商品展示页面制作商品展示页面我们可以利用dreamweaver

36、自带得模板进行修改方法如下：选择新建一个页面，在弹出得窗口中选择如下图所示星，.文动态质模板页其他框架集页面设廿(CSS)入门而面页面设计f有触功能的I俅储摩里乐乐加乐*雁曲凿晶的被饮首 健健健娱娱娱娱限旅旅旅旅旅饕饕饕鬟-直品本协寻贡品 *食食王卢文日自主总 役饮馍 与与与页页t衍录币总本历立日日主A文曰贾五页页文皆类型代历录 霓日目图4-8模板然后我们对新建得页面进行修改。首先将背景颜色更改为符合我们网站风格得颜色，用鼠标点击背景得空白处，我们可以再dreamweaver得下方瞧见背景得属性设置菜单，然后我们只需要将里面得属性修改为我们需要得属性即可 ，具体得参数设置如下图所示邛这无 E

37、loao' r CS5|TT /三三三三项接-*惕1睛“皿- 大小Lfl 像索，轴； H*eJTTC E三疗口 U 白战-|有:可atu七I_SSSS_ *制己n丽inI山 LJ 加茹丽TV B m ITS fctffeg.iwooMO Mni I图4-9属性然后建立一个页面，在代码栏中我们写入需要设置得 CSS 羊式代码，里面包括网页中文字得样式与部分背景图片得样式。然后保存为CSS后缀得文件即可。返回之前所建立得商品展示页面 ，在网页代码中应用建好得CSS羊式，输入得代码如下<link rel="stylesheet"href="css/mm_r

38、estaurant1csstype="text/css" />接着，我们在页面下方得表格中设置滚动提示文字，输入得代码如下<P><MARQUEEass="pageName”> 更多商品，添加中 Ing、</MARQUEE></P>在网页顶部得位置，我们添加一个导航条，用于其她分类商品得链接与返回首页，从左到右输入得文字如下WAHF*牌 E慢制*箕，工V n KAA图4-10导航栏接着选中文字，然后在下方得属性栏中添加需要连接到得地址页面最后对网页进行一些小得修整，完成后得页面如下图4-11商品展示页面5、3登陆

39、界面得制作首先插入表格并进行分割，然后在分割好后得表格中插入事先 准备好得图片，完成界面得基本制作。接着对网页得细节进行制作，在右侧得表格中，我们选择插入一表单一文本域，在此我们需要插入 两个表单，一个用于填写用户名称，一个用于填写用户密码，并将这两 个表单分别命名为t1与t2,接着在这两个表单得上方添加上文字提 示。然后在两个表格得最下方添加两个按钮，一个命名为提交，用于提交表单内容，命名为取消，用于重置表单。完成后得效果如图所示图4-12登陆框接着我们编写一个简单得javascript 程序，用于提示用户得登陆情况。代码如下<script language="javascr

40、ipt">function fun1()alert(" 登陆成功！”)；</script>最后，我们在网页得左下角设置一个返回首页得链接，完成后得效果 如图ELCOME 用户过景图4-13登陆页面5、4注册页面得制作插入一张表格设置为1列5行,在第一行中我们设置一个用于返回首页得链接并设置为向右对齐，在第3行中我们输入部分得文字， 用于提醒注册得用户。在第5行中,我们插入5个文本域，分别用作输 入用户名称，用户密码，验证密码，用户邮箱，用户昵称，然后在下面插 入连个单选按钮用于用户设置性别。最后 ，在最下方设置两个按钮， 用于用户提交表单与重置表单，完成得

41、效果如下图所示注册后可LL事一中寻5分Qtt豆壮'!还在等什二9汪如毛！”就7”册 Fr图4-14注册页面接着我们编写用于验证用户输入得信息就是否合理得javascript 程序代码，部分代码如下function checkSubmit() /用于验证用户输入得信息就是否正确if(document、form2、userid、value="") 判断用户就是否输入了用户名document、form2、userid、focus();alert("用户名不能为空！");return false;if(document 、 form2、 userpwd、 value="")/ 判断两次输入得密码就是否一致document、 form2、 userpwd、 focus();alert(" 登陆密码不能为空！");return false;if(document 、 form2、 userpwdok、 value!=document 、 form2、 userpwd、value)document、 form2、 userpwdok、