网站设计实训总结 网站贴吧实训总结.docVIP

网站设计实训总结 网站贴吧实训总结 网站开发实习 —— 俱乐部论坛系统开发总结 学生姓名 专业班级 学 号 院 （系） 指导教师 完成时间 2011 年 12月 1日 目 录 1. 实习目标 3 2. 实习项目 3 3.设计说明书 3 3.1 XHTML + CSS进行网页界面布局 3 3.1.1 盒模型（Box Model） 3 3.1.2 Float属性 4 3项目开发计划 6 3.1 ASP.NET动态网站开发 6 3.2.1 母版页 6 3.2.2 访问数据库 6 3.2.3 数据验证 6 3.2.4 注册登录功能 6 3.3 SQL Server 7 4.分析及设计 7 4.1 需求设计 7 4.2 数据库架构设计 7 4.3 界面设计 9 4.4 网站具体制作与代码编写 9 4.4.1 创建数据库 9 4.4.2 创建母版页 11 4.4.3 创建登录页与注册页 12 4.4.4 制作发新帖页 12 4.4.5 实现文本框验证 19 4.4.6 使用QueryString进行页面间参数传递 20 4.4.7 创建管理页面 20 4.4.8 错误处理页面 21 4.5测试截图 22 5．实验心得 24 1. 实习目标 通过网站的开发，熟悉掌握XHTML + CSS、ASP.NET、SQL Server相关知识与技能的综合应用，经历一个实际项目的分析、开发与测试。 2. 实习项目 实习项目要求利用ASP.NET（Visual Studio 2008）完成一个俱乐部网站的开发。本俱乐部网站可以使用户注册、登录，登录用户可以对文章进行评论。俱乐部工作人员可以在后台进行文章的发布、编辑并对用户评论进行管理。 沃克俱乐部（Walker Club）要求能够有一个论坛，使俱乐部成员通过网站进行有关健走活动、户外旅游等加强交流与沟通，同时也通过俱乐部网站扩大自己的影响力，以吸引更多的人参加俱乐部，培养健康的生活方式。 俱乐部对论坛的要求是： ? 论坛内容对所有人开放； ? 只有俱乐部会员可以发帖及发评论； ? 俱乐部有专门维护人员，可以对论坛的帖子进行管理； 3.设计说明书 3.1 XHTML + CSS进行网页界面布局 在动态网站的开发中，手工进行XHTML代码编写的情况是很少见的，但利用XHTML + CSS进行网页布局与展示，是网站设计必须的基本功之一。由于CSS的应用，网页布局现在不再使用表格的方式对网页进行布局，而是利用CSS中的盒模型和XHTML中的DIV标签，对网页进行布局，这种网页的布局办法也被称为DIV + CSS。 3.1.1 盒模型（BOX MODEL） 网页设计中的每个元素都是一个矩形盒。在CSS中，进行设计和布局时，会用到盒模型。CSS盒模型从本质上来说是环绕在XHTML元素周围的方框，它由外边距、边框、内边距和实际内容组成。 盒模型允许放置元素周围的边框及周围相关元素。图1阐释了盒模型： 图1 CSS 盒模型 为了能在所有的浏览器中正确地设置元素的宽（width）和高（height），需要了解盒模型的工作原理。当一个元素的宽和高被CSS定义后，它设置的仅仅是内容区域的宽度和高度。元素（盒）的总宽度还包括内边距（padding）、边框（border）和外边距（margin），如下例子中元素的总宽度为300px .element1 { width:250px; padding:10px; border:5px solid gray; margin:10px; } 计算过程如下： 250px（宽度）+ 20px（左右内边距）+ 10px（左右边框）+ 20px（左右外边距）= 300px 元素（盒模型）的总宽度与总高度应当这样计算： 盒的总宽度 = width + padding-left + padding-right + border-left + border-right + margin-left + margin-right 盒的总高度 = height + padding-top + padding-bottom + border-top + border-bottom + margin-top + margin-bottom 3.1.2 FLOAT属性 XHTML的div元素所形成的盒子（box），默认情