动态网页设计毕业论文

admin管理员组

文章数量:1532222

2024年7月2日发(作者：)

摘 要

在Internet飞速发展的今天，互联网已成为人们快速获取、发

布和传递信息的重要渠道，正以一种前所未有的冲击力影响着人类

的活动。它在人们政治、经济、生活等各个方面发挥着重要的作用。

因此网站建设在Internet应用上的地位显的格外重要，它已成为政

府、企事业单位信息化建设中的重要组成部分。

现今的社会，人们已经离不开了网络，网络已经成为人与人之

间交流的一种形式，它能够把事情的复杂化转为简单化，摆脱了时

间和空间的限制。网站为消费者提供了一个网络生活空间，通过其

网页展示了企业介绍、企业荣誉、产品介绍、招商信息、加盟程序、

留言等一系列内容的介绍。浏览者不仅可以利用留言板经济而又快

捷地与外界进行各种信息的沟通，也可以直接在网上申请加盟。

本论文还介绍了网页的结构分析和具体功能实现，网页的界面

和运作方式，尽力模拟近代网页普遍性形式，成为一个完整的动态

网站

关键字

Dreamweaver；Php；PhpMyAdmin；动态网页

0

目 录

1 引言 ................................................... 1

2 网页制作概述 ........................................... 1

2.1 网页的类型 ......................................................................................... 1

2.1.1 静态页面 .................................................................................. 1

2.1.2 动态页面 .................................................................................. 2

2.2 网页开发技术 ..................................................................................... 2

2.3 网页布局 ............................................................................................. 3

2.3.1 网页布局的基本概念 .............................................................. 3

2.3.2网页布局方法 ........................................................................... 5

2.3.2 网页布局技术 .......................................................................... 9

2.4网页配色 .............................................................................................. 9

2.5 网页设计流程 ................................................................................... 10

3 动态网页开发环境和技术................................ 11

3.1 了解Dreamweaver开发工具 ............................................................ 11

3.2 Php语言基础知识 ............................................................................. 12

3.3 开发环境介绍 ................................................................................... 13

4 设计及具体代码实现 .................................... 14

4.1网页结构设计 .................................................................................... 14

4.2创建数据库 ........................................................................................ 15

4.3主要模块的代码实现 ......................................................................... 16

4.3.1 注册代码的实现 .................................................................... 16

4.3.2 登陆及退出登录代码的实现 ................................................. 18

4.3.3留言代码的实现 ..................................................................... 20

4.4运行测试 ............................................................................................ 22

4.4.1 注册 ....................................................................................... 22

4.4.2 登陆 ....................................................................................... 23

4.4.3留言 ........................................................................................ 24

4.5遇到的问题及解决方法 ..................................................................... 25

结 束 语 ................................................ 27

1

致 谢 ............................................... - 28 -

参考文献 ............................................ - 29 -

2

1 引言

网页是网站信息发布与表现的一种主要形式。因此要实现一个网站，必

须了解网页制作的相关知识。较流行的开发工具有：Dreamweaver，Php，

PhpMyAdmin。

Dreamweaver是建立Web站点和应用程序的专业工具，它将可视布局工

具、应用程序开发功能和代码编辑支持组合成一个功能强大的工具,可利用它

快速创建界面及站点的应用程序。Php因为语法简单、开源、跨平台，而

且功能强大，同时能与Windows的操作系统无缝结合，得到广大用户欢迎并

迅速成为各类网站制作的主流开发环境。使用PhpMyAdmin无须编写任何代

码，只需通过直观的可视化操作就可以完成大部分数据库管理任务，是一个

面向对象的、采用事件驱动机制的关系型数据库管理系统。

[2]

[1]

2 网页制作概述

2.1 网页的类型

2.1.1 静态页面

静态页面是网页的代码都在页面中，不需要执行asp,php,jsp,.net等程

序生成客户端网页代码的网页。静态页面不能自主管理发布更新的页面,如果

想更新网页内容,要通过FTP软件把文件DOWN下来用网页制作软件修改（通

过fso等技术例外）。但是静态页面最大的好处是下载速度快，因为不需要程

序运算和数据库连接。常见的静态页面以.html、.htm为扩展名的。并非网

站上没有动画的就是静态页面。

[3]

1

2.1.2 动态页面

动态页面是通过执行asp、php、jsp、.net等程序生成客户端网页代码

的网页。动态页面通常可以通过网站后台管理系统对网站的内容进行更新管

理。发布新闻，发布公司产品，交流互动，博客，网上调查等，这都是动态

网站的一些功能，也是我们常见的。动态网页是需要语言环境支持的，动态

页面常见的扩展名有：.asp、 .php、 .jsp 、.cgi 等。动态页面的“动态”

是网站与客户端用户互动的意思，而非网页上有动画的就是动态页面。

动态网页是最常用的网站建设的一种表达形式，其优点在于可以根据先

前所制定好的程序界面，根据用户的不同请求返回相应的数据。可以说是一

对多的关系。从而达到资源的最大利用和节省服务器上的物理资源。如果今

后需要改变站点风格，只需要重新制作前台所访问的数据即可。只要数据库

结构不变，可以很快的进行改版的。

[4]

2.2 网页开发技术

动态网页开发技术介绍——HTML、ASP、JSP、CGI、PHP。

HTML（HyperTextMark-upLanguage）即超文本标记语言，是WWW的描述

语言。严格的来讲，HTML不能算做一门编程语言，因为它没有自己的数据类

型，也没有分支、循环等控制结构。它的设计简单，结构灵活，允许在Web

浏览器及其它兼容的应用程序中显示文本和图像，并且文档的某些部分可以

成为超链接。完成后把这些文档保存为*.html文件，然后用浏览器打开。

HTML是网络的通用语言,一种简单、通用的全置标记语言。它允许网

页制作人建立文本与图片相结合的复杂页面，这些页面可以被网上任何其他

人浏览到，无论使用的是什么类型的电脑或浏览器。

在早期，动态网页技术主要采用CGI技术，即Common Gateway

Interface(公用网关接口)。在早期，你可以使用不同的程序编写合适的CGI

程序，如Visual Basic,Delphi或C/C++等。虽然CGI技术成熟而且功能强

大，但由于编程困难，效率低下，修改复杂等缺陷，所以有逐渐被新技术取

代的趋势。

[5]

2

ASP全名Active Server Pages，是一个WEB服务器端的开发环境，利用

它可以产生和运行动态的、交互的、高性能的WEB服务应用程序。ASP采用

脚本语言VB Script（Java script）作为自己的开发语言。 ASP更精确的

说是一个中间件，这个中间件将Web上的请求转入到一个解释器中，在这个

解释器中将所有的ASP的Script进行分析，再进行执行，而这时可以在这个

中间件中去创建一个*.html文件（静态网页）。 PHP是一种跨平台的服

务器端的嵌入式脚本语言. 它大量地借用C,Java和Perl语言的语法, 并耦

合PHP自己的特性,使WEB开发者能够快速地写出动态生成页面.它支持目前

绝大多数数据库。还有一点，PHP是完全免费的。

JSP 是Sun公司推出的新一代站点开发语言，他完全解决了目前ASP,PHP

的一个通病－－脚本级执行（据说PHP4 也已经在Zend 的支持下，实现编

译运行）。Sun 公司借助自己在Java 上的不凡造诣，将Java 从Java 应用

程序 和 Java Applet 之外，又有新的硕果，就是Jsp－－Java Server Page。

Jsp 可以在Serverlet和JavaBean的支持下，完成功能强大的站点程序。

[6]

2.3 网页布局

2.3.1 网页布局的基本概念

最开始，网页呈现在你面前的时侯，它就好像一张白纸，它需要你任意

挥洒你的设计才思，可以创造出自己的设计方案。，虽然你能控制一切你所能

控制的东西，但假如你知道什么是一种约定俗成的标准或者说大多数访问者

的浏览习惯，那么你可以在此基础上加上自己的东西，这样你创造出来的网

页才能更好的被别人接受。

（1） 页面尺寸

由于页面尺寸和显示器大小及分辨率有关系，网页的局限性就在于你无

法突破显示器的范围，而且因为浏览器也将占去不少空间，留下给你的页面

范围变得越来越小。一般分辨率在800x600的情况下，页面的显示尺寸为：

780x428个象素；分辨率在640x480的情况下，页面的显示尺寸为:620X311

个象素；分辨率在1024X768的情况下，页面的显示尺寸为：1007x600。从以

3

上数据可以看出，分辨率越高页面尺寸越大。

浏览器的工具栏也是影响页面尺寸的原因。一般目前的浏览器的工具栏

都可以取消或者增加，那么当你显示全部的工具栏时，和关闭全部工具栏时，

页面的尺寸是不一样的。

在网页设计过程中，向下拖动页面是惟一给网页增加更多内容(尺寸)的

方法。除非你能肯定站点的内容能吸引大家拖动，否则不要让访问者拖动页

面超过三屏。如果需要在同一页面显示超过三屏的内容，那么你最好能在上

面做上页面内部连接，方便访问者浏览。

（2）整体造型

造型就是创造出来的物体形象，这里是指页面的整体形象。这种形象应

该是一个整体，图形与文本的接合应该是层叠有序。虽然，显示器和浏览器

都是矩形，但对于页面的造型，你可以充分运用自然界中的其它形状以及它

们的组合：矩形，圆形，三角形，菱形等。

对于不同的形状，它们所代表的意义是不同的。比如矩形代表着正式，

规则，你注意到很多ICP和政府网页都是以矩形为整体造型；圆形带表着柔

和，团结，温暖，安全等，许多时尚站点喜欢以圆形为页面整体造型；三角

形代表着力量，权威，牢固，侵略等，许多大型的商业站点为显示它的权威

性常以三角形为页面整体造型；菱形代表着平衡，协调，公平，一些交友站

点常运用菱形作为页面整体造型。虽然不同形状带表着不同意义，但目前的

网页制作多数是接合多个图形加以设计，在这其中某种图形的构图比例可能

占的多一些。

（3）页头

页头又可称之为页眉，页眉的作用是定义页面的主题。比如一个站点的

名字多数都显示在页眉里。这样，访问者能很快知道这个站点是什么内容。

页头是整个页面设计的关键，它将牵涉到下面的更多设计和整个页面的协调

性。页头常放置站点名字的图片和公司标志以及旗帜广告。

（4）文本

文本在页面中出现都数以行或者块(段落)出现，它们的摆放位置决定者

整个页面布局的可视性。在过去因为页面制作技术的局限，文本放置的位置

的灵活性非常小，而随着DHTML的兴起，文本已经可以按照自己的要求放置

4

到页面的任何位置。

（5）页脚

页脚和页头相呼应。页头是放置站点主题的地方，而页脚是放置制作者

或者公司信息的地方。你能看到，许多制作信息都是放置在页脚的。

（6）图片

图片和文本是网页的两大构成元素，却一不可。如何处理好图片和文本

的位置成了整个页面布局的关键。而你的布局思维也将体现在这里。

（7）多媒体

除了文本和图片，还有声音，动画，视频等等其它媒体。虽然它们不是

经常能被利用到，但随着动态网页的兴起，它们在网页布局上也将变得更重

要。

2.3.2网页布局方法

网页布局的方法有两种，第一种为纸上布局；第二种为软件布局。下面

分别加以介绍。

（1）纸上布局法

许多网页制作者不喜欢先画出页面布局的草图，而是直接在网页设计器

里边设计布局边加内容。这种不打草稿的方法不能让你设计出优秀的网页来。

所以在开始制作网页时，要先在纸上画出你页面的布局草图来。

首先，尺寸的选择。目前一般800X600的分辨率为约定俗成的浏览模式。

所以为了照顾大多数访问者，你页面的尺寸以800X600的分辨率为准。

其次，造型的选择。先在白纸上画出象征浏览器窗口的矩形，这个矩形

就是你布局的范围了。选择一个形状作为整个页面的主题造型，我们选择圆

形，因为它代表者柔和，和时尚流行比较相称，然后在矩形框架里随意画出

来，你可以试者在增加一些圆形或者其它形状。这样画下来，你会发现很乱。

其实，如果你一开始就想设计出一个完美的布局来是比较困难的，而你要在

这看似很乱的图形中找出隐藏在其中的特别的造型出来。还要注意一点，你

不要担心你设计的布局是否能够实现。事实上，只要你能想到的布局都能靠

现今的HTML技术实现。如图2-1和图2-2

5

图2-1 手绘布局图 图2-2 布局图

考虑到左边向左凹的弧线，为了取得平衡我们在页面右边增加了一个矩

形，(也可以是一条线段) 如图2-3。

6

图2-3 布局图的改善

然后，增加页头。一般页头都是位于页面顶部，所以我们为图3增加了

一个页头，为了和左边的弧线和右边的矩形取得平衡，我们增加了一个矩形

页头并让页头相交与左边的弧线，如图2-4。

图2-4 页头的图示

然后，增加文本。页面的空白部分加别加入文本和图形。因为在页面右

边有矩形作为陪衬，所以文本放置在空白部分不会因为左边的弧线而显得不

7

协调，如图2-5。

图2-5 文本的图示

最后，增加图片。图片是美化页面和说明内容必须的媒体。在这里把图

片加入到适当的地方，如图2-6。

图2-6 图片的图示

经过以上的几个步骤，一个时尚页面的大概布局就出现了。当然，它不

是最后的结果，而是你以后制作时的重要参考依据。

8

（2）软件布局法

除了纸上布局，还可以利用软件来完成这些工作。如利用Photoshop。

Photoshop所具有的对图像的编辑功能用到设计网页布局上更显得心应手。

利用Photoshop可以方便的使用颜色，使用图形，并且可以利用层的功能设

计出用纸张无法实现的布局意念。

2.3.2 网页布局技术

（1）层叠样式表的应用

在新的HTML4.0标准中，CSS(层叠样式表)被提出来，它能完全精确的定

位文本和图片。CSS有点复杂，但它的确是一个好的布局方法。曾经无法

实现的想法利用CSS都能实现。目前在许多站点上，层叠样式表的运用是一

个站点优秀的体现。比如一些企业网站。

（2）表格布局

表格布局被广泛使用，已经成为一个潜在的标准。随便浏览一个站点，

它们一定是用表格布局的。表格布局的优势在于它能对不同对象加以处理，

而又不用担心不同对象之间的影响。而且表格在定位图片和文本上比起用

CSS更加方便。表格布局唯一的缺点是，当你用了过多表格时，页面下载速

度受到影响。对于表格布局，打开一个站点的首页，然后保存为HTML文件，

利用网页编辑工具打开它(要所见即所得的软件)，会可以看到这个页面是如

何利用表格的。

（3）框架布局

由于它的兼容性，框架布局并没有被所有人接受。但从布局上考虑，框

架结构不失为一个好的布局方法。它如同表格布局一样，把不同对象放置到

不同页面加以处理，因为框架可以取消边框，所以一般来说不影响整体美观。

[8]

[7]

2.4网页配色

网站充斥着枯燥的设计，惠普、IBM、戴尔、微软，以及其他数不尽的网

站（相似的布局，相似的配色）。这样一种标准化的界面可以使浏览更方便，

9

但同时带给用户一种很世俗的体验，并不能与访客产生一种积极的联系。

面对这种单调的设计，有一种解决方法，就是使用颜色。可能没有其他

设计元素能像颜色一样能影响人们对世界感受。颜色可以瞬间改变我们的情

绪和意见。颜色会让我们感觉到舒适、敬畏，或者激动。在界面设计中，

颜色组合对设计非常有用。可以区分设计让用户更加难忘、引导用户使用户

专注于交互、吸引用户使页面布局更舒适，更有魅力。

一旦有机会可以让网站更独特，就不能放弃。如果你的网站做的很醒目，

那么用户可能会花更多时间浏览并且想是从哪里访问过来的，他们有可能记

住这个网站并且下次再访问。可能没有比颜色更好的元素可以达到这样的效

果了。人们会马上对颜色产生感觉：激动、高兴或者枯燥乏味。

当你试图在一个充满饱和色调的页面上浏览信息时，你的眼睛会不断地

返回那些亮的颜色。最强的视觉元素是最重要的。我们趋向于忘记那些深蓝、

黄色和灰色，因为每天都看到。在那些用户需要长时间在线使用的 Web 应

用程序中，注意这一点尤为重要。不是很强烈的配色可以使用户专注于工作

和接收重要信息。当然完美的 Web 体验不能仅仅依靠颜色，结构、交互、

布局等方面也必须协同工作，来创建可用、易用的网站和应用程序。但是颜

色是平衡中的重要部分，不能忽略。

[9]

2.5 网页设计流程

网页设计是一个互动的过程，不仅是设计师构思设计就可以完成的。从

客户提出需求到最终发布，期间需要客户与设计人员共同参与协商才可以，

具体流程如下：

首先，获取客户需求和资料。

在设计网站页面之前，设计师需要知

道客户的需求，从而确定客户建立网站的目的。客户提出网站需求是非常重

要的一个环节。没有详细的需求，设计人员无法凭空进行设计制作。在这个

步骤中，双方的沟通与交流是非常重要的。

其次，确定网站内容。

设计人员选择适合自己的图像编辑软件、动

画制作软件和网页制作软件进行网页的初步设计，这中间可能还需要和客户

进行多次沟通才能达到客户满意的效果。在具体设计时，设计人员应该为网

10

站定位一个主题，从而保证所有网页都围绕这个主题进行设计制作，保证风

格的和谐统一。

然后，申请域名和空间。

使用该方法能够有效同步管理文件。还可

以通过FTP软件连接到服务器空间上，然后上传发布文件。

最后，后期维护。

一般静态网站上传后，如果客户方没有专业人员维

护，这样就需要设计人员从客户方获取新资料进行定期或不定期的更新。如

果是动态网站，设计人员需要负责培训客户方如何使用后台管理，这样客户

就可以自己通过后台管理添加信息，设计人员只要及时更正动态网站的错误

即可。

3 动态网页开发环境和技术

3.1 了解Dreamweaver开发工具

Dreamweaver是美国MACROMEDIA公司开发的集网页制作和管理网站于一

身的所见即所得网页编辑器，它是第一套针对专业网页设计师特别发展的视

觉化网页开发工具，利用它可以轻而易举地制作出跨越平台限制和跨越浏览

器限制的充满动感的网页

[10]

。 Dreamweaver的特点如下：

最佳的制作效率：Dreamweaver可以用最快速的方式将Fireworks或

Photoshop等档案移至网页上。Dremweaver能与您喜爱的设计工具，如Flash

等和外挂模组等搭配，不需离开Dremweaver便可完成，整体运用流程自然顺

畅。除此之外，只要单击便可使Dreamweaver自动开启Firework或Photoshop

来进行编辑与设定图档的最佳化。

网站管理：使用网站地图可以快速制作网站雏形，设计，更新和重组网

页。改变网页位置或档案名称，Dreamweaver会自动更新所有连结。使用支

援文字，HTML码，HTML属性标签和一般语法的搜寻及置换功能使得复杂的网

站更新变得迅速又简单。

无可比拟的控制能力：Dreamweaver是唯一提供Roundtrip HTML、视觉

化编辑与原始码编辑同步的设计工具。它包含HomeSite和BBEdit等主流文

11

字编辑器。帧(frames)和表格的制作速度快的令您无法想像。进阶表格编辑

功能使您简单的选择单格、行、栏或作未连续之选取。甚至可以排序或格式

化表格群组，Dreamweaver支援精准定位，利用可轻易转换成表格的图层以

拖拉置放的方式进行版面配置。

所见即所得：Dreamweaver成功整合动态式出版视觉编辑及电子商务功

能，提供超强的支援能力给Third-party厂商，包含ASP， Apache，

BroadVision， Cold Fusion，iCAT， Tango与自行发展的应用软体。当您

正使用Dreamweaver在设计动态网页时，所见即所得的功能，让您不需要透

过浏览器就能预览网页。

梦幻样版和XML：Dreamweaver将内容与设计分开，应用於快速网页更新

和团队合作网页编辑。建立网页外观的样版，指定可编辑或不可编辑的部份，

内容提供者可直接编辑以样式为主的内容却不会不小心改变既定之样式。您

也可以使用样版正确地汇入或输出XML内容。

全方位的呈现：利用Dreamweaver设计的网页，可以全方位的呈现在任

何平台的热门浏览器上。对于动态HTML支援和鼠标换图效果，声音和动画的

DHTML效果资料库可在Netscape和Microsoft浏览器上执行。使用不同浏览

器检示功能，Dreamweaver可以告知您在不同浏览器上执行的成效如何。当

有新的浏览器上市时，只要从Dreamweaver的网站在下载它的描述档，便可

得知详尽的成效报告。

3.2 Php语言基础知识

PHP（Hypertext Preprocessor）是一种嵌入HTML页面中的脚本语言。

它大量地借用C和Perl语言的语法， 并结合PHP自己的特性，使Web开发

者能够快速地写出动态产生页面

[11]

。

PHP是完全免费的开源产品，不用花钱，Apache和MYSQL也是用样免费

开源，在国外非常流行，PHP和MYSQL搭配使用，可以非常快速的搭建一套

不错的动态网站系统，因此国外大多数主机系统都配有免费的APACHE＋PHP

＋MYSQL。通常认为这种搭配的执行效率比IIS＋ASP＋ACCESS要高，而后者

的使用还必须另外交钱给微软。

12

PHP的语法和Perl很相似，但是PHP所包含的函数却远远多于Perl，PHP

没有命名空间，编程时候必须努力避免模块的名称冲突。一个开源的语言虽

然需要简单的语法和丰富的函数，但PHP内部结构的天生缺陷导致了PHP不

适合于编写比中小型业余网站更大的网站

[12]

。

PHP开发的成功案例：MediaWiki — 著名的维基百科（Wiki）程序，如

此庞大的条目居然只用PHP＋MYSQL就能够支持，真是不可思议。WordPress

— 著名的Blog系统，功能上丝毫不输于Movable Type，不少用户都纷纷从

Movable Type转移到了WordPress。

总之，PHP语法简单，非常易学易用，很利于快速开发各种功能不同的

定制网站，PHP因为结构上的缺陷，使的PHP在复杂的大型项目上的开发和

维护都比较困难。

它是一种服务器端的脚本语言，嵌入在HTML中，它可以在多种平台上运

行。其语法与C语言、Java语言的语法相似。它具有庞大的函数库，这主要

是因为它是开源式的，源代码完全公开，每个使用PHP的程序员都可以加入

自己的函数库，从而实现更多的功能，PHP几乎支持所有的数据库。

但是PHP对组件的支持不够完善，扩展性较差，常与免费的数据库系统

MySQL一起构建中小型B/S应用的网站或信息系统

[13]

。

3.3 开发环境介绍

如果仅仅需要编辑静态的HTML网页，那么安装和配置服务器不是必需

的，因为HTML页面的运行无需服务器的支持，但是如果需要在本地测试Php

或者等动态网页，那么服务器的支持是必不可少的。

Apache本身是一个开源组织的名称，它组织开发了许多优良的开源软

件，其中最早的项目便是Apache HTTP Server,一个开源的免费的Web服务

器

[14]

。

Apache HTTP Server是Apache Software Foundation的一部分，除了

官方的开发人员以外还有数以百计的用户参与开发，他们可以提供自己的意

见、代码及文档等。Php最初员就是基于Apache开发的，所以它与Apache

有良好的兼容性。

13

4 设计及具体代码实现

本网页是一个关于新疆旅游的网页，其主要实现了新疆线路介绍、新疆

景点介绍、新疆小吃介绍、游客注册、游客登录及退出、游客留言等功能。

4.1网页结构设计

css+div结构目前用的人最多，框架结构现在很少有人使用了，而表格

结构目前用的人也不多，但并不意味着已经被淘汰，它也有DIV所不能取代

的效果—— 方便快速的布局，只要不是经常改动的小部分就可以用表格。

DIV可以与表格一起用，大布局用DIV，而小地方就用表格 ，效果会很好。

比如本次论文所涉及的网页就用到了表格与css+div相结合的思想，其上、

下、左、右和中间分别是一个单独的div模块。具体框架结构如图4-1。

图4-1 网页框架图

14

4.2创建数据库

本论文设计的网页，所用到的数据库test是通过数据库管理工具—

—PhpMyAdmin做的，具体创建过程就不在这一一介绍了。其包含两个表分别

为：liuyan、test2，如图4-2和4-3。

图4-2 信息存储表1

本表主要存储游客名、游客留言内容和留言时间等数据。

图4-3 信息存储表2

15

本表主要存储数据有：游客注册名、性别、年龄、学历、专业、爱好、

备注、密码（密码就是注册时，所输入的验证码）和注册时间。

4.3主要模块的代码实现

4.3.1 注册代码的实现

if($_POST['name'])

{

include("");

$up=$_FILES["tx"];

$hh=$up['type'];

$fff=$up['tmp_name'];

$yu=$up['name'];

//获得客户端和服务器端的验证码。

$host=$_SERVER['HTTP_HOST'];

$host= md5($host);

$cookie_=$_COOKIE[$host];

@session_start();

$y=$_SESSION[$cookie_];

$y_d=$_POST['yz'];

/*。。。。。。。。。。。。。。核对客户端和服务器端的验证码库。。。。。。。。。。。。。。*/

if($y_d===$y)

{

/*。。。。。。。。。。。。。。。。。。。查询数据库中的资源个数。。。。。。。。。。。。。。。。。。。*/

$dd=mysql_query("SELECT * FROM `test2`");

$hang=mysql_num_rows($dd);

$hang=$hang+1;

/*。。。。。。。。。。。。。。values后不能有空格。

16

(id,name,sex,age,diploma,speciality,like,remark,mima,enrolDate)。。。。。。。。。。。*/

$sql="insert into test2

values($hang,'{$_POST[name]}','{$_POST[sex]}',{$_POST[age]},".

"'{$_POST[diploma]}','{$_POST[speciality]}','{$_POST[like]}','{$_POST[rema

rk]}','{$_POST[yz]}',now())";

/*。。。。。。。。。。。。。。。。。。。。。。。。检测是否插入成功。。。。。。。。。，。。。。。。。。。*/

if(@mysql_query($sql,$conn))

{

if($hh=="image/pjpeg"||$hh=="image/gif"||$hh=="image/png"||$hh=="image/bm

p"||$hh=="image/jpg"||$hh=="image/jpeg")

{

@move_uploaded_file($fff,'E:/zhandian/zhandian1/sousuo/touxiang/'.$_POST['n

ame'].'.jpg');//目录地址不能用反斜杠''。

}

echo "";

}

else {echo "";}

}

else{ echo "";}

}

@mysql_close($conn);

?>

这段代码主要是将游客注册信息插入到test2表，如果游客注册成功，

会弹出一个注册成功提示框“注册成功,您是第***位注册用户!”。如果没能

注册成功，则会弹出一个注册失败提示框“对不起,您未能注册成功!”或“对

不起您未能注册成功,因为您输入的验证码不正确或右侧的验证码已经失

效。”,（出现此提示是因为游客在注册时，由于停留时间过长，对应的session

17

已经不存在了）如图4-4所示。

图4-4 注册界面

4.3.2 登陆及退出登录代码的实现

header('Content-Type:text/html;charset=GB2312');

include("");

$g=mysql_query("SELECT * FROM `test2` WHERE

name='{$_GET[username]}' and mima='{$_GET[mima]}'");

$h=mysql_query("SELECT * FROM `test2` WHERE mima='{$_GET[mima]}'

and name!='{$_GET[username]}'");

$j=mysql_query("SELECT * FROM `test2` WHERE

name='{$_GET[username]}' and mima!='{$_GET[mima]}'");

$hang=mysql_num_rows($g);

$hang_1=mysql_num_rows($h);

$hang_2=mysql_num_rows($j);

if($hang){

$host=$_SERVER['HTTP_HOST'];

18

$host= md5($host);

$cookie_=$_COOKIE[$host].$_COOKIE[$host];

@session_start();

$_SESSION[$cookie_] = $_GET[username];

echo "

}

else{

if($hang_1){

echo '用户名有误';

}

else{

if($hang_2){

echo '密码有误';

}

else{

echo '用户名和密码都有误';

}}}?>

这段代码主要是检测游客登录时，所提交的用户名和密码。如果表test2

中有游客所提交的游客名，但没有游客所提交的密码，则会输出一个错误提

示信息“密码有误”。如果表test2中有游客提交的密码，但没有游客提交的

用户名，则会输出一另一个错误信息“'用户名有误”。如果表test2中既没

有游客提交的游客名，也没有游客所提交的密码，则会输出“用户名和密码

都有误”。如果表test2中既包含游客提交的游客名，又包含游客提交的密码，

则输出“欢迎***登陆！”信息，并把游客的名字存入到一个名为$cookie_的

SESSION中。

header('Content-Type:text/html;charset=GB2312');

$host=$_SERVER['HTTP_HOST'];

19

$host= md5($host);

$cookie_=$_COOKIE[$host].$_COOKIE[$host];

@session_start();

$_SESSION[$cookie_] = "";

?>

这段代码主要是将值为要退出的游客名的SESSION设为空,登陆界面如图

4-5：

图4-5 登陆界面

4.3.3留言代码的实现

header('Content-Type:text/html;charset=GB2312');

include("");

//获得客户端和服务器端的密码。

$host=$_SERVER['HTTP_HOST'];

$host= md5($host);

$cookie_=$_COOKIE[$host].$_COOKIE[$host];

@session_start();

$y=$_SESSION[$cookie_];

if($y)

{

/*。。。。。。。。。。。。。。查询数据库中的资源个数。。。。。。。。。。。。。。。*/

20

$dd=mysql_query("SELECT * FROM `liuyan`");

$hang=mysql_num_rows($dd);

$hang=$hang+1;

$sql="insert into liuyan values($hang,'{$y}','{$_GET[liuyan]}',now())";

/*。。。。。。。。。。。。。。。。。。检测是否插入成功。。。。。。。。。。。。。。。。。。。。。。。。*/

if(@mysql_query($sql,$conn))

{

echo $hang;

}

else {echo "留言失败";}

}

else{ echo "还没登陆";}

@mysql_close($conn);

?>

这段代码主要是将游客提交的留言内容插入到表liuyan中，如果游客留

言信息被成功插入，则会输出插入位置（游客是第几位留言的）。如果插入失

败。则会输出错误提示信息“留言失败”或“还没登陆”,（当游客还没登录

时就留言，会输出此错误信息）留言界面如图4-6。

图4-6 留言界面

21

4.4运行测试

我们以游客张山为例，来测试一下本网页的几个主要功能模块。（游客注

册、游客登录和游客留言）

4.4.1 注册

当游客张山输入注册信息时，界面如图4-7：

图4-7 注册界面

当游客张山提交信息成功后，将会弹出一个成功提示信息，如图4-8：

22

图4-8 提示界面

当我们查看数据库test中的表test2时，会发现其多了一条关于张山的

游客信息。如图4-9：

如图4-9 注册后的数据库图

4.4.2 登陆

当张山把名字和密码输入时，登陆界面如图4-10：

图4-10 登陆界面

当张山以正确的名字和密码登陆后，出现提示，如图4-11：

23

图4-11 提示界面

4.4.3留言

当张山写入留言时，留言界面如图4-12：

图4-12 留言界面

当张山成功将留言内容提交后，会弹出一个留言成功提示框，如图4-13：

24

图4-13 成功留言界面

当我们查看数据库test中的表liuyan时，会发现其多了一条有游客张

山所写的留言内容，如图4-14：

图4-14 留言图

4.5遇到的问题及解决方法

在本次论文设计中主要遇到两个大问题。

第一，在输出注册框时出现了乱码。

解决方法是:在要输出的注册框代码的开头处加上这么一段代码

header('Content-Type:text/html;charset=GB2312');

第二，在游客留言时，游客已经退出了登录，但还能以此游客名进行留

言。

解决方法是：在游客登录时，在后台创建一个名为$cookie_（此名是有

游客电脑中的关于本网页的cookie值相加得到的。）的session，将游客名

25

存入其中。在用户退出登录时，就其值设为空（因为游客在提交留言时，会

有一个专门的动态网页首先查看后台服务器中有没有名为$cookie_的

session或其值是否为空，如果其不存在或值为空，则就说明此游客还没有

登录，就会有相应的提示框弹出。）。

总结：在制作本次论文所涉及的网页时，大大小小也遇到的不少问题，

但主要的问题也就这两个，这些问题都是通过查阅一些相应的查考文献来一

一解决的。

26

结 束 语

本设计根据毕业设计任务书的要求制作，功能基本实现，可以完成登陆、

注册、留言、各产品展示等功能的实现。此次设计是查看了一些企业网站的

结构然后进行设计的，虽然此次设计构造不能说是成熟，但也算是尽了力。

这是我首次运用Dreamweaver、Php语言结合PhpMyAdmin数据库系统开

发工具进行动态网页的制作，一切都是从零开始学习，所以制作的时候难免

会过于简单，考虑的也不是很周全。同时由于时间的仓促，有些功能的实现

不是很完美。在设计过程中不可避免地遇到了各种各样的问题，由于整个设

计完全都是由个人设计的，有关Dreamweaver、Php和数据库连接等方面许多

细节问题都要靠自己去摸索，加之本人水平有限，因此还存在着许多不足之

处。

在以前的时间内我学习了许多专业课程，比如C语言，java语言，数据

库系统概论，FLASH等等，虽然通过学习对这些课程有所了解和掌握，但是

始终处于理论知识的掌握阶段，并没有真正应用于实践设计开发，所以对知

识的掌握还不够全面和熟练，并不能真正独立的开发出一个完整的应用于实

际的系统。通过这次毕业设计，使我学到了很多，对自身的能力有了很大的

提高。此次设计是动态网页设计，而不是简单的静态网页，因此采用了在开

发动态网页方面比较先进的Php语言作为开发语言。Php是一种Web编程脚

本语言。当然在制作的过程中碰到过一些让人头痛的问题，我都一一解决了，

直到设计全部完成，也让我在解决问题方面的能力得到了提高。

整个开发的过程对我来说是一次将理论应用于实践的过程，是将以前所

学知识充分利用的过程，是一次真正的实践过程。

总体说来，在这学期的毕业设计中，学到了一些在课堂内所学不到的知

识，收获很大。

27

致 谢

首先感谢我的指导老师杨老师，他在我的毕业设计过程中给了

指导性的方案和架构，指引我阅读相关的资料和书籍，使我能学习

掌握知识并完成了毕业设计。

感谢答辩组对此毕业设计的考核，如果可以得到答辩组各位老

师的认可将对我的学习和工作给予极大的鼓励。你们客观的评价和

建议我将牢记在心，在今后的发展中扬长避短，更加努力的严格要

求自己。

感谢学校对我的培育，让我从思想上、素质上和知识上得到很

大的提高。在校学习的过程中的各科老师的悉心教导让我掌握了更

多的知识，对提高我的知识面有很大的帮助。

最后要感谢我的同学在设计完成前后对我的帮助，没有同学的

共同学习进步也许就没法完成设计，没有同学的帮助，也许一些潜

在的错误难以得到更正，在此一并表示感谢。

在此祝愿学校领导、老师、同学工作顺利，事业更上一层楼；

同时也祝愿学校更加辉煌！

- 28 -

参考文献

[1].吕洋波. Dreamweaver+Php动态网站开发从入门到精通.北京:

清华大学出版社,2007.6

[2].宗杰 马国强 刘冉.PHP网络编程. 北京:电子工业出版社，

2008,6

[3].张洪涛，邢璐.

HTML & XHTML权威指南(第六版)

.北京：清华大

学出版社，2007.4

[4].刘梅彦.

动态网页制作教程.北京:清华大学出版社，2004.9

[5].Elisabeth Freeman,Eric First HTML with Css &

XHTML .北京：东南大学出版社，2006.5

[6]. (澳)Quentin Web 2.0开发实战.北京：人民邮电

出版社，2008.10

[7].王大平.

Css网页布局.北京:电子工业出版社,2008.10

[8].Eric A．ing Style Sheets:The Definitive

Guide(Css权威指南)．北京：中国电力出版社，2001.5

[9].李东生.深入精髓：Dreamweaver网页设计与配色技术精粹.北

京:清华大学出版社,2007.6

[10].黄雷 杨志 游坤.Php+HTML+ Dreamweaver+Mysql开发动态网

站实例荟萃.北京:机械工业出版社,2006.2

[11].(美)厄尔曼(Ullman,L.) .PHP6与MySQL5基础教程.北京：

人民邮电出版社，2008.11

[12].(澳)LUKE WELLING;LAURA 和MySQL

Web开发. 北京：机械工业出版社，2009.2

[13].王健南.Php数据库管理项目方案精解.北京:航空工业出版

社,2006.10

[14].

蔡文凯.

Apache Cookbook中文版(第2版).北京：电子工业

出版社，2009.1

本文标签： 网页设计页面布局网站