三味書屋購書系統(tǒng)設計與實現(xiàn)論文

1、 三味書屋購書系統(tǒng)設計與實現(xiàn) 1 引言1.1 選題背景20世紀末，隨著計算機科學的發(fā)展，數(shù)據(jù)庫技術在internet中的應用越來越廣泛，為廣大網絡用戶提供了更加周到和人性化的服務。個性化已逐漸成為當今web應用的潮流。本文研究了一種基于數(shù)據(jù)關聯(lián)規(guī)則網上書店系統(tǒng)，此方案與現(xiàn)今網上已采用的一些方案相比，具有用戶使用更簡單、界面更直觀等優(yōu)點。網上書店在我國剛起步，但發(fā)展很快。隨著我國互聯(lián)網的更加普及和網上書店的更趨成熟，會有越來越大的消費群體，市場潛力會得到充分發(fā)揮。網上書店正是依靠internet這個載體才得以發(fā)展和不斷的成熟起來，并對產品的銷售和物品的購買展示出了一種嶄新的理念。1.2 目的和意

2、義網上書店管理系統(tǒng)主要是處理網上購書和庫存的系統(tǒng)，提供具有圖書分類檢索和搜索，購物車管理，在線訂單，書籍推薦等功能和強大的后臺管理功能，提供高效、安全、智能化的數(shù)據(jù)管理，從而提高整個網上書店各項功能管理水平。通過網上書店管理系統(tǒng)，可以做到信息的規(guī)范管理、科學統(tǒng)計和快速查詢，從而減少管理方面的工作量,有效地提高網上購書的效率。2. 基于b/s模式系統(tǒng)的實現(xiàn)技術2.1 開發(fā)技術與實現(xiàn) 目前，最常用的三種動態(tài)網頁語言有asp(active server pages),jsp(javaserver pages),php (hypertext preprocessor)。這里主要用到asp.net，以下

3、是對asp.net開發(fā)語言的介紹asp.net 是一種建立在通用語言上的程序構架，能被用于一臺web服務器來建立強大的web應用程序。asp.net提供許多比現(xiàn)在的web開發(fā)模式強大的優(yōu)勢。asp.net是基于通用語言的編譯運行的程序，所以它的強大性和適應性，可以使它運行在web應用軟件開發(fā)者的幾乎全部的平臺上（筆者到現(xiàn)在為止只知道它只能用在windows 2000 server上）。通用語言的基本庫，消息機制，數(shù)據(jù)接口的處理都能無縫的整合到asp.net的web應用中。asp.net同時也是language-independent語言獨立化的，所以，你可以選擇一種最適合你的語言來編寫你的程序

4、，或者把你的程序用很多種語言來寫，現(xiàn)在已經支持的有c#（c+和java的結合體），vb，jscript。將來，這樣的多種程序語言協(xié)同工作的能力保護您現(xiàn)在的基于com+開發(fā)的程序，能夠完整的移植向asp.net。簡單講，asp是位于服務器端的腳本運行環(huán)境，通過這種環(huán)境，用戶可以創(chuàng)建和運行動態(tài)的交互式 web 服務器應用程序，如交互式的動態(tài)網頁，包括使用 html 表單收集和處理信息，上傳與下載等等。更重要的是，asp使用的activex技術基于開放設計環(huán)境，用戶可以自己定義和制作組件加入其中，使自己的動態(tài)網頁幾乎具有無限的擴充能力，這是傳統(tǒng)的web編寫工具所遠遠不及的地方。使用asp還有個好處，

5、就在于asp可利用ado(active data object,微軟的一種新的數(shù)據(jù)訪問模型)方便快捷地訪問數(shù)據(jù)庫,從而使得開發(fā)基于www的應用系統(tǒng)成為可能，這也是本文選擇asp作為開發(fā)工具最重要的原因之一。2.2 net環(huán)境介紹本系統(tǒng)主要用到了visual studio開發(fā)工具中的.net技術。.net是microsoft面向xml web服務的平臺，通過 .net 框架的公共語言運行庫，.net 平臺使各種 xml web services 能夠交互操作，而不管其源語言的不同。開發(fā)人員可以生成可重用的 xml web services，而不是生成單個應用程序。vs.net建立并集成web s

6、ervices和應用程序的快速開發(fā)工具，使開發(fā)網站更方便，只需要簡單的通過手動添加組件就可以輕松的完成網站的架設。結合本系統(tǒng)主要是開發(fā)基礎頁面的特點，所以選擇.net開發(fā)環(huán)境。2.3 運行環(huán)境和開發(fā)工具的選擇2.3.1 開發(fā)環(huán)境windows server 2005系統(tǒng)運行平臺，iis6.0web服務器和腳本解釋器，ie8.0瀏覽器，microsoft visual studio2005, direcx9.0系統(tǒng)插件和sql server2005企業(yè)版。2.3.2 開發(fā)工具1.vistual studio 的選擇v isual studio的visual studio產品和.net框架將全方位

7、的大幅提高應用軟件開發(fā)的各個方面。這個產品將會提高開發(fā)者的生產效率、語言創(chuàng)新的特性、.net框架的改進、企業(yè)開發(fā)的擴展支持，將會被visual studio集成開發(fā)環(huán)境全部表現(xiàn)出來。visual studio更深層次的整合和支持 sql server。sql server yukon也在數(shù)據(jù)庫引擎中整合了公共語言運行時(clr)的功能，將數(shù)據(jù)庫和工具的結合提高到新水平。visual studio不僅讓開發(fā)者能用visual basic和c#編寫存儲過程，而且進一步減少了開發(fā)數(shù)據(jù)中心應用軟件所需的編碼和勞動?，F(xiàn)在我們利用iis+.net構成三層式web結構的中間一層，將客戶機/服務器結構與web

8、密切結合，完成前后端兩者的集成輸出功能，使得web站點的開發(fā)更方便，實現(xiàn)的功能更強大。如下圖數(shù)據(jù)服務視圖所示程序和計算邏輯前端瀏覽器activex server元件activex server元件后端數(shù)據(jù)庫數(shù)據(jù)庫服務器microsoft iis + .net瀏覽器2.數(shù)據(jù)庫sql server的選擇sql對大中小型數(shù)據(jù)庫系統(tǒng)應用都和合適，安全性較高，而且所使用的數(shù)據(jù)控制語句也非常的簡單，應用所有的數(shù)據(jù)時，僅需要使用9個關鍵詞，所以學習和使用都是極其的方便。可以選擇 ms sql server 2005，主要優(yōu)點有：1、相對mysql oracle sybase db2，sql server性價

9、比最好；2、和.net集成比較好，很合適用于windows應用的后臺數(shù)據(jù)庫；3、ms sql server 2005安全性得到了很大增強；4、管理和開發(fā)入手都比較3. 過程論述3.1 需求分析3.1.1前臺功能1、新客戶注冊：普通用戶必須先注冊,才能進行圖書的查詢、瀏覽、定購、信息反饋等操作。用戶需要注冊,并且要得到系統(tǒng)管理的審批和確認,主要功能是對用戶個人基本信息的管理。2、書籍分類搜索：用戶可根據(jù)對書籍的分類瀏覽和輸入關鍵字進行本站包含書籍的查找瀏覽。3、實現(xiàn)購物車功能模塊：實時顯示用戶當前所購書目，可以增加或刪除4、訂單查詢功能：客戶確認購買號即生成一個唯一的訂單號，客戶依此號碼可以查詢

10、所購書目到書情況。5、前臺頁面管理：注冊會員對自己資料的修改，賬戶的管理和書籍收藏夾的管理。3.1.2后臺管理實現(xiàn)功能1、管理員登陸：網站管理人員登陸，實現(xiàn)對系統(tǒng)后臺的管理，對系統(tǒng)所有信息的控制。還需要對系統(tǒng)進行維護,同時還對普通用戶和商家的基本信息進行管理。2、訂單添加/刪除/修改管理功能：對于用戶提交的訂單進行審核，并實現(xiàn)對訂單的添加/刪除/修改管理。3、書籍信息管理：這主要分為出版社管理，類別設置和分類管理。其中，出版社管理可以增加或修改刪除相關信息，請確保此處信息的真實性；類別設置可對書目類別進行相應的操作（增加，刪除，修改）；分類管理可以對相關圖書進行分類操作（注：此操作可以在圖書入

11、庫的時候進行選擇）3.2書店的總體設計3.2.1購物主要處理流程根據(jù)需求分析，本系統(tǒng)主要實現(xiàn)兩大管理模塊：前臺的圖書管理和后臺的管理。前臺的圖書管理主要用于通過internet向普通瀏覽者提供圖書的一些基本信息，而后臺主要是實現(xiàn)用戶的管理以及對圖書信息的管理。系統(tǒng)的功能特點如下：1、頁面模塊化：系統(tǒng)界面的設計使用模塊進行處理，如把頁面的頭、尾頁面內容，數(shù)據(jù)庫的連接等做成單獨的文件，在其它頁面設計中需要時可以把其他頁面的相應的內容包括進去了，這樣有利于頁面風格比較統(tǒng)一以及提高開發(fā)系統(tǒng)的效率。2、圖書信息模板的應用：本系統(tǒng)的圖書信息代碼的生成是基于模塊的，更換圖書信息內容時只要將圖書新的一些必要的

12、信息錄入，然后自動修改圖書信息的模板。3、功能較完善，管理方便：功能方面包括圖書產品的展示、用戶注冊及登錄、圖書的在線查詢、定購等各個方面，完整地實現(xiàn)了網上書店的管理要求，同時由于應用了模板，對系統(tǒng)的管理維護非常方便。因此得用戶登陸網站后購物的主要處理流程如下：登錄界面老用戶登錄新用戶注冊填寫個人信息注冊成功密碼驗證選購商品是否結算n放入購物車nyy商品結算瀏覽檢索商品選購商品是否登錄瀏覽檢索商品服務商處理訂單收到貨款服務商發(fā)貨服務商銷毀訂單nnnyyy客戶購物流程圖3.2.2數(shù)據(jù)庫設計由需求分析和數(shù)據(jù)處理流程，畫出網絡書店的e-r圖如下圖所示：系統(tǒng)主要涉及到兩類用戶即為網絡書店的用戶及管理，

13、還有圖書的基本信息等。當?shù)贸鰁-r后，就開始了對數(shù)據(jù)庫設計，由數(shù)據(jù)字典可設計出系統(tǒng)的整個數(shù)據(jù)庫的數(shù)據(jù)訪問層是一組封裝了對數(shù)據(jù)庫進行各種操作(連接數(shù)據(jù)庫、查詢記錄、刪除記錄、添加記錄、關閉連接等)的類。根據(jù)數(shù)據(jù)庫的設計, 確定數(shù)據(jù)庫的模式結構。在服務器上創(chuàng)建一個名為book的數(shù)據(jù)庫。包括以下表：商店圖書表my_book，商店圖書類別表my_bookclass, 商店管理員表 my_bookadminuser, 購書用戶表my_users, 購物車訂單號表 my_indent, 購物車訂單貨物列表 my_indentlist,。下面將具體介紹數(shù)據(jù)庫中表的結構。1.商店圖書表my_book商店圖書表

14、，主要用來存放圖書信息，表名為my_book,主鍵為id。這里存放的是圖書的具體信息，包括書名，作者，出版社，目錄，書價，書編號等信息圖書信息。表1 商店圖書表字段名字段類型長度null說 明idint2否id序列號booknamevarchar20否書名bookclassint否圖書類別authorvarchar25作者publishvarchar150出版社booknovarchar30書號contentvarchar4000內容介紹princefloat書價amountint總數(shù)量leav_numberint剩余數(shù)量regtimedatetime否登記時間2.圖書類別表my_bookcl

15、ass圖書類別表,這個表項對圖書進行了分類，按編號分類別，表名為my_bookclass，主鍵為id，設置圖書類別表的存放數(shù)據(jù)信息。表2 圖書類別表字段名字段類型長度null說 明idint4否id序列號classnamevarchar30否圖書類別名3.商店管理員表 my_bookadministrator商店管理員表，用來存放商店管理員的用戶名和密碼等，表名為my_bookadminuser，主鍵為adminuser，本表是用來存儲管理員的密碼表3 商店管理員表字段名字段類型長度null說 明adminuservarchar20否管理員用戶名adminpassvarchar50否管理員密碼

16、4.購書用戶表my_users購書用戶表，用來存放購書用戶的信息，表名為my_users,主鍵為id，具體存放的數(shù)據(jù)信息，主要保存用戶的詳細信息表4 購書用戶表字段名字段類型長度null說 明idint4否id序列號usernamevarchar20否購物用戶名passwordvarchar50否用戶密碼namesvarchar20用戶聯(lián)系用姓名addressvarchar150用戶聯(lián)系地址phonevarchar25用戶聯(lián)系電話postvarchar8用戶聯(lián)系郵編5.購物車訂單表my_indent購物車訂單表，存放購物車訂單的信息，表名為my_indent，主鍵為id，購物車訂單表的數(shù)據(jù)定義

17、，用來存儲每個訂單的詳細信息。表5 購物車訂單表字段名字段類型長度null說 明idint4否id序列號indentnovarchar20否訂單編號useridint4否用戶序列號submittimedatetime8否提交訂單時間consignmenttimevarchar20交貨時間totalpricefloat8總金額contentvarchar400用戶備注ispayoffint4用戶是否已付款issalesint4是否已發(fā)貨6.購物車訂單貨物列表my_indentlist購物車訂單貨物列表，存放購物車訂單貨物的信息，表名為my_indentlist，主鍵為id，主要用來存放每個購物車

18、訂單貨物的詳細信息。表6 購物車訂單貨物列表字段名字段類型長度null說 明idint4否id序列號indentnoint4否訂單號表序列號booknoint4否圖書表序列號amountint4訂貨數(shù)量3.2.3系統(tǒng)模塊圖系統(tǒng)模塊圖描繪了系統(tǒng)的物理結構，它反映了系統(tǒng)各部件之間的調用關系。本系統(tǒng)的功能模塊圖如圖3所示。整個系統(tǒng)構建分為前臺管理后后臺管理兩個中心，對于書店的客戶，首先需要進行注冊，登陸后才能管理個人信息，還需要選購商品，最后還必須下訂單結算。對于書店的管理員，負責整個書店系統(tǒng)的后臺管理，分為管理員管理、圖書管理、訂單管理和擁護信息管理四個模塊，用戶信息管理主要是管理用戶的信息和修改

19、刪除用戶等，而圖書管理主要是添加圖書，修改圖書的信息及刪除圖書等，訂單管理是管理合格訂單，方便系統(tǒng)管理員發(fā)貨等。4詳細設計4.1三味書屋首頁首頁詳細設計的代碼如下：<!doctype html public "-/w3c/dtd xhtml 1.0 transitional/en" "/tr/xhtml1/dtd/xhtml1-transitional.dtd"><html xmlns="/1999/xhtml"><head><m

20、eta http-equiv="content-type" content="text/html; charset=gb2312" /><title>三味書屋首頁</title><style type="text/css"><!-body background-image: url(3.jpg);background-repeat: repeat;#layer1 position:absolute;left:1px;top:177px;width:1188px;height:61px;z

21、-index:1;#layer2 position:absolute;left:28px;top:44px;width:192px;height:131px;z-index:2;.style5 font-size: 36px;font-weight: bold;color: #000000;#layer3 position:absolute;left:277px;top:40px;width:657px;height:106px;z-index:3;#layer4 position:absolute;left:10px;top:384px;width:220px;height:420px;z-

22、index:4;.style21 color: #0000ff; font-size: 24px; font-weight: bold; #layer5 position:absolute;left:239px;top:384px;width:188px;height:243px;z-index:5;#layer6 position:absolute;left:424px;top:389px;width:721px;height:236px;z-index:6;.style13 color: #3300cc;font-weight: bold;font-size: 24px;.style22

23、font-size: 24px;font-weight: bold;#layer7 position:absolute;left:240px;top:767px;width:148px;height:202px;z-index:7;#layer8 position:absolute;left:529px;top:764px;width:147px;height:205px;z-index:8;#layer9 position:absolute;left:827px;top:770px;width:152px;height:201px;z-index:9;#layer10 position:ab

24、solute;left:1076px;top:759px;width:148px;height:213px;z-index:10;#layer11 position:absolute;left:235px;top:973px;width:168px;height:43px;z-index:11;#layer12 position:absolute;left:525px;top:966px;width:177px;height:47px;z-index:12;#layer13 position:absolute;left:822px;top:970px;width:169px;height:43

25、px;z-index:13;#layer14 position:absolute;left:1074px;top:973px;width:168px;height:39px;z-index:14;.style18 color: #000066;font-size: 24px;.style17 font-size: 24px;color: #000099;#layer15 position:absolute;left:15px;top:335px;width:542px;height:32px;z-index:15;.style27 font-size: 36px; font-weight: b

26、old; .style26 color: #000099; font-size: 18px; font-weight: bold; -></style></head><body><div id="layer1"> <div id="layer"> <table width="1191" height="62" border="1"> <tr> <td width="173" hei

27、ght="50"><pre class="style5"><a href="登陸.html">用戶登錄</a></pre></td> <td width="265"><span class="style5"><a href="購物.html">我的購物車</a></span></td> <td width="241"

28、;><span class="style5"><a href="登陸.html"><span class="style27">我的訂單</span></a></span></td> <td width="198"><span class="style5"><a href="管理員.html">管理員登陸</a></span>&l

29、t;/td> <td width="249"><form id="form1" name="form1" method="post" action=""> <label> <input type="text" name="textfield" /> </label> <span class="style22">搜索</span> </form

30、> </td> </tr> </table> </div></div><div id="layer2"><img src="0.png" width="191" height="129" /></div><div id="layer3"><img src="8.png" width="655" height="105"

31、 /></div><div id="layer4"> <table width="200" border="1"> <tr> <td><span class="style21">商品分類</span></td> </tr> <tr> <td><pre class="style26"> c+ </pre></td> </

32、tr> <tr> <td><pre class="style26"> </pre></td> </tr> <tr> <td><pre class="style26"> jsp</pre></td> </tr> <tr> <td><pre class="style26"> java</pre></td> </tr> &

33、lt;tr> <td><pre class="style26"> html xml</pre></td> </tr> <tr> <td><pre class="style26"> 電子商務</pre></td> </tr> <tr> <td><pre class="style26"> 網站開發(fā)</pre></td> </tr>

34、<tr> <td><pre class="style26"> 計算機等級考試</pre></td> </tr> </table></div><div id="layer5"><img src="12.jpg" width="177" height="243" /></div><div id="layer6"> <p class=

35、"style22">c+程序設計語言(特別版·十周年中文紀念版)是在c+語言和程序設計領域具有深遠影響、暢銷不衰的著作，由c+語言的設計者編寫，對c+語言進行了最全面、最權威的論述，覆蓋標準c+以及由c+所支持的關鍵性編程技術和設計技術。c+程序設計語言(特別版·十周年中文紀念版)英文原版一經面世，即引起業(yè)內人士的高度評價和熱烈歡迎，先后被翻譯成德、希、匈、西、荷、法、日、俄、中、韓等近20種語言，數(shù)以百萬計的程序員從中獲益，是無可取代的c+經典力作。</p> <pre><span class="style1

36、3"><s> 定價：49元 </s> 折扣價：35元 折扣：75折 </span></pre></div><div id="layer7"><img src="13.png" width="144" height="201" /></div><div id="layer8"><img src="14.jpg" width="144&quo

37、t; height="204" /></div><div id="layer9"><img src="15.jpg" width="151" height="198" /></div><div id="layer10"><img src="16.jpg" width="145" height="207" /></div><

38、div id="layer11"><span class="style18"><s>￥35 </s>￥26.25</span></div><div id="layer12"><span class="style17"><s>￥79</s> ￥59.25</span></div><div id="layer13"><span class=&qu

39、ot;style17"><s>￥108 </s>￥81</span></div><div id="layer14"><span class="style17"><s>￥30</s> ￥22.50</span></div><div class="style22" id="layer15">您現(xiàn)在的位置：三味書屋首頁</div></body><

40、/html>4.2新用戶注冊頁面新用戶只有注冊了才能完成對圖書的訂購，管理自己的購物車和訂單，查看已經訂閱的圖書圖書。點確定后，轉入首頁，填入的信息寫進數(shù)據(jù)庫，實現(xiàn)交互。注冊頁面詳細設計代碼如下：<!doctype html public "-/w3c/dtd xhtml 1.0 transitional/en" "/tr/xhtml1/dtd/xhtml1-transitional.dtd"><html xmlns="/1999/xhtml"&g

41、t;<head><meta http-equiv="content-type" content="text/html; charset=gb2312" /><title>新用戶注冊界面</title><style type="text/css"><!-body background-image: url(3.jpg);background-repeat: repeat;#layer1 position:absolute;left:1px;top:177px;width:

42、1188px;height:61px;z-index:1;#layer2 position:absolute;left:28px;top:44px;width:192px;height:131px;z-index:2;.style5 font-size: 36px;font-weight: bold;color: #000000;#layer3 position:absolute;left:277px;top:40px;width:657px;height:106px;z-index:3;#layer4 position:absolute;left:7px;top:301px;width:22

43、0px;height:420px;z-index:4;#layer5 position:absolute;left:238px;top:303px;width:188px;height:243px;z-index:5;#layer6 position:absolute;left:422px;top:308px;width:721px;height:236px;z-index:6;.style22 font-size: 24px;font-weight: bold;#layer7 position:absolute;left:238px;top:682px;width:148px;height:

44、202px;z-index:7;#layer8 position:absolute;left:533px;top:682px;width:147px;height:205px;z-index:8;#layer9 position:absolute;left:820px;top:681px;width:152px;height:201px;z-index:9;#layer10 position:absolute;left:1072px;top:678px;width:148px;height:213px;z-index:10;#layer11 position:absolute;left:227

45、px;top:887px;width:168px;height:43px;z-index:11;#layer12 position:absolute;left:520px;top:890px;width:177px;height:47px;z-index:12;#layer13 position:absolute;left:822px;top:883px;width:169px;height:43px;z-index:13;#layer14 position:absolute;left:1068px;top:890px;width:168px;height:39px;z-index:14;#l

46、ayer15 position:absolute;left:16px;top:360px;width:542px;height:32px;z-index:15;.style23 font-size: 36px.style24 font-size: 36px;color: #ffffff;font-weight: bold;.style25 font-size: 24px.style27 font-size: 36px; font-weight: bold; -></style><script type="text/javascript"><

47、;!-function mm_gotourl() /v3.0 var i, args=mm_gotourl.arguments; document.mm_returnvalue = false; for (i=0; i<(args.length-1); i+=2) eval(argsi+".location='"+argsi+1+"'");/-></script></head><body><div id="layer1"> <div id="l

48、ayer"> <table width="1186" height="63" border="1"> <tr> <td width="173" height="50"><pre class="style5"><a href="登陸.html">用戶登錄</a></pre></td> <td width="265">

49、<span class="style5"><a href="購物.html">我的購物車</a></span></td> <td width="241"><span class="style27"><a href="訂單.html">我的訂單</a></span></td> <td width="198"><span class

50、="style5"><a href="登陸.html">管理員登陸</a></span></td> <td width="249"><form id="form1" name="form1" method="post" action=""> <label> <input type="text" name="textfield&quo

51、t; /> </label> <span class="style22">搜索</span> </form> </td> </tr> </table> </div></div><div id="layer2"><img src="0.png" width="191" height="129" /></div><div id="lay

52、er3"><img src="8.png" width="655" height="105" /></div><div class="style22" id="layer15">您現(xiàn)在的位置：三味書屋&gt;用戶登陸&gt;新用戶注冊</div><table width="907" border="0" cellpadding="0" cellspac

53、ing="0"> <!-dwlayoutdefaulttable-> <tr> <td width="217" height="427">&nbsp;</td> <td width="690">&nbsp;</td> </tr> <tr> <td height="776">&nbsp;</td> <td valign="top&qu

54、ot;><p class="style27">會員名：</p> <form id="form2" name="form2" method="post" action=""> <label> <input name="textfield2" type="text" class="style22" /> </label> </form> <p c

55、lass="style27">密碼：</p> <form id="form3" name="form3" method="post" action=""> <label> <input name="textfield3" type="password" class="style22" /> </label> <p class="style27"&

56、gt;再次輸入密碼：</p> <p class="style27"> <label> <input name="textfield4" type="password" class="style22" /> </label> </p> <p class="style25">&nbsp;</p> <p class="style25"><strong>同意

57、關于本網站相關協(xié)議</strong> <label> <input name="checkbox" type="checkbox" class="style23" value="checkbox" /> </label> </p> </form> <form id="form4" name="form4" method="post" action="">

58、 <label><br /> <br /> <input name="submit" type="submit" class="style23" onclick="mm_gotourl('parent','登陸.html');return document.mm_returnvalue" value="確認保存" /> </label> <pre class="style24"&

59、gt;&nbsp;</pre> </form> <p>&nbsp;</p></td> </tr></table></body></html>用戶登陸界面登陸頁面詳細設計代碼如下：<!doctype html public "-/w3c/dtd xhtml 1.0 transitional/en" "/tr/xhtml1/dtd/xhtml1-transitional.dtd"><ht

60、ml xmlns="/1999/xhtml"><head><meta http-equiv="content-type" content="text/html; charset=gb2312" /><title>用戶登陸界面</title><style type="text/css"><!-body background-image: url(3.jpg);background-repeat: repeat;#l

61、ayer1 position:absolute;left:1px;top:177px;width:1188px;height:61px;z-index:1;#layer2 position:absolute;left:28px;top:44px;width:192px;height:131px;z-index:2;.style5 font-size: 36px;font-weight: bold;color: #000000;#layer3 position:absolute;left:277px;top:40px;width:657px;height:106px;z-index:3;#lay

62、er4 position:absolute;left:7px;top:301px;width:220px;height:420px;z-index:4;#layer5 position:absolute;left:238px;top:303px;width:188px;height:243px;z-index:5;#layer6 position:absolute;left:422px;top:308px;width:721px;height:236px;z-index:6;.style22 font-size: 24px;font-weight: bold;#layer7 position:

63、absolute;left:238px;top:682px;width:148px;height:202px;z-index:7;#layer8 position:absolute;left:533px;top:682px;width:147px;height:205px;z-index:8;#layer9 position:absolute;left:820px;top:681px;width:152px;height:201px;z-index:9;#layer10 position:absolute;left:1072px;top:678px;width:148px;height:213px;z-index:10;#layer11 position:absolute;left:227px;top:887px;width:168px;height:43px;z-index:11;#layer12 position:absolute;left:520px;top:890px;width:177px;hei