課程《網站設計、建設與維護實務》設計報告

上傳人：奔*** IP屬地：河北更新時間：2024-03-01 格式：docx 頁數：37 大?。?.58MB 人氣指數：12 舉報 版權申訴

已閱讀1頁，還剩36頁未讀，繼續(xù)免費閱讀

版權說明：本文檔由用戶提供并上傳，收益歸屬內容提供方，若內容存在侵權，請進行舉報或認領

文檔簡介

1、　　課程《網站設計、建設與維護實務》設計報告　　專業(yè)：XXX 　　學號：XXX　　姓名：XXX 　　指導老師：XXX 　　計算機工程系XXXX<

2、/p>　　2011—6—13　　《網站設計、維護與管理實務》任務書　　課程名稱：《網站設計、維護與管理實務》　　性質和目的:　　本大作業(yè)是對學生在課堂上所學知識的一次綜

3、合檢測。學生通過本次大作業(yè)的制作，應能綜合使用在《靜態(tài)網頁制作（DreamWeaver）》、《ASP程序開發(fā)》、《數據庫應用》等課程中學到的多種基礎知識，并可以很好的應用到實際操作中去，具備簡單的網站制作以及管理與維護能力。　　課題及要求:　　制作出個人主題網站

4、;　　要求：該網站應該具有某種特定的主題和現實意義，界面統(tǒng)一、美觀，功能強大，后臺擁有良好的數據庫支持，做到既友好美觀又方便實用；網站制作完成后，能夠做日常的維護與管理功能。　　四、課程設計報告書要求：　　1、課程設計報告書第一頁為封面，封面上寫清楚標題、副標題、班級、姓名、指導老師、完成日期，格式自己設計。

5、　　2、課程設計報告書第二頁為任務書。　　3、課程設計報告書第三頁為教師評語。　　4、課程設計報告書第四頁為目錄。　　5、課程設計報告書第五頁開始為具體內容　?。?）前言

6、（2）對本次課程設計的詳細描述　?。?）總結　?。?）參考文獻　　6、字數不少于4000字。　　7、用B5紙打印。

7、　五、如有雷同，將作不及格處理。　　六、完成日期：2011.6.25　　指導老師：XX　　2011年3月

8、　　教師評語　　目錄　　任務書………………………………………………..2　　二、教師評語……………………………………………3　　三、前言……………………………………………………5

9、;　　四、網站設計目的…………………………………….6　　五、網站設計題目…………………………………….6　　六、需求分析…………………………………………….6　　七、技術簡介…………………………………………….8　　八、網站步驟分析……………………

10、……………..12　　九、總結………………………………………………….36　　十、參考文獻………………………………………….37　　前言　　人類社會已經進入網絡信息時代，網絡技術的發(fā)展日新月異。在網站技術如火如荼地發(fā)展的今天，它的規(guī)劃

11、建設和管理維護是網絡工程技術人員和管理人員永待解決的問題，而如何經營網站、真正使網站成為資源共享、實現互動的平臺更是一項長期工作。　　網站設計、建設與維護實務是計算機網絡課程的延伸和計算機專項技能培養(yǎng)的重要方面，對高職高專計算機專業(yè)及相近專業(yè)的學生開設網站的規(guī)劃建設和管理維護的課程十分重要，也十分迫切。它為學習者提供了廣闊的應用空間，一方面反應的當前網絡信息技術的發(fā)展方面；另一方面又具有很強的工

12、程使用性，能為學生所認可，從而激發(fā)學生學習的興趣和求知欲望。　　Step 1：激發(fā)性課程，基于工作過程的技術感受經歷。　　使學生了解本項工作的整體過程，激發(fā)學生學習的興趣，結合工作過程的講解、技術和相關理論知識的認知做簡單介紹，是采用問題中心范型的課程。　　Step 2：學科性課程，重點是學科知識的掌握、復用。&

13、lt;/p>　　使學生掌握本項工作所需要的相關理論知識，部分涉及技術過程以及與本職業(yè)能力有關的各類學科知識，可以按照學科中心范型的課程或任務中心的課程來組織。　　Step 3：技術性課程，重點是技術知識的掌握、復用。　　使學生掌握本項工作所需要的，結合現行具體工作崗位的關鍵技術技能，同時進一步深化、提高已經學習過的理論知識。可

14、以根據國家職業(yè)標準、行業(yè)技術培訓標準來組織培訓中心范型的課程。　　Step 4：訓練性課程，目的是理論和技術的領會和內化。　　通過選取典型的工作過程，編制綜合實習、培訓課程，全面領會、內化前三個階段的知識和技能，同時講授工作過程中的經驗性知識，使學生成為“高技能人才”預備者?？梢圆捎萌蝿罩行姆缎驼n程。<b&

15、gt;　　網站設計目的　　本課程的設計目的是通過實踐使同學們經歷Dreamweaver cs3開發(fā)的全過程和受到一次綜合訓練，以便能較全面地理解、掌握和綜合運用所學的知識。結合具體的開發(fā)案例，理解并初步掌握運用Dreamweaver cs3可視化開發(fā)工具進行網頁開發(fā)的方法；了解網頁設計制作過程　　通過設計達到掌握網頁設計、制作的技巧。

16、　　了解和熟悉網頁設計的基礎知識和實現技巧。　　根據題目的要求，給出網頁設計方案，可以按要求，利用合適圖文素材設計制作符合要求的網頁設計作品。　　熟練掌握Photoshop cs3、Dreamweaver cs3等軟件的的操作和應用。　　增強動手實踐能力，進一步加強自身綜

17、合素質。　　二、網站設計題目 　　海南旅游網　　三、需求分析　　選定主題，確定題目之后，在做整個網站之前對網站進行需求分析。首先，做好需求調研。調研方式主要是上網查閱資料，在圖書館里翻閱相關

18、書籍。調研內容如下：　　1、網站當前以及日后可能出現的功能需求。 　　2、客戶對網站的性能（如訪問速度）的要求和可靠性的要求。 　　3、確定網站維護的要求。 　　4、網站的實際運行環(huán)境。 　　5、網站頁面總體風格以及美工

19、效果。　　6、主頁面和次級頁面數量等。　　7、內容管理及錄入任務的分配。 　　8、各種頁面特殊效果及其數量（如flash等）。 　　9、項目完成時間及進度。　　然后，調研結束之后對整個網站進行功能描述，并對網站進行總體規(guī)劃

20、，接著逐步細化。　　我們選做的主題是旅游交通，并且選定題目為“海南旅游網”，其目的是做一個簡單的網站，介紹海南旅游的各個方面，提供一定的資訊信息，。進行一番調研之后，該網站整體站功能結構圖如下：　　四、技術簡介　　(一)建立布局</

21、p>　　在這次的網頁設計中用到大量的布局，所以怎么樣建立布局是關鍵。Dreamweaver cs3是大多數人設計網頁的稱手兵器，也是眾多入門者的捷徑。特別是其在布局方面的出色表現，更受青睞。大家都知道，沒有表格的幫助，很難組織出一個協(xié)調合理的頁面。　　1.點擊“ALT+F6”鍵，進入布局模式，插入布局表格。建立一個大概的布局。

22、;　　2.使用背景圖片：選中該項，按瀏覽可以插入一幅準備好的圖片作為表格的背景，因為圖片是以平鋪的形式作為表格背景，所以表格大小和圖片尺寸都要控制好。　?。ǘ┚W頁中的圖像　　圖像傳輸是WWW的真正魅力所在，它與文字相比具有顯著的優(yōu)點：一是直觀，人眼觀看圖像時接受信息的速度遠遠超過觀看文字時接受信息的速度；二是能更清

23、楚地表達細節(jié)內容。正是由于這些優(yōu)點，所以在進行網頁設計時圖像很受歡迎。如果網頁做得像一幅風景畫，瀏覽者一定會流連忘返（如果圖片很大，效果會適得其反）。圖像文件的格式有幾十種，如GIF、JPEG、BMP、EPS、PCX、PNG、FAS、TGA、TIFF、WMF等，現在Internet Explorer和Netscape支持的、最常用的圖像格式是GIF、JPEG和BMP。 　?。?）在網頁中插入圖

24、像 　　利用Dreamweaver cs3可以方便地在網頁中插入圖像，還可以設置圖像邊框、大小、和位置，并且可以直接對圖像進行編輯。在網頁中加入圖像的操作非常簡單：　　1.新建一個空白網頁，把光標定位在網頁的開始位置。　　2.打開“工具”菜單，選擇“圖片”菜單項，在子菜單中選擇“來自文件”菜單項，或者單擊工具欄中

25、的圖片工具圖標，彈出一個“圖片”對話框。　　3.在此對話框中單擊“瀏覽”按鈕，出現一個“選擇文件”對話框。　　4.在“選擇文件”對話框的文件列表中選擇某個圖像文件，然后單擊“確定”按鈕，或直接雙擊該圖像文件，該圖像即被加入到網頁中。在網頁中插入圖像后我們就可以對圖像的各種屬性進行設置了。　　（2）圖像的各種屬性設

26、置　　1.選中所插入的圖片，單擊鼠標右鍵，彈出一個快捷菜單，在菜單中選擇“圖片屬性”菜單項，出現一個“圖片屬性”對話框.　　2.打開“外觀”選項卡。　　(1)設定圖像邊框粗細：在“外觀”選項卡的“布局”欄里可以根據需要定義圖像的邊框，也可以定義邊框值為“0”，即無邊框。

27、　(2)設置圖像環(huán)繞方式：一般情況下一幅圖像只能與一行文字處在同一高度，但有時需要將圖像和文字分開，且兩者互不影響。比如在網頁左邊插入一幅圖像，要求右邊的文字就像沒有圖像時可以多行輸入，這就要通過設置圖像的環(huán)繞方式來實現。在網頁中圖像的環(huán)繞方式有兩種：　　①左環(huán)繞：圖像在左邊，文本在圖像的右邊進行環(huán)繞。　　②右環(huán)繞：圖像在右邊，文本在圖像的左邊進行環(huán)繞。

28、　　在“外觀”選項卡的“布局”欄中打開“對齊方式”下拉列表框，選擇“左”選項，并單擊“確定”按鈕，圖像就被設置為左環(huán)繞方式，同樣，如果選“右”，圖像就被設置為右環(huán)繞方式。　　(3)編輯圖像大?。涸贒reamweaver cs3中，當在網頁中加入一幅圖像后，圖像大小默認設置為其原來的大小，如果加入的圖像太大或太小，或有其他特別需要，就得調整圖像的大小。調整

29、圖像大小非常簡單靈活，只要你選中加入的圖像，用鼠標左鍵拖動圖像邊框，可任意調整圖像的寬度和高度直到達到你滿意的尺寸。　　(4)設置圖像縮放比例：網頁設計的一個重要原則就是網頁的兼容性，對于不同的瀏覽器或者不同的分辨率，不管是800×600的窗口，還是1024×768的窗口，網頁都要能正常的顯示。設置圖像縮放比例就是將圖像設置為大小可以按比例變化，與瀏覽器的大小成一固定比例，這

30、樣在不同大小的瀏覽器窗口里圖像都能正常的顯示外觀。設置圖像縮放比例的步驟如下：　　1.選中網頁中的圖像，單擊鼠標右鍵，在彈出的快捷菜單里，選擇“圖像屬性”菜單項，彈出一個“圖像屬性”對話框.　　2.在“大小”欄中選中“指定大小”復選框，同時選中“寬度”和“高度”下面的“百分比”單選按鈕，然后在“寬度”和“高度”欄里輸入想顯示的比例，單擊“確定”完成設置。

31、外還可以在“外觀”選項卡的“水平間距”和“垂直間距”欄里進行設置，水平間距是指圖像與周圍元素在水平方向的間距，以象素為單位；垂直間距指圖像與周圍元素在垂直方向的間距。　?。?）怎樣編輯網頁中的圖像　　在Dreamweaver cs3中，可以使用“圖片”工具欄中的各種工具對網頁中的圖像進行編輯，編輯功能主要有：圖像旋轉和翻轉、剪裁、圖像淡化、凹凸效果等等。

32、　　另外，為了使圖片更符合要求，我們還在photoshop cs3中隊所用的圖片進行了處理，使得圖片看起來更加精細美觀，符合我們的主題要求。　?。?）使用背景圖像　　使用背景圖像與使用背景色不同，使用背景色只將網頁的背景用某種顏色填充，而使用背景圖像則是將網頁的背景用圖像平

33、鋪。這樣做可以使制作的網頁更美觀好看。網頁中使用背景圖像的具體步驟如下：　　1.新建一個空白網頁。　　2.單擊鼠標右鍵，彈出的快捷菜單里選“網頁屬性”，彈出“網頁屬性”對話框.　　3.開“背景”選項卡。　　4.在“背景”選項卡的“格式”欄中選中“背景圖片”復選框，然后單擊

34、下面的“瀏覽”按鈕，出現一個“選擇背景圖片”對話框。　　5.在“選擇背景圖像”對話框中單擊“瀏覽文件”按鈕，出現一個“選擇文件”對話框。　　6.在“選擇文件”對話框的文件列表中選擇圖像文件，單擊“確定”按鈕。　　這樣，所選圖片將作為整個網頁的背景，如果在第4步時同時選中“水印”復選框，背景圖片將顯示為特殊的水印效

35、果，當網頁滾動時，背景不動，只有網頁內容滾動，產生一種透明層的效果，非常吸引人。　　（5）插入flash動畫　　關于 Flash 視頻使用 Dreamweaver 中的“插入 Flash 視頻”命令，可將 Flash 視頻內容插入 Web 頁面，而無需使用 Flash 創(chuàng)作工具。該命令可以插入 Flash 組件；當您在瀏覽器中查看它時，它顯示所選擇的

36、Flash 視頻內容以及一組播放控件。　?。?）設置鼠標經過圖片，進行圖片交互　　再插入圖片的下拉菜單中有一項是“鼠標經過”，點擊這一項，會彈出一個對話框，在對話框中可以設置鼠標經過前的圖片和經過時的圖片，選擇“確定”即可。　?。?）設置鏈接<p

37、>　　選中圖片或者文字，在下面的鏈接屬性中輸入所要連接到的地址，同時，下方的目標屬性被激活，輸入blank設置成在新窗口中打開網頁。我們設置了鏈接本站點的網頁頁面，同時也連接了外網，使得大家訪問頁面時能夠查詢更多詳細的信息，方便用戶查詢。　?。?）設置字體滾動　　使圖片在頁面連續(xù)滾動出現，其中某頁代碼如下：&l

38、t;marquee id="scrollarea" direction="up" scrolldelay="2" scrollamount="2" width="？" height="？" onmouseover="this.stop();" onmouseout="this.start(

39、);"> 　　內容</marquee>　　五、網站步驟分析　　海南島，是我國的第二大島，旅游資源豐富，極富熱帶特色。隨著海南國際旅游島建設的加速，肯定會有越來越多的人喜歡上海南這片美麗的土地

40、。下面，我們就根據海南島的行政區(qū)劃，來給大家介紹一下海南的各地旅游景區(qū)景點、好玩的地方。大家只要點擊各個城市（縣），就能看到各市縣的旅游景點。　　各個界面都有不同的設計，大多都是采用了DIV和CSS制作的，對各個方面進行控制。　　（1）網站首頁：　　首先簡介首頁的實現：導航條

41、是采用了DIV和CSS樣式實現的，其CSS代碼為：　　#apDiv36 {position:absolute;left:461px;top:203px;width:714px;height:28px;z-index:4;}　　DIV部分：　　<div id="

42、wrapper" class="wrapper">　　<div id="innerWrapper" class="innerWrapper">　　<ul id="navigator">　　<

43、;li class="youAreHere"><a href="" onclick="MM_goToURL('parent','file:///H|/zhandian1/shouye.html');return document.MM_returnValue">首頁</a></li>

44、　　<li><a href=""onclick="MM_goToURL('parent','sanya/sanyaqu.html');return document.MM_returnValue">三亞</a></li>　　<li><a h

45、ref="" onclick="MM_goToURL('parent','haikou/haikou.html');return document.MM_returnValue">?？?lt;/a></li>　　<li><a href="" onclick=&qu

46、ot;MM_goToURL('parent','file:///H|/zhandian1/五指山/wuzhishan.html');return document.MM_returnValue">五指山</a></li>　　<li><a href="" onclick="MM_

47、goToURL('parent','file:///H|/zhandian1/瓊海/qionghai.html');return document.MM_returnValue">瓊海</a></li>　　<li><a href="" onclick="MM_goToURL(&

48、#39;parent','file:///H|/zhandian1/文昌/wenchang.html');return document.MM_returnValue">文昌</a></li>　　<li><a href="">更多</a></li>

49、;　　</ul>　　</div>　　<div id="shadow" class="shadowWrapper"></div>&

50、lt;b>　　</div>　　地圖是一個鏈接：<img src="images/海南地圖.jpg" width="497" height="324" onclick="MM_openBrWindow('ditu/google-api.html','地圖導航&#

51、39;,'')"/>　　分頁是同一種模版制作實現的　?。?）網站其一分頁：　　導航條：采用了DIV+CSS　　CSS部分代碼：@charset "utf-8";　　html,bo

52、dy,div,span,applet,object,iframe,　　h1,h2,h3,h4,h5,h6,p,blockquote,　　pre,a,abbr,acronym,address,big,cite,　　code,del,dfn,em,font,img,ins,kbd,<p&

53、gt;　　q,s,samp,small,strike,strong,sub,　　sup,tt,var,dd,dl,dt,li,ol,ul,　　fieldset,form,label,legend,table,　　caption,tbody,tfoot,thead,tr,th,<p&g

54、t;　　td { margin:0; padding:0; border:0; font-size:12px; font-family:arial, "宋體", Simsun, Microsoft YaHei, Arial Unicode MS, Mingliu, Arial, Helvetica; line-height:20px; }　　ul, ol { list-sty

55、le:none; }　　table { border-collapse:collapse; border-spacing:0; }　　table,h1,h2,h3,h4,h5,　　h6 { font-size:100%; }　　/* 共用樣式 */

56、　　html { overflow-y:scroll;}　　body { color:#535353; }　　a { color:#535353; text-decoration:none; cursor:pointer!important; }　　a:hover { color:#EF5300

57、; text-decoration:underline; }　　/* 頭部 */　　.header .inner { position:relative; width:900px; height:152px; margin:0 auto; }　　.header .inner

58、h1 { position:relative; top:13px; left:0; width:177px; height:52px; }　　.header .inner h1 span { display:block; height:52px; line-height:150px; overflow:hidden; }　　.header .inner

59、h1 a { position:absolute; top:0; }　　.header .inner .message { position:absolute; top:5px; right:0px; z-index:100; height:20px; line-height:20px; padding-right:65px; color:#535353; }<p&

60、gt;　　.header .inner .message a { color:#259301; text-decoration:underline; }　　.header .inner .message a:hover { color:#EF5300; text-decoration:none; }　　.header .inner .message sp

61、an.online { margin-right:5px; }　　.header .inner .message a.login { padding-right:5px; }　　.header .inner .message a.message_center { margin:0 5px; }　　.header

62、.inner .message a.help { margin-left:5px; padding:0 0 0 15px; background-color:#FFFFFF }　　.header .inner .message a.vip { position:absolute; top:1px; right:0; width:60px; height:17px; line-height:17p

63、x; line-height:21px\9; +line-height:19px;　　text-align:center; overflow:hidden; text-decoration:none; color:#FFF; }　　.header .inner .message a.vip:hover { color:#FFF; }

64、　　.header .inner .nav { position:absolute; top:90px; left:45px; }　　.header .inner .nav a { float:left; height:27px; text-align:center; }　　.header .inner .nav a strong {

65、 display:block; width:86px; height:27px; line-height:27px; line-height:30px\9; font-weight:normal; font-size:14px; color:#FFFFFF; cursor:pointer; }　　.header .inner .nav a #nav_index { width:66px; }&l

66、t;/p>　　.header .inner .nav a #nav_privileg { width:100px; }　　.header .inner .nav strong.last { background:none; }　　.header .inner .nav a:hover { text-decoration:non

67、e; background:none; }　　.header .inner .nav a.current { position:relative; top:-1px; }　　.header .inner .nav a.current:hover { position:relative; top:-1px; background:none; }</p

68、>　　.header .inner .nav a.current strong { height:34px; line-height:36px; overflow:hidden; color:#6C7100; font-weight:bold; }　　.header .inner .sub_nav { position:absolute; top:126px; }&l

69、t;/p>　　.header .inner #sub_nav_01 { left:124px; }　　.header .inner #sub_nav_02 { left:209px; }　　.header .inner #sub_nav_03 { left:310px; }　　.he

70、ader .inner .sub_nav a { margin-right:15px; }　　.header .inner .sub_nav a.current { color:#6C7100; font-weight:bold; }　　.header .inner a.return { position:absolute; right:0; top:9

71、0px; width:91px; height:26px; line-height:26px; line-height:28px\9; +line-height:28px;　　text-align:center; color:#FFFFFF; }　　.header .inner a.return:hover { text-decoration:none;

72、 color:#FFFFFF; }　　/* 背景圖 */　　.header,.header .inner .nav strong { background:url(bg_repeat.png) repeat-x; }　　.header { background-positio

73、n:0px 0px; }　　.header .inner .nav strong { background-repeat:no-repeat; background-position:right -370px; }　　.header .inner .nav a.current strong,　　.header .

74、inner .nav a.current:hover strong,　　.header .inner .nav a.current #nav_index,　　.header .inner .nav a.current #nav_privileg,　　.header .inner .nav a.current:ho

75、ver #nav_index,　　.header .inner .nav a.current:hover #nav_privileg,　　.header .inner a.return{ background:url(bg.png) no-repeat; }　　.header .inner .nav a.curr

76、ent strong { background-position:-220px -240px; }　　.header .inner .nav a.current:hover strong { background-position:-220px -240px; }　　.header .inner .nav a.current #nav_index { b

77、ackground-position:-480px -420px; }　　.header .inner .nav a.current #nav_privileg { background-position:-370px -420px; }　　.header .inner .nav a.current:hover #nav_index { backgrou

78、nd-position:-480px -420px; }　　.header .inner .nav a.current:hover #nav_privileg { background-position:-370px -420px; }　　.header .inner .message a.vip { background-position:-460px

79、 -310px; }　　.header .inner a.return { background-position:-220px -280px; }　　.header .inner .nav a:hover strong,　　.header .inner .nav a:hover #nav_index,</

80、p>　　.header .inner .nav a:hover #nav_privileg { background:url(nav_hover.png) no-repeat 0 -40px; }　　.header .inner .nav a:hover strong { background-position:0 -40px; }<p&

81、gt;　　.header .inner .nav a:hover #nav_index { background-position:0 -0px; }　　.header .inner .nav a:hover #nav_privileg { background-position:0 -80px; }　　DIV部分代碼：</b&g

82、t;　　<div class="header">　　<div class="inner">　　<div><table width="898" border="0" cellspacing=&q

83、uot;0" cellpadding="0">　　<tr>　　<td width="199" rowspan="3" align="center" valign="bottom" cl

84、ass="g">三亞<img src="images/3-100106150429360.jpg" alt="g" width="92" height="62" align="absmiddle" />旅游</td>　　<td width=&

85、quot;540" height="30" align="center" valign="top" class="c">Wednesday, 2011-06-08 9:50</td>

86、　　<td width="159" rowspan="3" align="left" valign="middle"><input type="button" onclick="popup_show()" value='登錄'/>&l

87、t;p>　　<div class="sample_popup" id="popup" style="visibility: hidden; display: none;">　　<div class="menu_form_header" id="popup_drag"

88、>　　<img class="menu_form_exit" id="popup_exit" src="bg.png" />　　Login　　</div></

89、b>　　<div class="menu_form_body">　　<form method="post" action="#">　　<table>&

90、lt;p>　　<tr>　　<th>Username:</th>　　<td><input class="field" type="text" onfocus="select();" /><

91、/td>　　</tr>　　<tr>　　<th>Password:</th>　　<td><input class="

92、field" type="password" onfocus="select();" /></td>　　</tr>　　<tr>　　<th&g

93、t; </th>　　<td><input class="btn" type="submit" value="Submit" /></td>　　</tr>&l

94、t;b>　　</table>　　</form>　　</div>　　</div>　　&

95、amp;nbsp;   注冊</td>

96、　　</tr>　　<tr>　　<td height="21"> </td>　　</tr></b&g

97、t;　　<tr>　　<td align="center" valign="middle" class="f">三亞之旅與您同行</td>　　</tr>

98、;　　</table>　　</div>　　<map name="nav" id="nav">　　&l

99、t;div class="nav"> <a href="#" onclick="MM_goToURL('parent','../shouye.html');return document.MM_returnValue">首頁</strong&g

100、t;</a> <a href="http://www.865171.cn/icons/" class="current">三亞</a> <a href="../haikou/haikou.html"><strong id="nav_privileg&quo

101、t;>海口</a> <a href="http://www.865171.cn/admin-templates/">五指山</a> <a href="http://www.865171.cn/css-code/">瓊海<

102、/strong></a> <a href="http://www.865171.cn/css-menu/">文昌</stro　　</map>　　</div></p&

103、gt;　　</div>　?。?）實現：　　其CSS代碼：　　BODY {font-size:12px}　　UL {PADDI

104、NG: 0px; MARGIN: 0px;}　　LI {PADDING: 0px; MARGIN: 0px;}　　P {line-height:10px;}　　.container {　　WIDTH: 610px;　　HEIGHT

105、: 205px}　　.container A IMG {　　WIDTH: 610px;　　HEIGHT: 205px}　　.container IMG {　　BORDER-BOTTOM-STYLE: none;

106、　　BORDER-RIGHT-STYLE: none;　　BORDER-TOP-STYLE: none;　　BORDER-LEFT-STYLE: none}　　.td_f A IMG {　　PADDING-BOTTOM: 0px;

107、　　MARGIN: 0px;　　PADDING-LEFT: 0px;　　PADDING-RIGHT: 0px;　　PADDING-TOP: 0px}　　.num {　　P

108、OSITION: absolute;　　WIDTH: 90px;　　FLOAT: right;　　TOP: 180px;　　LEFT: 520px}　　.num LI {

109、　　TEXT-ALIGN: center;　　LINE-HEIGHT: 15px;　　LIST-STYLE-TYPE: none;　　MARGIN: 1px;　　WIDTH: 15px;　　FONT-FAMIL

110、Y: Arial;　　BACKGROUND: url(../images/flashbutton.gif) no-repeat -15px 0px;　　FLOAT: left;　　HEIGHT: 15px;　　COLOR: #86a2b8;<

111、p>　　FONT-SIZE: 12px;　　CURSOR: pointer}　　.num LI.on {　　LINE-HEIGHT: 15px;　　WIDTH: 15px;　　BACKGROUND: url(../image

112、s/flashbutton.gif) no-repeat;　　HEIGHT: 15px;　　COLOR: #ffffff}　　DIV的實現代碼：　　<div>&

113、lt;p>　　<body style="text-align:center">　　<DIV id=idContainer2 class=container>　　<TABLE id=idSlider2 border=0 cellSpacing=0 cellPadding=0>

114、　　<TBODY>　　<TR>　　<TD class=td_f><A href="#" target="_blank"><IMG src="images/

115、01.jpg"></A></TD>　　<TD class=td_f><A href="#" target="_blank"><IMG src="images/02.jpg"></A></TD>

116、<TD class=td_f><A href="#" target="_blank"><IMG src="images/03.jpg"></A></TD>　　<TD class=td_f><A href="#" target="_

117、blank"><IMG src="images/04.jpg"></A></TD>　　<TD class=td_f><A href="#" target="_blank"><IMG src="images/05.jpg"><

118、/A></TD>　　</TR></TBODY></TABLE>　　<UL id=idNum class=num></UL>　　</DIV><

119、;b>　　<SCRIPT>　　其余的一些實現功能差不多是DIV＋CSS制作的，那就說說最后的，且是最重要部分～留言板！　　留言板的文件夾：　　留言板主頁index.asp代碼：　　<%@ C

120、ODEPAGE = "936" %>　　<%　　'　　'　　'&

121、lt;/p>　　%>　　<script language="Javascript">　　function checkdate()　　{<p&g

122、t;　　if(document.liuyanForm.name.value=="") 　　{　　alert('昵稱沒有寫!');　　return false;　　}</b&g

123、t;　　else if(document.liuyanForm.comment.value=="") 　　{　　alert('你留下了什么？');　　return false;

124、　　}　　else if(isNaN(document.liuyanForm.QQ.value))　　{　　alert('QQ號碼不正確!');　　return

125、 false;　　}　　return true;　　}　　</script>　　<

126、;%　　colorbool = 1　　colorone = "#99CC99"　　colortwo = "#CCFFCC"　　filename = "bbs.mdb"&

127、lt;p>　　tablename = "liuyan"　　dbfile = server.mappath(filename)　　'設置數據庫　　Const adOpenForwardOnly = 0

128、　Const adOpenKeyset = 1　　Const adOpenDynamic = 2　　Const adOpenStatic = 3　　Const adLockReadOnly = 1　　Const adLockPessimistic = 2

129、;　　Const adLockOptimistic = 3　　Const adLockBatchOptimistic = 4　　Const adCmdUnknown = &H0008　　Const adCmdText = &H0001

130、　　Const adCmdTable = &H0002　　Const adCmdStoredProc = &H0004　　Const adCmdFile = &H0100　　Const adCmdTableDirect = &H0200

眾賞文庫> 全部分類> 畢業(yè)設計

溫馨提示

1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯(lián)系上傳者。文件的所有權益歸上傳用戶所有。
3. 本站RAR壓縮包中若帶圖紙，網頁內容里面會有圖紙預覽，若沒有圖紙預覽就沒有圖紙。
4. 未經權益所有人同意不得將文件中的內容挪作商業(yè)或盈利用途。
5. 眾賞文庫僅提供信息存儲空間，僅對用戶上傳內容的表現方式做保護處理，對用戶上傳分享的文檔內容本身不做任何修改或編輯，并不能對任何下載內容負責。
6. 下載文件中如有侵權或不適當內容，請與我們聯(lián)系，我們立即糾正。
7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

課程《網站設計、建設與維護實務》設計報告

文檔簡介

溫馨提示

最新文檔

評論

課程《網站設計、建設與維護實務》設計報告

文檔簡介

溫馨提示

最新文檔

評論

免費下載

課程《網站設計、建設與維護實務》設計報告