第一篇：基于PHP的個(gè)人網(wǎng)站設(shè)計(jì)與實(shí)現(xiàn)論文

摘要:隨著互聯(lián)網(wǎng)的迅猛發(fā)展,網(wǎng)站已經(jīng)被應(yīng)用到生活的各個(gè)領(lǐng)域,與人們的生活融為一體,息息相關(guān).本文通過(guò)對(duì)個(gè)人網(wǎng)站的系統(tǒng)分析、系統(tǒng)設(shè)計(jì)、系統(tǒng)實(shí)施等步驟,詳細(xì)介紹了應(yīng)用PHP動(dòng)態(tài)網(wǎng)頁(yè)技術(shù)開(kāi)發(fā)個(gè)人網(wǎng)站的設(shè)計(jì)與實(shí)現(xiàn).關(guān)鍵詞:個(gè)人網(wǎng)站;系統(tǒng)分析;PHP動(dòng)態(tài)網(wǎng)頁(yè)技術(shù)

現(xiàn)階段,伴隨互聯(lián)網(wǎng)迅猛發(fā)展和普及率的穩(wěn)步提升,人們已經(jīng)把生活與互聯(lián)網(wǎng)融為一體,互聯(lián)網(wǎng)成為人與人,人與社會(huì)之間交流的一種重要形式.而個(gè)人網(wǎng)站,恰好是世界互聯(lián)網(wǎng)迅猛發(fā)展過(guò)程中的必然產(chǎn)物之一,人們通過(guò)設(shè)計(jì)開(kāi)發(fā)個(gè)人網(wǎng)站,不僅可以將個(gè)人的喜好、某種服務(wù)或商品等相關(guān)信息,滲透到互聯(lián)網(wǎng)中,還可以運(yùn)用個(gè)人網(wǎng)站樹(shù)立個(gè)人的網(wǎng)絡(luò)形象,搭建起一個(gè)個(gè)人推薦、展現(xiàn)自我、互動(dòng)交流的網(wǎng)絡(luò)平臺(tái),縮短人與人、人與社會(huì)之間的距離.1系統(tǒng)分析

在個(gè)人網(wǎng)站的設(shè)計(jì)開(kāi)發(fā)過(guò)程中,要做好網(wǎng)站的需求分析,確定網(wǎng)站的開(kāi)發(fā)語(yǔ)言和系統(tǒng)數(shù)據(jù)庫(kù).本次主要研究基于PHP開(kāi)發(fā)環(huán)境的個(gè)人網(wǎng)站系統(tǒng),通過(guò)PHP技術(shù)與My SQL數(shù)據(jù)庫(kù)相結(jié)合,在互動(dòng)性極強(qiáng)的互聯(lián)網(wǎng)平臺(tái)基礎(chǔ)上,實(shí)現(xiàn)個(gè)人網(wǎng)站的功能框架,讓用戶在瀏覽器端方便、快捷的訪問(wèn)網(wǎng)站系統(tǒng),瀏覽自己所需要的相關(guān)信息,這樣不僅使文檔的保存和管理提供了極大的方便,還大大提高了網(wǎng)頁(yè)的互動(dòng)性,增強(qiáng)了網(wǎng)站系統(tǒng)的用戶體驗(yàn).1.1理論研究基礎(chǔ).個(gè)人網(wǎng)站是由文章日志、相冊(cè)圖片、個(gè)人信息、留言板等諸多功能于一體的網(wǎng)絡(luò)平臺(tái).個(gè)人網(wǎng)站以個(gè)人為中心,建立一個(gè)完全屬于自己的可定制的個(gè)性化網(wǎng)絡(luò)平臺(tái),凸顯其個(gè)性的需求,簡(jiǎn)便的操作,利用互聯(lián)網(wǎng)的特性幫助個(gè)人進(jìn)行全面的信息展示,以多種形式達(dá)到對(duì)信息獲取、組織、思考、表達(dá)、共享和交流的目的.通過(guò)網(wǎng)友對(duì)文章的評(píng)論,在留言板進(jìn)行留言,傾聽(tīng)來(lái)自互聯(lián)網(wǎng)的聲音,達(dá)到自己與他人交流互動(dòng)的效果.1.2技術(shù)層面的支持.在進(jìn)行動(dòng)態(tài)網(wǎng)頁(yè)制作和網(wǎng)站系統(tǒng)設(shè)計(jì)與開(kāi)發(fā)時(shí),PHP開(kāi)發(fā)成為了今天使用的主流.由于PHP是一種通用的開(kāi)源腳本語(yǔ)言,吸收了多種開(kāi)發(fā)語(yǔ)言的特點(diǎn),使用方便,操作簡(jiǎn)單,所以贏得了很多網(wǎng)頁(yè)設(shè)計(jì)開(kāi)發(fā)者的青睞.PHP集成在HTML和腳本語(yǔ)言中,其工作界面簡(jiǎn)單,入門(mén)門(mén)檻比較低,代碼簡(jiǎn)潔,運(yùn)行速度快,執(zhí)行效率高,使用廣泛,幾乎支持所有流行的數(shù)據(jù)庫(kù)以及操作系統(tǒng),PHP所具有的強(qiáng)大功能使個(gè)人網(wǎng)站具有更好的網(wǎng)絡(luò)平臺(tái)操作性和交互性.2個(gè)人網(wǎng)站的開(kāi)發(fā)工具

本網(wǎng)站的開(kāi)發(fā)使用Dreamweaver、Photoshop、Flash和Fireworks軟件進(jìn)行網(wǎng)頁(yè)架構(gòu)、動(dòng)畫(huà)效果及圖片處理.3個(gè)人網(wǎng)站的開(kāi)發(fā)設(shè)計(jì)

3.1確定網(wǎng)站的主題.對(duì)于網(wǎng)站的設(shè)計(jì)與開(kāi)發(fā),首先要確定網(wǎng)站的主題.網(wǎng)站的主題要選擇恰當(dāng),做到定位小而精.如果在網(wǎng)站主題的定位過(guò)程中,不夠準(zhǔn)確,盲目設(shè)計(jì),隨心所欲,那么網(wǎng)站就會(huì)讓用戶感覺(jué)到主題不突出,這不僅造成開(kāi)發(fā)者的勞動(dòng)浪費(fèi),還會(huì)使網(wǎng)站失去亮點(diǎn),對(duì)網(wǎng)站將來(lái)的推廣以及運(yùn)營(yíng)過(guò)程帶來(lái)重重困難.因此,準(zhǔn)確把握網(wǎng)站的主題在整個(gè)網(wǎng)站設(shè)計(jì)開(kāi)發(fā)過(guò)程中十分重要,與日后網(wǎng)站的發(fā)展息息相關(guān).個(gè)人網(wǎng)站主要展示個(gè)人所想要宣傳的信息,以個(gè)人的興趣愛(ài)好為中心,圍繞隨筆日記和圖片相冊(cè)來(lái)展示個(gè)人生活、情感、工作等內(nèi)容.3.2確定網(wǎng)站的形象.網(wǎng)站的形象在網(wǎng)站的設(shè)計(jì)與開(kāi)發(fā)過(guò)程中占有十分重要的地位.網(wǎng)站的形象會(huì)影響網(wǎng)站訪問(wèn)者的第一印象,網(wǎng)站中不同的色彩搭配會(huì)產(chǎn)生不同的效果,不同的效果會(huì)形成不同的視覺(jué)沖擊,從而影響網(wǎng)站訪問(wèn)者的情緒.在網(wǎng)站設(shè)計(jì)過(guò)程中,會(huì)涉及到網(wǎng)站中的很多元素搭配,如網(wǎng)站標(biāo)志、網(wǎng)站色彩、網(wǎng)站字體和圖片等元素,不同的元素組合到一起.同時(shí),網(wǎng)站中各種元素的布局、模塊分類(lèi)還會(huì)影響到網(wǎng)站的整體質(zhì)量.一個(gè)設(shè)計(jì)合理的網(wǎng)站,其內(nèi)容都在很大程度上考慮了大多數(shù)用戶操作使用網(wǎng)站的習(xí)慣,讓網(wǎng)站與用戶更好的結(jié)合.良好的網(wǎng)站形象可以使網(wǎng)站內(nèi)容鮮明,突出網(wǎng)站的主題,達(dá)到讓用戶操作便捷、一目了然的效果,明確的感受到網(wǎng)站的獨(dú)有特色,為網(wǎng)站的推廣和運(yùn)營(yíng)工作打了堅(jiān)實(shí)的基礎(chǔ).3.3優(yōu)化網(wǎng)站頁(yè)面布局.網(wǎng)站的效果和特點(diǎn)由網(wǎng)站本身的功能決定,網(wǎng)站的頁(yè)面布局影響著最終的用戶體驗(yàn),因此,網(wǎng)站的頁(yè)面布局在網(wǎng)站系統(tǒng)開(kāi)發(fā)過(guò)程中起到了至關(guān)重要的作用.在頁(yè)面布局過(guò)程中,要遵循以下幾點(diǎn):

3.3.1確定網(wǎng)站頁(yè)面的寬度.在網(wǎng)頁(yè)結(jié)構(gòu)定位時(shí),有一個(gè)很重要的參數(shù)需要確定,即網(wǎng)頁(yè)的寬度.確定網(wǎng)頁(yè)寬度通常有固定像素模式和顯示屏自適應(yīng)模式.隨著用戶習(xí)慣的變化和大眾使用的顯示器尺寸的變化,網(wǎng)站頁(yè)面的寬度應(yīng)該遵循最流行、最受歡迎的頁(yè)面尺寸.3.3.2頁(yè)面頭部和底部布局.在個(gè)人網(wǎng)站系統(tǒng)的頭部與底部布局中,以頁(yè)面分離方式,通過(guò)頭部文件和底部文件分別對(duì)頁(yè)面的頭部與底部進(jìn)行統(tǒng)一布局和控制,不同頁(yè)面通過(guò)調(diào)用的方式來(lái)實(shí)現(xiàn)頁(yè)面的精準(zhǔn)布局與控制.3.3.3頁(yè)面的主要內(nèi)容布局.傳統(tǒng)的網(wǎng)站大都使用基于表格的布局顯示頁(yè)面信息,雖然表格很容易創(chuàng)建,但是表格也會(huì)生成大量難閱讀和維護(hù)的代碼,在網(wǎng)頁(yè)實(shí)際的瀏覽過(guò)程中也存在著一定兼容性問(wèn)題.所以本網(wǎng)站在頁(yè)面的主要內(nèi)容布局中,采用DIV層與層疊樣式表相結(jié)合的布局方式,實(shí)現(xiàn)網(wǎng)頁(yè)設(shè)計(jì)的靈活控制,對(duì)網(wǎng)站內(nèi)容進(jìn)行結(jié)構(gòu)、表現(xiàn)與行為的分離.內(nèi)容的表現(xiàn)形式,要清晰簡(jiǎn)潔,讓用戶在瀏覽訪問(wèn)過(guò)程中一目了然.3.4建立個(gè)人網(wǎng)站系統(tǒng)的數(shù)據(jù)庫(kù).本個(gè)人網(wǎng)站系統(tǒng)的數(shù)據(jù)庫(kù)采用My SQL數(shù)據(jù)庫(kù).在WEB應(yīng)用方面My SQL是最好的RDBMS(Relational Database Management System:關(guān)系數(shù)據(jù)庫(kù)管理系統(tǒng))應(yīng)用軟件之一.My SQL關(guān)聯(lián)數(shù)據(jù)庫(kù)可以將數(shù)據(jù)保存在不同的表中,而不是將所有數(shù)據(jù)放在一個(gè)大倉(cāng)庫(kù)內(nèi),不但訪問(wèn)速度快,靈活性也很強(qiáng).My SQL所使用的SQL語(yǔ)言是用于訪問(wèn)數(shù)據(jù)庫(kù)的最常用標(biāo)準(zhǔn)化語(yǔ)言.My SQL軟件采用了雙授權(quán)政策,它分為社區(qū)版和商業(yè)版,由于其體積小、速度快、總體擁有成本低,尤其是開(kāi)放源碼這一特點(diǎn),一般中小型網(wǎng)站的開(kāi)發(fā)都選擇My SQL作為網(wǎng)站數(shù)據(jù)庫(kù).由于其社區(qū)版的性能卓越,搭配PHP和Apache可組成良好的開(kāi)發(fā)環(huán)境.3.5順應(yīng)移動(dòng)互聯(lián)網(wǎng)的發(fā)展趨勢(shì).隨著寬帶無(wú)線接入技術(shù)和移動(dòng)終端技術(shù)的飛速發(fā)展,人們迫切希望能夠隨時(shí)隨地乃至在移動(dòng)過(guò)程中都能方便地從互聯(lián)網(wǎng)獲取信息和服務(wù),移動(dòng)互聯(lián)網(wǎng)應(yīng)運(yùn)而生并迅猛發(fā)展.在個(gè)人網(wǎng)站系統(tǒng)開(kāi)發(fā)過(guò)程中,也要在移動(dòng)互聯(lián)網(wǎng)中部署各個(gè)節(jié)點(diǎn),把網(wǎng)站系統(tǒng)的移動(dòng)版本優(yōu)化、完善,以此增強(qiáng)用戶體驗(yàn),捆綁更多的用戶,為個(gè)人網(wǎng)站后期的推廣運(yùn)營(yíng)奠定基礎(chǔ).4結(jié)束語(yǔ)

總之在個(gè)人網(wǎng)站系統(tǒng)設(shè)計(jì)開(kāi)發(fā)過(guò)程中,要在實(shí)現(xiàn)網(wǎng)站功能的同時(shí),始終以用戶體驗(yàn)為中心,增強(qiáng)網(wǎng)站的交互性設(shè)計(jì).只有讓用戶認(rèn)可,符合用戶的要求,網(wǎng)站的后期運(yùn)營(yíng)才能有更好的發(fā)展,個(gè)人網(wǎng)站才能實(shí)現(xiàn)它獨(dú)有的價(jià)值.參考文獻(xiàn):

[1]楊選輝.網(wǎng)頁(yè)設(shè)計(jì)與制作教程[M].北京:清華大學(xué)出版社,2009.[2]劉智勇.Java Script開(kāi)發(fā)技術(shù)大全[M].北京:清華大學(xué)出版社,2009.[3]鄭婷.個(gè)人網(wǎng)站設(shè)計(jì)[D].東北大學(xué),2012.[4]劉增杰,姬遠(yuǎn)鵬.精通PHP+MYSQL動(dòng)態(tài)網(wǎng)站開(kāi)發(fā)[M].北京:清華大學(xué)出版社,2013.[5]陳光鋒.玩賺你的網(wǎng)站[M].北京:機(jī)械工業(yè)出版社,2010

第二篇：論文：個(gè)人網(wǎng)站的設(shè)計(jì)與實(shí)現(xiàn)

個(gè)人網(wǎng)站的設(shè)計(jì)與實(shí)現(xiàn)

前 言

隨著國(guó)際互聯(lián)網(wǎng)的普及，很多人已經(jīng)不滿足僅僅在Internet上的瀏覽信息，而是希望更深入的參與其中，擁有自己的Web網(wǎng)站，這似乎已經(jīng)成為一種潮流。如果說(shuō)個(gè)人建立網(wǎng)站是為了追求時(shí)尚，那么企業(yè)建立網(wǎng)站就是必然的選擇了。

無(wú)論是專(zhuān)業(yè)的，還是業(yè)余的，很多人對(duì)網(wǎng)頁(yè)制作頗感興趣。事實(shí)上制作一個(gè)簡(jiǎn)單的網(wǎng)頁(yè)并不困難，會(huì)使用Word的人都可以勝任。但想做出超凡脫俗的網(wǎng)頁(yè)就不那么容易了，而Dreamweaver卻可以滿足你的愿望，它是Macromedia公司開(kāi)發(fā)的集網(wǎng)頁(yè)制作和網(wǎng)站管理于一身的所見(jiàn)即所得的網(wǎng)頁(yè)編輯器。

同樣出自Macromedia公司的Flash,Fireworks在制作網(wǎng)站的過(guò)程中起到了錦上添花的作用，是個(gè)人網(wǎng)站實(shí)現(xiàn)的好幫手，在制作網(wǎng)站的時(shí)候經(jīng)常會(huì)用到這些軟件。

本文有五章，我來(lái)由淺到深介紹個(gè)人網(wǎng)站的設(shè)計(jì)與實(shí)現(xiàn)。

摘 要

在互聯(lián)網(wǎng)走進(jìn)我們的生活之前，沒(méi)有人敢夢(mèng)想擁有自己的報(bào)紙、雜志、電臺(tái)、電視臺(tái)。除了政策上的制約外，一個(gè)人也根本沒(méi)有操作一份傳播媒體的能力。現(xiàn)在不同了，互聯(lián)網(wǎng)給我們提供了一個(gè)“表達(dá)自我”的自由天地,你可以擁有自己的新聞郵件，你可以建立自己的個(gè)人網(wǎng)站。只要你辦得成功也可以吸引成千上萬(wàn)的訂戶、讀者,并建立自己在眾多參與者中的權(quán)威地位。建立個(gè)人網(wǎng)站的基本過(guò)程可以分為以下七個(gè)環(huán)節(jié) : 1 了解中國(guó)網(wǎng)絡(luò)個(gè)人主頁(yè)研究背景與發(fā)展現(xiàn)狀 2 系統(tǒng)需求分析與總體設(shè)計(jì) 3 熟悉網(wǎng)站開(kāi)發(fā)模式、工具及環(huán)境 把自己的作品和想要展示的內(nèi)容制作成網(wǎng)頁(yè)。5 使用動(dòng)態(tài)網(wǎng)頁(yè)技術(shù)(ASP)，實(shí)現(xiàn)動(dòng)態(tài)內(nèi)容更新。6 認(rèn)真地選取測(cè)試用例，進(jìn)行交叉測(cè)試 7 網(wǎng)站的后期完善、宣傳及發(fā)展方向

其中 ,網(wǎng)頁(yè)制作和使用動(dòng)態(tài)網(wǎng)頁(yè)技術(shù)(ASP)實(shí)現(xiàn)動(dòng)態(tài)內(nèi)容更新是網(wǎng)站開(kāi)發(fā)的核心內(nèi)容。

關(guān)鍵詞：網(wǎng)頁(yè)、制作、訪問(wèn)、鏈接 Abstract Enters before our life in the Internet, nobody dares to vainly hope for has own newspaper, the magazine, the broadcasting station, the television station.Besides the policy in restriction, a person simply has not also operated dissemination media the ability.Now has been different, Internet has provided to us “the expression” free world,You may have own news mail, you may establish own individual website.So long as you also manage the success to be possible to attract the tens of thousands of subscribers, the reader,And establishes oneself in the multitudinous participant's authoritative status.Establishes individual website the unit process to be possible to divide into following seven links: 1、understands the Chinese network individual main page research background and the development present situation 2 systems demands analysis and system design 3 familiar websites developments pattern, tool and environment 4 and wants own work the content which demonstrated to manufacture the homepage.5 uses dynamic homepages technology(ASP), realization dynamic content renewal.6 earnestly selects measured the test example, carries on the overlapping test 7 websites later periods consummate, the propaganda and the development direction Among them,The homepage manufacture and the use dynamic homepage technology(ASP)realizes the dynamic content renewal is the website development core content.Key word: Homepage, manufacture, visit, link

第一章 預(yù)備知識(shí)

1.1 什么是Internet Internet的中文名為“國(guó)際互聯(lián)網(wǎng)”，又稱“因特網(wǎng)”。

Internet是由眾多的計(jì)算機(jī)網(wǎng)絡(luò)互聯(lián)而成的互聯(lián)網(wǎng)，它覆蓋了全世界各地，它是采用開(kāi)放系統(tǒng)協(xié)議的計(jì)算機(jī)通訊網(wǎng)絡(luò)。然而，Internet不僅僅是計(jì)算機(jī)的互聯(lián)網(wǎng)，它還是全球最大的信息資源寶庫(kù)，它提供了包括科研、教育、文化娛樂(lè)、商業(yè)和信息交流等各種各樣的服務(wù)，使得世界范圍內(nèi)的人與人之間的交流在時(shí)間和空間上變的更小了。

要了解Internet，就必須先了解局域網(wǎng)。我們可以將同一地點(diǎn)的許多計(jì)算機(jī)使用網(wǎng)線連接在一起，構(gòu)成一個(gè)高效率的計(jì)算機(jī)網(wǎng)絡(luò)，所有處于網(wǎng)絡(luò)內(nèi)的終端機(jī)或電腦都能享受網(wǎng)絡(luò)內(nèi)所有的資源，比如程序，圖文資料等。這種計(jì)算機(jī)網(wǎng)絡(luò)因?yàn)橐话愣季窒拊谝欢▍^(qū)域中，我們稱之為“局域網(wǎng)”（Local Area Network,簡(jiǎn)稱LAN）,它是在日常工作中用得最多的一種小型計(jì)算機(jī)網(wǎng)絡(luò)。局域網(wǎng)所覆蓋的地理范圍比較小，通常不超過(guò)幾十公里，甚至只在同一座建筑物內(nèi)或者鄰近的幾座建筑內(nèi)。像常見(jiàn)的校園網(wǎng)，一座寫(xiě)字樓內(nèi)部的網(wǎng)絡(luò)等都屬于局域網(wǎng)。

而Internet則不是指單個(gè)區(qū)域范圍內(nèi)的網(wǎng)絡(luò)，而是指將全世界的各中不同類(lèi)型的計(jì)算機(jī)網(wǎng)絡(luò)連接起來(lái)的一個(gè)全球性的網(wǎng)絡(luò)。Internet上有取之不盡，用之不竭的信息資源。對(duì)于Internet中各種各樣的信息，所有的人都可以通過(guò)網(wǎng)絡(luò)的連接來(lái)共享和使用。

1.2 Internet有那些功能

Web頁(yè)瀏覽：這是目前利用最廣泛、最直接的互聯(lián)網(wǎng)服務(wù)，通過(guò)瀏覽WWW（萬(wàn)維網(wǎng)）中的網(wǎng)頁(yè)，可以了解世界各地的新聞，查看最新的股市行情，最新的娛樂(lè)動(dòng)態(tài)、科技發(fā)明，找到眾多的就業(yè)信息??幾乎想找到什么樣的信息，就有什么信息。正是有了WWW、Internet才會(huì)變得如此豐富多彩，才能走進(jìn)千家萬(wàn)戶。信息發(fā)布：通過(guò)Internet，不僅可以瀏覽別人發(fā)布在Web頁(yè)上的信息，也可以將自己要發(fā)布的信息制作成Web頁(yè)，也即網(wǎng)頁(yè)，然后發(fā)布到Internet上，供全世界的人瀏覽。

電子郵件：不同于傳統(tǒng)郵件，電子郵件(E-mail)通過(guò)Internet傳輸，寫(xiě)信，發(fā)信，收信都在計(jì)算機(jī)上完成，一封電子郵件最短在一秒之內(nèi)就可以發(fā)送出去，其效率是傳統(tǒng)郵件無(wú)法比擬的。而且發(fā)送與接收電子郵件幾乎是免費(fèi)的，所以比傳統(tǒng)郵件既節(jié)省時(shí)間又經(jīng)濟(jì)的多。

網(wǎng)上聊天：通過(guò)聊天軟件（如QQ、ICQ等）或不同網(wǎng)站的聊天室，可以和世界各地的網(wǎng)友聊天。網(wǎng)友可能是遠(yuǎn)在天邊的異國(guó)朋友，也可能是與你一起工作的餓同事，或者是一起生活的家人，在這里沒(méi)有年齡、性別、身份、職業(yè)、國(guó)籍、膚色的限制，完全突破了交友的傳統(tǒng)方式，人們可通過(guò)Internet互相了解對(duì)方，進(jìn)行各種各樣的交流。

電子商務(wù)：現(xiàn)在網(wǎng)上交易已經(jīng)成為現(xiàn)實(shí)，網(wǎng)上購(gòu)物、網(wǎng)上商品銷(xiāo)售、網(wǎng)上拍賣(mài)、企業(yè)級(jí)電子商務(wù)、網(wǎng)上貨幣支付等電子商務(wù)活動(dòng)已經(jīng)搞的有聲有色，幾乎所有的專(zhuān)家都預(yù)測(cè)，在未來(lái)的幾年內(nèi)，電子商務(wù)會(huì)飛速發(fā)展。在不久的將來(lái)，您可以做在電腦前進(jìn)行各種各樣的商務(wù)活動(dòng)。

網(wǎng)絡(luò)游戲：通過(guò)Internet，可以與全世界的玩家一起進(jìn)行游戲?qū)?zhàn)，也可以協(xié)同作戰(zhàn)。網(wǎng)絡(luò)游戲已經(jīng)成為信息產(chǎn)業(yè)全新的經(jīng)濟(jì)增長(zhǎng)點(diǎn)，每年都為開(kāi)發(fā)商帶來(lái)巨額的利潤(rùn)。通過(guò)網(wǎng)絡(luò)游戲，可以充分享受Internet給我們帶來(lái)的樂(lè)趣。

網(wǎng)絡(luò)電話：網(wǎng)絡(luò)電話也稱IP電話。它采用Internet技術(shù)，利用專(zhuān)門(mén)的網(wǎng)絡(luò)電話軟件，只需支付非常低廉的話費(fèi)就可通話。Internet在電信市場(chǎng)上的應(yīng)用將越來(lái)越廣泛。

1.3 WWW的簡(jiǎn)介

WWW的全稱為World Wide Web，含義是“環(huán)球網(wǎng)”，又稱“萬(wàn)維網(wǎng)”、3W、Web。WWW是一個(gè)基于超文本（Hypertext）方式的信息檢索服務(wù)工具。我們上網(wǎng)瀏覽到的網(wǎng)頁(yè)就是這樣的超文本，也就是HTML(Hypertext Mark-up Language,超文本標(biāo)記語(yǔ)言)文件，這些網(wǎng)頁(yè)文件被放置到WWW服務(wù)器上，并且都有一定的地址。當(dāng)我們想瀏覽某個(gè)網(wǎng)站時(shí)，首先要在電腦上安裝瀏覽器，如Internet Explorer或Netscape，然后在瀏覽器中輸入網(wǎng)站的地址（網(wǎng)址），就可以進(jìn)入網(wǎng)站進(jìn)行瀏覽。在這些網(wǎng)頁(yè)中，都有超連接，當(dāng)將鼠標(biāo)指針移動(dòng)到某個(gè)地方（如文本或圖象）時(shí)，鼠標(biāo)指針就會(huì)變成一個(gè)小手形形狀，單擊它就可以連接到另個(gè)網(wǎng)頁(yè)中，從而使得瀏覽者能在不同的信息之間跳轉(zhuǎn)，我們之所以能在Internet的海洋中穿梭自如，正是超連接的功勞。

WWW 為我們帶來(lái)的是世界范圍的超級(jí)文本服務(wù)：只須操縱鼠標(biāo)，就可以通過(guò)Internet從世界各地調(diào)來(lái)你所希望的文本、圖像、動(dòng)畫(huà)和聲音等信息。通過(guò)使用WWW，一個(gè)不熟悉網(wǎng)絡(luò)使用的人也可以成為Internet的行家。

1.4網(wǎng)頁(yè)基本構(gòu)成元素

要學(xué)會(huì)制作網(wǎng)頁(yè)，首先需要了解網(wǎng)頁(yè)都是由什么元素構(gòu)成的。

文字：文本是構(gòu)成網(wǎng)頁(yè)的基本元素。一個(gè)最簡(jiǎn)單的網(wǎng)頁(yè)可以只有幾行文本。

圖片：正是有個(gè)各種美麗的圖片，網(wǎng)頁(yè)才變得多姿多彩。

動(dòng)畫(huà)：如今，網(wǎng)頁(yè)上的動(dòng)畫(huà)越來(lái)越多，最常用的有GIF動(dòng)畫(huà)、Flash動(dòng)畫(huà)等。

超連接：如上所述，超連接幾乎是必不可少的。一個(gè)沒(méi)有超連接的網(wǎng)頁(yè)，就如同汪洋大海中的一座孤島，失去了與外界的一切聯(lián)系。

其它元素：還可以在網(wǎng)頁(yè)中添加聲音、視頻等元素。

1.5軟件的安裝與啟動(dòng) 要使用網(wǎng)站設(shè)計(jì)軟件，自然先要將這些軟件安裝到自己的電腦中。安裝完畢，還需要如何啟動(dòng)，如何創(chuàng)建快捷方式。下面就讓我們來(lái)詳細(xì)地看一看具體的操作步驟。

1.5.1軟件的安裝

安裝之前，需要先了解軟件對(duì)系統(tǒng)的要求。以Windows為例，系統(tǒng)要求如下： Intel Pentium II處理器或等效處理器，主頻300MHz或更高。

Windows 98Windows 2000Windows NT(具有Service Pack 3 或更高版本)、Windows Me或Windows XP.Netscape Navigator 4.0版或更高版本或Microsoft Internet Explorer.96MB的可用內(nèi)存（RAM），建議采用128MB內(nèi)存。

分辨率可達(dá) 800×600像素的256色顯示器（建議顏色為百萬(wàn)顏色，分辨率達(dá)到1024×768像素）。CD-ROM 驅(qū)動(dòng)器。

檢查一下您的計(jì)算機(jī)，看是否具備了以上條件。如果具備，將“Macromedia Studio MX”程序會(huì)自動(dòng)運(yùn)行。如果不能自動(dòng)運(yùn)行，可以找到光盤(pán)放入光驅(qū)，安裝程序會(huì)自動(dòng)運(yùn)行?？梢哉业焦獗P(pán)中的“Install Macromedia Studio MX”程序或“Autorun”程序并雙擊運(yùn)行。

Dreamweaver的安裝比較容易，幾乎可以自動(dòng)完成。下面簡(jiǎn)要說(shuō)明一下安裝步驟。

操作步驟：

1、將安裝光盤(pán)放入光驅(qū)，安裝程序自動(dòng)運(yùn)行，并出現(xiàn)安裝界面。如果單擊安裝界面上的“Macromedia STUDIO MX安裝”，那么將會(huì)安裝其下方所列出的軟件。所有的安裝會(huì)自動(dòng)完成。

2、單擊Dreamweaver MX,開(kāi)始安裝過(guò)裝過(guò)程.先是出現(xiàn)解壓縮文件窗口,等待一會(huì)兒,便會(huì)出現(xiàn)安裝向?qū)?duì)話框。單擊“下一步”按鈕，繼續(xù)安裝過(guò)程。

3、出現(xiàn)“選擇目的地位置”對(duì)話框，默認(rèn)的盤(pán)是C盤(pán)，如果想安裝到不同的位置，可以單擊目的文件夾右邊的“瀏覽”按鈕，并在彈出的“選擇文件夾”對(duì)話框選擇不同的文件，如要安裝在D盤(pán)則可直接將路徑中的“C：”改為“D:”。也可以在下面的“目錄”中選擇其它的文件夾，設(shè)置完后，單擊“確定”，回到“選擇目的地址”對(duì)話框，單擊“下一步”繼續(xù)。

4、而后會(huì)出現(xiàn)“默認(rèn)編輯器”的對(duì)話框，默認(rèn)為全選。如果希望讓Dreamweaver MX成為下面所列文件類(lèi)型的默認(rèn)編輯器，那么可以在這里做選擇。選擇完畢，單擊“下一步”按鈕。

5、出現(xiàn)“開(kāi)始復(fù)制文件”對(duì)話框，單擊“下一步”安裝程序開(kāi)始復(fù)制文件，過(guò)幾分鐘后，安裝結(jié)束，單擊“結(jié)束”按鈕，結(jié)束安裝。

1.5.2 軟件啟動(dòng)

軟件安裝完畢后，我們就可以使用它了。安裝程序已經(jīng)自動(dòng)在“開(kāi)始”菜單中加入了快捷方式。

單擊“開(kāi)始”菜單，將鼠標(biāo)指針依次指向“程序”|“Macromedia”|“Macromedia MX”,并在上面單擊鼠標(biāo)左鍵。

1.5.3 創(chuàng)建快捷方式 使用“開(kāi)始”菜單啟動(dòng)程序的過(guò)程比較煩瑣?？梢栽赪indows桌面或快速啟動(dòng)欄上創(chuàng)建快捷方式，這樣可以快速的啟動(dòng)程序。

具體實(shí)現(xiàn)方法是：在“開(kāi)始”菜單中找到相應(yīng)程序的快捷方式，不過(guò)這是不要用鼠標(biāo)左鍵單擊，而是用右鍵按住向桌面拖動(dòng)，然后松開(kāi)右鍵，會(huì)出現(xiàn)一個(gè)快捷菜單，在其中可以選擇不同的命令，比如選擇“在當(dāng)前位置創(chuàng)建快捷方式”或“復(fù)制到當(dāng)前位置”。

這樣以后在運(yùn)行程序時(shí)，就方便快捷的多了。

1.6 制作網(wǎng)頁(yè)前的準(zhǔn)備

電腦必備：

電腦速度夠快，最好能夠上網(wǎng)。操作系統(tǒng)：Windows 98/NT/Me/2000/XP.軟件可選：

其它軟件：看圖軟件ACDSee、圖像處理軟件Photoshop、上傳工具CuteFTP、Fireworks、動(dòng)畫(huà)軟件Flash等。

1.7 Dreamweaver MX的操作環(huán)境

我們將工作界面分成了“標(biāo)題欄”、“菜單欄”、“快捷工具欄”、“屬性面板”、“浮動(dòng)控制面板”5個(gè)部分來(lái)分別介紹。

1.7.1 標(biāo)題欄 Dreamweaver MX的“標(biāo)題欄”中將顯示文字“Macromedia Dreamweaver MX”如果打開(kāi)網(wǎng)頁(yè)的話，在后面還會(huì)顯示該網(wǎng)頁(yè)的一些信息，如網(wǎng)頁(yè)標(biāo)題、所在位置及網(wǎng)頁(yè)名稱，右邊有三個(gè)鈕，分別對(duì)應(yīng)Dreamweaver MX的最大化最小化和關(guān)閉的操作。

1.7.2 菜單欄

“標(biāo)題欄”下面就是“菜單欄”，欄中提供了“文件”、“編輯”、“查看”、“插入”、“修改”、“文本”、“站點(diǎn)”、“窗口”、“幫助”10項(xiàng)菜單。單擊其中任意一項(xiàng)菜單，隨即就會(huì)出現(xiàn)一個(gè)下拉式指令菜單。有些指令的右邊會(huì)有鍵盤(pán)的代碼，這是該指令的快捷鍵，熟練使用快捷鍵將會(huì)有助于提高工作效率。有些指令的右邊會(huì)有一個(gè)小黑三角的標(biāo)記，它代表該指令還包含下一級(jí)的指令，鼠標(biāo)停留片刻即可顯示。

1.7.3 快捷工具欄

“快捷工具欄”指的是“菜單欄”下邊的3排按鈕，選擇菜單“查看/工具欄”，勾選里面的“插入”、“文檔”和“標(biāo)準(zhǔn)”3項(xiàng)，完整的快捷工具欄就顯現(xiàn)出來(lái)了。

1.7.4 屬性面板

在網(wǎng)頁(yè)編輯窗口的下面還有一個(gè)面板，它是有名的“屬性面板”，它在這個(gè)軟件中起到舉足輕重的作用。

屬性面板顧名思義，就是顯示，調(diào)整屬性的面板，根據(jù)鼠標(biāo)所選中對(duì)象的不同，“屬性面板”在界面上也會(huì)有所差異，用戶可以分別對(duì)不同的對(duì)象進(jìn)行調(diào)整。

第二章 網(wǎng)站制作實(shí)戰(zhàn)

2.1 站點(diǎn)

2.1.1 創(chuàng)建站點(diǎn)

要制作一個(gè)網(wǎng)站，第一步操作都是一樣的，就是要?jiǎng)?chuàng)造一個(gè)“站點(diǎn)”，這樣可以使整個(gè)網(wǎng)站的脈絡(luò)結(jié)構(gòu)清晰地展現(xiàn)在面前，避免了以后再進(jìn)行紛雜的管理。

從菜單中選擇“站點(diǎn)/管理站點(diǎn)”在彈出的對(duì)話框中選擇“新建”，之后再選擇其中的“站點(diǎn)”，再次彈出一個(gè)對(duì)話框，在文本框中輸入自己已經(jīng)企化好的網(wǎng)站名稱“追夢(mèng)人”。

填好后，單擊“下一步”，進(jìn)入下一個(gè)步驟。由于我要做的是一個(gè)靜態(tài)的網(wǎng)頁(yè)，所以選擇上面的一項(xiàng)“否，我不想使用服務(wù)器技術(shù)?！?單擊“下一步”，進(jìn)入下一個(gè)步驟。

在此選項(xiàng)中有兩個(gè)選擇，選擇推薦的“編輯我的計(jì)算機(jī)上的本地副本，完成后再上傳到服務(wù)器”。底下的文本框允許在本地磁盤(pán)上指定一個(gè)文件夾，Dreamweaver將在其中儲(chǔ)存站點(diǎn)文件的本地副本。單擊該文本框后面的文件夾圖標(biāo)，新建并指定一個(gè)空的文件夾“E:/ding”。之后單擊“下一步“，進(jìn)入下一個(gè)步驟。

這一步是如何設(shè)置連接到遠(yuǎn)程服務(wù)器，彈出式菜單中有6中選擇，這里選擇“無(wú)”。而后“下一步”再“完成”，即可。

2.1.2 創(chuàng)建站點(diǎn)內(nèi)容

站點(diǎn)創(chuàng)建完成后，就可以創(chuàng)建Web頁(yè)來(lái)填充站點(diǎn)了。在“右側(cè)浮動(dòng)面板組”中選擇“文件/文件”面板，此時(shí)整個(gè)網(wǎng)站中沒(méi)有任何內(nèi)容。用鼠標(biāo)右擊面板中的本地根目錄文件夾。在彈出的菜單中選擇“新建文件”，新建一個(gè)文件后將其命名為“index.htm(或index.html),它就是未來(lái)的首頁(yè)。

由于“追夢(mèng)人”網(wǎng)站分為“平面設(shè)計(jì)”、“動(dòng)畫(huà)制作”、“網(wǎng)文精品”、“經(jīng)典回顧”、“個(gè)人說(shuō)明“這五個(gè)大欄目，所以繼續(xù)用鼠標(biāo)右擊右側(cè)，在彈出的菜單中選擇第二項(xiàng)“New Folder（新建文件夾）”。執(zhí)行五次操作，新建五個(gè)文件夾，并把它們重命名為graph、anim、books、music、letter，分別對(duì)應(yīng)上面的五個(gè)大欄目。存放它們各自的內(nèi)容。之后再次新建1個(gè)文件夾，命名為images,用來(lái)存放“所有的圖象文件”的內(nèi)容。

之后在個(gè)欄目的文件夾里還要建立想相應(yīng)的欄目網(wǎng)頁(yè)。

2.2 首頁(yè)

2.2.1 設(shè)置首頁(yè)布局

每個(gè)網(wǎng)站都會(huì)有一個(gè)首頁(yè)，就功能上而言，它代表著一個(gè)網(wǎng)站的風(fēng)格與特色，就網(wǎng)站架構(gòu)上而言，它代表了網(wǎng)站的第一層架構(gòu)，至于網(wǎng)站上其他Web頁(yè)，原則上都必須通過(guò)首頁(yè)來(lái)連接散播出去，可見(jiàn)首頁(yè)是多么的重要。

首頁(yè)是打開(kāi)網(wǎng)站后在瀏覽器中顯示的第一個(gè)頁(yè)面。它是起什么名字通常要視Server端的設(shè)置，一般的有index.htm,default.htm或home.htm等，目前主要以index.htm的居多。當(dāng)然，后綴名為html也是正確的。

具體設(shè)置方法是：右健單擊“文件”浮動(dòng)面板中的index.htm,在彈出的菜單中選擇“設(shè)成首頁(yè)”。

首頁(yè)的布局有很多方法，在這里我所用到的是表格的“布局模式”?！安季帧蹦Ｊ街械谋砀穹Q為布局表格，單元格稱為布局單元格。在繪制布局表格和布局單元格時(shí)，必須從“標(biāo)準(zhǔn)”模式切換到“布局”模式。直接單擊“布局”按鈕即可。操作步驟：

1、在“插入快捷欄”的“布局”分類(lèi)中，單擊“布局表格”按紐。

2、將變成“+”形狀的鼠標(biāo)光標(biāo)放到編輯中網(wǎng)頁(yè)上，在要繪制的地方進(jìn)行拖動(dòng)就可以進(jìn)行創(chuàng)建了。（如果繪制的是第一個(gè)表格必須從網(wǎng)頁(yè)的最左上角開(kāi)始繪制）。

3、在這里要繪制多個(gè)表格，可以再次單擊“布局表格”按紐進(jìn)行繪制，也可以按住Ctrl鍵繪制多個(gè)表格。追夢(mèng)人”網(wǎng)站首頁(yè)的布局如圖所示：

2.2.2設(shè)置首頁(yè)的頁(yè)面屬性

首先雙擊“文件”浮動(dòng)面板中的index.htm,進(jìn)入頁(yè)面的編輯窗口。右健單擊空白區(qū)域，在菜單中選擇“頁(yè)面屬性”，之后彈出“頁(yè)面屬性”對(duì)話框，若選擇主菜單“修改/頁(yè)面屬性”項(xiàng)，也可以把打開(kāi)該對(duì)話框。

在“頁(yè)面屬性”對(duì)話框中，左側(cè)窗口顯示“分類(lèi)”，其中包括了“外觀”、“鏈接”、“標(biāo)題”、“標(biāo)題/編碼”、“跟蹤圖像”5項(xiàng)，右側(cè)區(qū)域則顯示各類(lèi)中可以設(shè)置的項(xiàng)目?！白穳?mèng)人”首頁(yè)設(shè)置的屬性如下圖所示：

2.2.3查看和編輯頭內(nèi)容

一個(gè)網(wǎng)頁(yè)文件結(jié)構(gòu)上實(shí)際是由兩部分組成，頭（head）內(nèi)容和主體（body）內(nèi)容主體內(nèi)容（body）是文檔的主要部分，也是包含文本和圖像等的可見(jiàn)部分。頭內(nèi)容（head）是除文檔標(biāo)題外的不可見(jiàn)部分，包含有文檔類(lèi)型、語(yǔ)言編碼、搜索引擎的關(guān)鍵的關(guān)鍵字和內(nèi)容指示器以及樣式定義等重要信息，這些元器并不是每個(gè)頁(yè)面都需要的，例如，可以僅為主頁(yè)提供關(guān)鍵字。

下面就以首頁(yè)為例，說(shuō)明怎樣插入較常用的頭（head）內(nèi)容。

單擊“菜單攔”下面“插入快捷”的下拉列表，選擇其中的HTML類(lèi)，此時(shí)右側(cè)將會(huì)顯示該類(lèi)中可以插入的對(duì)象快捷按鈕，再次單擊第2個(gè)按鈕“文件頭”旁邊的下拉箭頭，會(huì)彈出菜單，該項(xiàng)列出的便是即將插入的頭內(nèi)容。

2.2.4 插入圖像

圖像是網(wǎng)頁(yè)中不可或缺的組成成份，恰當(dāng)?shù)厥褂脠D像，可以使網(wǎng)站充滿生活生命力與說(shuō)服力，吸引更多的瀏覽者，加深他們欣賞你網(wǎng)站的意愿。

另一方面，網(wǎng)頁(yè)的容量大小是網(wǎng)站成功與否的一大關(guān)鍵因素。由于網(wǎng)絡(luò)在傳輸上的限制，導(dǎo)致了下載的速度不可能太快，因此，網(wǎng)頁(yè)的大小就不能太大，其中關(guān)鍵就在于圖像的大小了，否則瀏覽者會(huì)失去等待的耐心，無(wú)論你的網(wǎng)站多么精彩也無(wú)濟(jì)于事了。所以，在網(wǎng)面容量大小的問(wèn)題上一定要重視。下面就來(lái)詳細(xì)介紹對(duì)網(wǎng)頁(yè)圖像進(jìn)行處理的操作步驟，以使得它們?cè)诒３謭D形美麗與網(wǎng)站風(fēng)格搭配的基礎(chǔ)上，圖片文件能夠變的更小。

1、首先將光標(biāo)停留在要插入圖像的位置，然后單擊“菜單欄”下面“插入快健欄”的下拉表，選擇其中的“常用”類(lèi)，則右側(cè)將會(huì)顯示該類(lèi)中可以插入的對(duì)象快鍵按鈕。左起第5個(gè)即為“圖像：圖像”按鈕，單擊它右側(cè)的下拉列表，選擇第1項(xiàng)“圖像”。

2、隨即彈出“選擇圖像源文件”對(duì)話框。從計(jì)算機(jī)磁盤(pán)中選擇想要插入的圖像文件，或在URL編輯框中輸入圖像的路徑和名稱。下面的“相對(duì)于”下拉表框中，可選擇文件URL地址的類(lèi)型，如果選擇“文檔”選項(xiàng)，表示圖像地址相對(duì)于當(dāng)前文檔；如果選擇“站點(diǎn)根目錄”選項(xiàng)，表示地址相對(duì)于根目錄。在這里我要插入的是網(wǎng)站標(biāo)志logo，插入logo圖象，如圖所示：

最后單擊“確定”按鈕，即可完成插入圖像的操作。2.2.5插入多媒體

在Dreamweaver MX2004中，除了之前講到的可以插入“圖像”外，還可插入動(dòng)畫(huà)、聲音、視頻等媒體元素，如Flash,Shockwave,Applets,ActieX及格Midi聲音文件等，并且還可以在Dreamweaver自身內(nèi)插入Macromedia Flash MX2004按鈕和文本對(duì)象，以及進(jìn)行相關(guān)的后期處理和添加設(shè)計(jì)備注等操作。

在Dreamweaver MX 2004文檔中，可以插入媒體文件包括Flash Shockwave影片、QuickTime、AVI java、applet Active X控件以及各種格式的音頻文件。要在瀏覽器中播放放Flash 動(dòng)畫(huà)，必須在瀏覽器中集成“Flash 播放器（Flash Player）”。其中，Internet Explorer通過(guò)ActiveX控制來(lái)實(shí)現(xiàn)，Netscape Navigator則是通過(guò)相應(yīng)的插件來(lái)實(shí)現(xiàn)的。在最新的Netscape Navigator和Internet Explorer瀏覽器中，均已集成了 Flash動(dòng)畫(huà)播放功能。操場(chǎng)作步驟：

步驟1 將光標(biāo)停留在要插入Flash的位置，然后單擊菜單欄下面“插入快捷欄”的下拉列表，選擇其中的“常用”分類(lèi)，右側(cè)將會(huì)顯示該類(lèi)中可以插入的對(duì)象快捷按鈕。左起第6個(gè)即為“媒體”按鈕，單擊它右側(cè)的下拉列表，選擇第1項(xiàng)Flash圖標(biāo)。

步驟2 在彈出的對(duì)話框中選擇擴(kuò)展名為swf 的Flash文件，即可將其插入到Dreamwe aver的“網(wǎng)頁(yè)編輯窗口”中，可以看到，在這個(gè)窗口中Flash文件的大小。在這里我的主頁(yè)插入的一個(gè)動(dòng)畫(huà)，如圖所示：

2.2.6插入文本 文字是人類(lèi)語(yǔ)言最基本的表達(dá)方式，在網(wǎng)頁(yè)中，文本內(nèi)容也可以說(shuō)是重要的組成部分，一個(gè)網(wǎng)站成功與否，它是最關(guān)鍵的因素。在這最關(guān)鍵的因素?？韶S富網(wǎng)站的文字內(nèi)容，并以最最美觀、最整齊的方式放入到網(wǎng)頁(yè)中。插入文本的兩種方式

網(wǎng)頁(yè)中需要大量的文本，我們或以通過(guò)以下兩種方式插入它們。

一種是在網(wǎng)頁(yè)編輯窗口中直接用鍵盤(pán)敲入文本。這可以算是最基本的輸入方式了，和一些文本編輯軟件（如Microsoft Word）的使用方法一樣，選擇好習(xí)慣的輸入法，就可以運(yùn)指如飛了。

另一種是復(fù)制文本的方式。有些讀者可能不喜歡使用Dreamweaver MX2004來(lái)進(jìn)行打字的工作，而更習(xí)慣在專(zhuān)門(mén)的文本編輯軟件中快速打字，如Microsoft Word和 Windows自帶的記事本等，又或者讀者已經(jīng)準(zhǔn)備好了要放入網(wǎng)頁(yè)的文本的電子版本，那么我們就可以直接使用Dreamweaver的文本復(fù)制功能，將大段的文本內(nèi)容拷貝到網(wǎng)頁(yè)的編輯窗口來(lái)進(jìn)行排版的工作，具體步驟如下。

打開(kāi)文本編輯軟件（如Microsoft Word），選中要復(fù)制的文本，它們將反白顯示，執(zhí)行菜單“編輯/復(fù)制”命令或直接用快捷鍵Ctrl+C，之后切換回Dreamweaver,將光標(biāo)停留在插入文本的位置，執(zhí)行主菜單“編輯/粘貼”命令或直接使用快捷鍵Ctrl+v,即可將大段的文本快速粘貼到網(wǎng)頁(yè)中。

這在我的“網(wǎng)文精品”中用到很多，全部是在word軟件中排好ctrl+c,然后點(diǎn)擊要粘貼的位置，crtl+v到Dreamweaver即可。

2.3創(chuàng)建其它網(wǎng)頁(yè)

還有其它的幾個(gè)網(wǎng)站與主頁(yè)的制作相同，一個(gè)網(wǎng)頁(yè)是圖象和文字的組合。“平面設(shè)計(jì)”中的圖象插入和前面的介紹相似，并可以在屬性攔中調(diào)節(jié)圖象的大小。在Dreamwerver中常常會(huì)用到Firework、Flash，它們是相輔相成，在主頁(yè)中的主體部分就是用Firework,如圖所示：

在“個(gè)人說(shuō)明”中也用到這點(diǎn)，首先定好需要尺寸，在屬性中設(shè)好背景，顏色等等，插入圖象，輸入文字，也word里的操作雷同。

第三章 建立網(wǎng)頁(yè)鏈接

網(wǎng)站實(shí)際上是由很多網(wǎng)頁(yè)組成的，那么網(wǎng)頁(yè)之間是如何聯(lián)系的呢？這就是本章要講的內(nèi)容----網(wǎng)頁(yè)的“鏈接”。

“鏈接”，又稱“超鏈接"（Hyperlink）,它作為網(wǎng)頁(yè)的橋梁，起著相當(dāng)重要的作用。網(wǎng)頁(yè)中的很多對(duì)象都可以加入“鏈接”屬性。在Dreamweaver MX2004中，如果以“鏈接”的媒介來(lái)劃分的話，則“鏈接”可以分為“文字鏈接”、“圖像鏈接”、“圖像地圖鏈接”、“內(nèi)部鏈接和外部鏈接”、“E-mail鏈接”、“命名錨記鏈接”、“文件下載鏈接”和“跳轉(zhuǎn)菜單”，共8種。其中部分內(nèi)容在之前的章節(jié)中可能接觸過(guò)，這里將對(duì)其進(jìn)行更深入的講解。

3.1文字鏈接

“文字鏈接”即以文字作為媒介的鏈接，它是網(wǎng)頁(yè)中最常被使用的鏈接方式，具有“文件小、制作簡(jiǎn)單和便于維護(hù)”的特點(diǎn)。

接下來(lái)結(jié)合我的個(gè)人網(wǎng)站為實(shí)例，來(lái)講解如何為文字建立“鏈接”。具體操作步驟如下所述。操作步驟

步驟1 準(zhǔn)備好已經(jīng)制作完成的首頁(yè)的各個(gè)欄目頁(yè)面（假設(shè)除了“鏈接”，其他內(nèi)容都已經(jīng)制作完成了），該網(wǎng)站包含6個(gè)欄目，這里的5個(gè)欄目----“平面設(shè)計(jì)”、“動(dòng)畫(huà)制作”和“網(wǎng)文精品”、“經(jīng)典回顧”、“個(gè)人說(shuō)明”為例來(lái)進(jìn)行講解。

步驟2 在Dreamweaver 中打開(kāi)首頁(yè)，之后反白選取作為“鏈接”的文字。實(shí)例中要做到單擊不同的欄目的網(wǎng)頁(yè)。因此為第1個(gè)欄目“平面設(shè)計(jì)”設(shè)置鏈接，首先要反白選中“平面設(shè)計(jì)”4個(gè)文字。

步驟3 觀察“屬性面板”，其中包括一個(gè)“鏈接”文本框。步驟4 接下來(lái)需要把鏈接的地址加入到文本框中，方法有3種。

這里我用到的是直接點(diǎn)擊文件夾圖標(biāo)，在文件夾中找到要鏈接的對(duì)象graph.htm。這樣就建立了超鏈接。不過(guò)有點(diǎn)很重要，由于大多數(shù)服務(wù)器都不支持中文文件名，而且對(duì)大小寫(xiě)敏感，因此采用英文文件名并統(tǒng)一大小寫(xiě)。如圖所示：

步驟5 在“鏈接”文本框下面還有一個(gè)“目標(biāo)”下拉列表，從中可以選擇鏈接網(wǎng)頁(yè)顯示的窗口方式，共有4種。如圖：

實(shí)例中沒(méi)有選擇任何選項(xiàng)，保持空白，表示在原窗口中打開(kāi)鏈接網(wǎng)頁(yè)。

步驟6 還可以設(shè)置一些“鏈接”的屬性，這是前面講過(guò)的內(nèi)容。單擊“屬性面板”中的“頁(yè)面屬性”，選擇其中的“鏈接”分類(lèi)，可以進(jìn)行的設(shè)置有“鏈接字體”、“大小”、“鏈接顏色”、“變換圖像鏈接”顏色、“已訪問(wèn)鏈接”顏色、“活動(dòng)鏈接”顏色及“下劃線樣式”。

步驟7 至此，第1個(gè)欄目的鏈接就制作完畢了，按下Ctrl+S保存網(wǎng)頁(yè)，再按下F12預(yù)覽，測(cè)試一下，當(dāng)鼠標(biāo)放在“平面設(shè)計(jì)”這4個(gè)文字上時(shí)將變成手形，并且瀏覽器窗口下面的狀態(tài)欄中會(huì)顯示鏈接到的網(wǎng)頁(yè)的地址，單擊文字，頁(yè)面會(huì)立即跳轉(zhuǎn)到第1個(gè)欄目中，這表示鏈接已經(jīng)制作成功了。

步驟8 同理，按照以上步驟，再為“動(dòng)畫(huà)制作”和“網(wǎng)文精品”“經(jīng)典回顧“等其它欄制作指向?qū)?yīng)欄目的鏈接。

步驟9 通常在欄目頁(yè)面中還需要有“返回首頁(yè)”的鏈接，單擊其后可以跳轉(zhuǎn)回首頁(yè)，因此在各個(gè)欄目中還要插入“網(wǎng)站首頁(yè)”的文字，并且制作指向首頁(yè)index.html的鏈接，制作方法不變。

至此，整個(gè)“文字鏈接”的實(shí)例就全就全部完成了。通過(guò)對(duì)這個(gè)實(shí)例的講解，讀者不僅應(yīng)該學(xué)會(huì)如何為文字制作鏈接，還應(yīng)用對(duì)“鏈接”有了更加深刻的理解，鏈接的目的何在？它到底能夠在網(wǎng)頁(yè)的網(wǎng)站中發(fā)揮什么樣的作用？怎樣才能更好地使用它？這些是網(wǎng)頁(yè)制作者更應(yīng)該思考的問(wèn)題。下面繼續(xù)介紹其他類(lèi)型的鏈接。

3.2圖像鏈接

“圖像”也是常被使用的鏈接媒體，它和“文字鏈接”非常相似。為圖像加入鏈接，首先應(yīng)該在網(wǎng)頁(yè)中插入“圖像”，有關(guān)插入“圖像”或“導(dǎo)航條”按鈕的內(nèi)容，接下來(lái)以我的網(wǎng)站“追夢(mèng)人“為例，講解如何建立“圖像鏈接”。操作步驟

步驟1 首先仍然要準(zhǔn)備好已經(jīng)制作完成的首頁(yè)和各個(gè)欄目的頁(yè)面（假設(shè)除了“鏈接”，其他內(nèi)容都已經(jīng)制作完成了），該網(wǎng)站包含6個(gè)欄目，下面我們就動(dòng)手為這6個(gè)欄目分別制作它們的鏈接。

步驟2 在Dreamweaver中打開(kāi)網(wǎng)站的首頁(yè)，之后選取要制作“鏈接”的圖像。實(shí)例中先為第3個(gè)欄目“動(dòng)畫(huà)制作”設(shè)置鏈接，因此選中包含“動(dòng)畫(huà)制作”4個(gè)字的圖像。步驟3 觀察“屬性面板”，在“鏈接”文本框中輸入鏈接的文字地址?？梢允褂弥爸v過(guò)的“指向文件”和“選擇文件”的方法。

步驟4 如果有需要，可以在“目標(biāo)”下拉列表中選擇“鏈接”網(wǎng)頁(yè)顯示的窗口方式，分別為-blank、-parent、-self或 top。實(shí)例中使用了默認(rèn)出的保留空白選項(xiàng)的方式。

步驟5 另外，讀者還可以為圖像增加“替代”文本。實(shí)例中為第1個(gè)欄目增加欄目名稱的“替代”文本。

步驟6 至此，第1個(gè)欄目的圖像鏈接就制作完畢了，按下Ctrl+S保存網(wǎng)頁(yè)，再按下F12預(yù)覽，測(cè)試一下，將鼠標(biāo)放在“動(dòng)畫(huà)制作”4個(gè)文字上時(shí)將變成手形，同時(shí)瀏覽器窗口下面的狀態(tài)欄中會(huì)顯示出鏈接到的網(wǎng)頁(yè)的地址，并且會(huì)顯示出“替代”文本“動(dòng)畫(huà)制作”，單擊文字，頁(yè)面會(huì)立即跳轉(zhuǎn)到第3個(gè)欄目中，這表示鏈接已經(jīng)制作成功了。步驟7 同理，按照以上步驟，再為其它幾幅圖像制作指向?qū)?yīng)欄目的鏈接。

步驟8 在欄目頁(yè)面中制作“返回首頁(yè)”的鏈接，使得單擊后可以跳轉(zhuǎn)回首頁(yè)，其制作方法不變。

至此，整個(gè)“圖像鏈像”的實(shí)例就全部完成了。

3.3E –Mail的鏈接

E-Mail鏈接，是指當(dāng)瀏覽者單擊該鏈接之后，不是打開(kāi)一個(gè)網(wǎng)頁(yè)文件，而是啟動(dòng)用戶的E-Mail客戶端軟件（如Outlook Express）,并打開(kāi)一個(gè)空白的新郵件，供瀏覽者撰寫(xiě)內(nèi)容來(lái)與網(wǎng)站聯(lián)系人聯(lián)系，這是一種最方便的互動(dòng)方式。結(jié)合“個(gè)人說(shuō)明”網(wǎng)頁(yè)，建立E-Mail鏈接的步驟如下所述。操作步驟 步驟1 將光標(biāo)停留在頁(yè)面右下角要插入E-mail鏈接的位置。

步驟2 選擇“插入快捷欄”中的“常用”分類(lèi)，單擊左側(cè)第2個(gè)“電子郵件鏈接”按鈕。

步驟3 在彈出的“電子郵件鏈接”對(duì)話框中有兩個(gè)輸入項(xiàng)，分別是“文本”和“E-Mail”。在“文本”項(xiàng)中輸入鏈接的文字，中文、英文均可，在E-Mail項(xiàng)中輸入網(wǎng)站聯(lián)系有的電子郵件地址，如實(shí)例中的 ding_zhuimeng123@163.net。

步驟4 單擊“確定”按鈕，具有“E-Mail鏈接”屬性的文本就ding_zhuimeng123@163.net。插入到光標(biāo)所在位置了，按下 Ctrl+S保存網(wǎng)頁(yè)，再按下F12預(yù)覽查看實(shí)際效果。上面的方法只適用于文本的“E-Mail鏈接”，如果想在其它的對(duì)象（如圖像）上也加入這種鏈接，該怎辦呢？下面介紹第2種建立“E-Mail鏈接”的方法。

其實(shí)很簡(jiǎn)單，與前面講過(guò)的圖像加入鏈接的方法基本一樣。先在頁(yè)面中需要的地方插入圖像，之后選中圖像，并在“屬性面板”的“鏈接”文本框中輸入如下語(yǔ)句即可----mailto: ding_zhuimeng123@163.net ?subject=網(wǎng)站的建議與第1種方法不同的是，E-Mail 地址前面增加了mailto:字樣。用這種方法就可以給圖像等其他對(duì)象建立“E-Mail鏈接”了。

3.4文件下載鏈接

“文件下載鏈接”的原理很簡(jiǎn)單，只要鏈接文件屬于瀏覽無(wú)法識(shí)別的關(guān)型，便都會(huì)使用IE瀏覽器直接進(jìn)行下載，并保存到本地計(jì)算機(jī)中。

瀏覽器無(wú)法識(shí)別的文件類(lèi)型有很多，這里就介紹一個(gè)最常用的，以zip或rar為后綴名的壓縮格式文件，這種文件可以使用主流的壓縮軟件（如winzip、winrar）來(lái)制作。下面我們就業(yè)以實(shí)例來(lái)說(shuō)明。在前面“插入多媒體”一章中，我們?cè)?jīng)講過(guò)直接鏈接文件的方式來(lái)插入“視頻”，即直接在“鏈接”文本框中輸入“文件名+名后綴名”，如olympus.wmv。單日擊這個(gè)鏈接，經(jīng)過(guò)數(shù)據(jù)下載后，Windows系統(tǒng)將啟動(dòng)自帶的媒體播放器Windows Media Player 來(lái)播放該視頻。操作步驟

步驟1 先將視頻文件olympus.wmv通壓縮成olympus.rar文件，放入站點(diǎn)的media文件夾下。

步驟2 將文件路徑輸入至“鏈接”文本框中。

步驟3 保存網(wǎng)頁(yè)，按下F12預(yù)覽，在瀏覽器中單擊“下載精彩廣告視頻”鏈接文本，會(huì)彈出“文本下載”選擇框，單擊其中的“保存”按鈕。

步驟4 在“另存為”對(duì)框中選擇保存到本地計(jì)算機(jī)中的位置，實(shí)例中為“經(jīng)典回顧”文件夾。之后單擊“保存”按鈕，壓縮文件即保存到該位置中。至此，“文件下載鏈接”便制作完成了。讀者可以打開(kāi)“我的文檔”文件夾，解壓縮olympus.rar文件，隨時(shí)欣賞下載影片。

本設(shè)計(jì)中未用到此鏈接，在此只作簡(jiǎn)單介紹。

3.5在HTML語(yǔ)言中建立網(wǎng)頁(yè)鏈接

3.5.1文字鏈接

在HTML語(yǔ)言中用超鏈接標(biāo)記指向一個(gè)目標(biāo)。其基本格式為： 舉個(gè)簡(jiǎn)單的“文本鏈接”的實(shí)例，該實(shí)例相對(duì)應(yīng)的HTML代碼如下所示。

a href-“index2.html”target=”-blank”>平面設(shè)計(jì)（新開(kāi)窗口，-blank)

動(dòng)畫(huà)制作（原窗口，默認(rèn)為空）

網(wǎng)文精品

第三篇：php校園網(wǎng)站的設(shè)計(jì)與實(shí)現(xiàn)論文

XxxxxxxxxxXXX學(xué)校

2013年畢業(yè)設(shè)計(jì)（論文）

華航校園網(wǎng)網(wǎng)站的設(shè)計(jì)與實(shí)現(xiàn)

學(xué) 院: 專(zhuān) 業(yè): 班 級(jí): 學(xué) 號(hào): 學(xué)生姓名: 指導(dǎo)教師:

2012年X月X日 摘要

校園網(wǎng)站是學(xué)校對(duì)外宣傳的窗口，也是展示全校師生才能，加強(qiáng)對(duì)校外聯(lián)系，互相學(xué)習(xí)，共同發(fā)展的陣地，學(xué)校網(wǎng)站建設(shè)的目的是促進(jìn)師生與學(xué)校共同發(fā)展。校園網(wǎng)是高校的重要宣傳窗口與工作平臺(tái)，隨著網(wǎng)絡(luò)規(guī)模的擴(kuò)大與校園網(wǎng)功能的變化，校園網(wǎng)網(wǎng)站設(shè)計(jì)的要求也相應(yīng)會(huì)有變化，一個(gè)功能齊全、界面優(yōu)雅、操作方便的校園網(wǎng)才能更好地展現(xiàn)學(xué)校的面貌。本文設(shè)計(jì)的華航校園網(wǎng)網(wǎng)站的主要介紹了學(xué)校概況、學(xué)校科研、圖書(shū)館管理、招生就業(yè)、教師招聘和相關(guān)機(jī)構(gòu)等主題，基本上能滿足大家對(duì)學(xué)校各個(gè)方面信息的了解，也有助于學(xué)校的招生和有助于學(xué)校師生的發(fā)展。

本文介紹的華航校園網(wǎng)系統(tǒng)是在Windows xp操作系統(tǒng)下，以MYSQL為數(shù)據(jù)庫(kù)開(kāi)發(fā)平臺(tái)，用IIS（Internet Information Server）網(wǎng)絡(luò)信息服務(wù)為應(yīng)用服務(wù)器，采用PHP(Active Server Page)語(yǔ)言開(kāi)發(fā)和設(shè)計(jì)的。本系統(tǒng)的基本功能：數(shù)據(jù)進(jìn)行錄入、修改、刪除、查詢、統(tǒng)計(jì)的基本功能。

關(guān)鍵詞：MYSQL ；網(wǎng)上商城；PHP;School site is the school's external propaganda window, but also show teachers and students ability, strengthen the out-of-school, learn from each other, common development positions, school construction site aims to promote the common development of teachers and students and school.Campus network is an important window for the publicity and working platform in Colleges and universities, with the change of network scale and the function of campus network, campus network design requirements will change, a full-featured, campus network in order to better interface, convenient operation and elegant display of school look.In this paper, the design of cal campus network mainly introduced the profile of the school, the school scientific research, library management, recruitment and employment, teacher recruitment and related institutions such as the theme, basically can satisfy your understanding of all aspects of school information, also contribute to the school enrollment and contribute to the development of the school teachers and students.Cal campus network system was introduced in the Windows XP operating system, using MYSQL database development platform, using IIS(Internet Information Server)network information service as the application server, using PHP(Active Server Page)language development and design.The basic functions of the system: the basic function of data entry, modify, delete, query, statistics..3

目錄

1.緒論....................................................................6

1.1系統(tǒng)開(kāi)發(fā)背景和意義..................................................................................................................................6 1.2系統(tǒng)實(shí)現(xiàn)目標(biāo)............................................................................................................錯(cuò)誤！未定義書(shū)簽。

2.文獻(xiàn)綜述...............................................錯(cuò)誤！未定義書(shū)簽。

2.1研究背景和意義.........................................................................................................錯(cuò)誤！未定義書(shū)簽。2.2相關(guān)研究綜述與分析..................................................................................................錯(cuò)誤！未定義書(shū)簽。

3.系統(tǒng)分析................................................................7

3.1可行性分析.................................................................................................................................................7

3.1.1經(jīng)濟(jì)上的可行性..................................................................................................................7 3.1.2技術(shù)上的可行性..................................................................................................................8 3.1.3操作上的可行性..................................................................................................................8 3.2需求分析.....................................................................................................................................................8 3.3業(yè)務(wù)管理需求分析...................................................................................................................................10 3.4數(shù)據(jù)流程分析............................................................................................................................................11

4.系統(tǒng)設(shè)計(jì)...............................................................12

4.1系統(tǒng)體系結(jié)構(gòu)...........................................................................................................................................12 酒店預(yù)訂系統(tǒng)設(shè)計(jì)的是基于瀏覽器/服務(wù)器（B/S）技術(shù)的管理系統(tǒng)，解決傳統(tǒng)的客戶端/服務(wù)器模型結(jié)構(gòu)存在的客戶端（C/S）維護(hù)煩瑣的問(wèn)題，維護(hù)相對(duì)簡(jiǎn)單，具有良好的系統(tǒng)擴(kuò)展性，方便管理。......12 4.2 開(kāi)發(fā)軟件...................................................................................................................................................13

4.2.1 ASP技術(shù)............................................................................................................................13 4.2.2 Internet服務(wù)管理器......................................................................................................13 4.2.3 Microsoft SQL Server...................................................................................................15 4.2.4Macromedia Dreamweaver 8.............................................................................................15 4.3數(shù)據(jù)庫(kù)設(shè)計(jì)...............................................................................................................................................17 4.4系統(tǒng)的軟硬件平臺(tái)...................................................................................................................................17

5．系統(tǒng)操作說(shuō)明..........................................................19

5.1系統(tǒng)用戶管理...........................................................................................................................................19 5.2會(huì)議室管理................................................................................................................錯(cuò)誤！未定義書(shū)簽。

5.2.1添加會(huì)議室........................................................................................錯(cuò)誤！未定義書(shū)簽。

5.2.2管理會(huì)議室........................................................................................錯(cuò)誤！未定義書(shū)簽。

6.軟件測(cè)試與分析.........................................................23

6.1系統(tǒng)測(cè)試的定義.......................................................................................................................................23 6.2系統(tǒng)測(cè)試的目的及意義............................................................................................................................23 6.3系統(tǒng)測(cè)試的重要性...................................................................................................................................23 6.4系統(tǒng)測(cè)試的常用方法................................................................................................................................24 6.5測(cè)試環(huán)境與測(cè)試條件................................................................................................................................25 6.6系統(tǒng)運(yùn)行情況...........................................................................................................................................25 6.7測(cè)試總結(jié)...................................................................................................................................................26

7.結(jié)論...................................................................26

7.1系統(tǒng)的特點(diǎn)...............................................................................................................................................26 7.2系統(tǒng)的不足和改進(jìn)...................................................................................................................................26 7.3設(shè)計(jì)收獲與心得.......................................................................................................................................26

致 謝..................................................................28 參 考 文 獻(xiàn)..............................................................29

1.緒論

1.1學(xué)校簡(jiǎn)介

北華航天工業(yè)學(xué)院是一所“中央與地方共建、以地方管理為主”的公辦普通本科院校，是服務(wù)國(guó)家（航天）特殊需求人才碩士專(zhuān)業(yè)學(xué)位研究生教育試點(diǎn)單位。學(xué)校坐落在河北省廊坊市市區(qū)，始建于1978年，先后隸屬于第八機(jī)械工業(yè)總局、第七機(jī)械工業(yè)部、航天工業(yè)部、航空航天工業(yè)部、航天工業(yè)總公司。1999年劃轉(zhuǎn)到河北省，2003年河北省人民政府與中國(guó)航天科技集團(tuán)公司、中國(guó)航天科工集團(tuán)公司簽署協(xié)議共建學(xué)校，并在學(xué)校設(shè)立了獎(jiǎng)教金和獎(jiǎng)學(xué)金。著名運(yùn)載火箭與衛(wèi)星技術(shù)專(zhuān)家、國(guó)家最高科學(xué)技術(shù)獎(jiǎng)獲得者孫家棟院士為學(xué)校名譽(yù)校長(zhǎng)。

學(xué)校占地面積753畝，分東、西兩個(gè)校區(qū)，總建筑面積近30萬(wàn)平方米。校園環(huán)境優(yōu)雅，是省市區(qū)三級(jí)文明單位、花園式單位、安全工作先進(jìn)單位和衛(wèi)生、綠化工作先進(jìn)單位。

學(xué)校有教師550多名，其中高級(jí)職稱教師219名，博士、碩士學(xué)位教師417名，具有行業(yè)背景或“雙師型”教師占20%以上。獲得省級(jí)教學(xué)名師、省級(jí)優(yōu)秀骨干教師等省級(jí)以上稱號(hào)的教師18名，獲得航天科技人才培訓(xùn)基金會(huì)SHATF獎(jiǎng)教金的教師29名。

學(xué)校設(shè)有機(jī)械工程系、電子工程系、經(jīng)濟(jì)管理系、建筑工程系、計(jì)算機(jī)科學(xué)與工程系、會(huì)計(jì)系、外語(yǔ)系、材料工程系、文法系、基礎(chǔ)科學(xué)部、體育部、工程技術(shù)訓(xùn)練中心、成人教育學(xué)院等13個(gè)教學(xué)單位。現(xiàn)有20個(gè)本科、18個(gè)專(zhuān)科招生專(zhuān)業(yè)。學(xué)校是一所以工為主，工、管、經(jīng)等學(xué)科相互支撐、協(xié)調(diào)發(fā)展的普通本科院校。有省重點(diǎn)發(fā)展學(xué)科1個(gè)；省級(jí)優(yōu)秀教學(xué)團(tuán)隊(duì)1個(gè)、本科教育創(chuàng)新高地1個(gè)、重點(diǎn)建設(shè)品牌特色專(zhuān)業(yè)2個(gè)、國(guó)家級(jí)和省級(jí)精品課程8門(mén)?，F(xiàn)有全日制普通本專(zhuān)科在校生11580人、成人高等教育本專(zhuān)科在校生2144人。建校以來(lái)，累計(jì)為社會(huì)輸送各類(lèi)人才3萬(wàn)余名，其中為航天系統(tǒng)輸送近萬(wàn)名畢業(yè)生，先后獲得中國(guó)航天科技集團(tuán)公司頒發(fā)的“航天人才貢獻(xiàn)獎(jiǎng)”（2003-2007）和“航天人才突出貢獻(xiàn)獎(jiǎng)”（2006-2010年）。

學(xué)校建有34個(gè)教學(xué)科研儀器設(shè)備先進(jìn)的實(shí)驗(yàn)室（中心），教學(xué)科研儀器設(shè)備總值9364萬(wàn)元。有“精密光柵位移傳感器制造與檢測(cè)技術(shù)”河北省工程實(shí)驗(yàn)室、河北省高校“先進(jìn)制造與生產(chǎn)過(guò)程自動(dòng)化應(yīng)用技術(shù)研發(fā)中心”等兩個(gè)省 級(jí)科技創(chuàng)新平臺(tái)；“廊坊市CAD/CAM/CIMS應(yīng)用技術(shù)推廣中心”、“廊坊市物聯(lián)網(wǎng)與自動(dòng)化技術(shù)實(shí)驗(yàn)室”、“華航-燕嶺現(xiàn)代制造與信息工程技術(shù)研發(fā)中心”等3個(gè)市級(jí)科技創(chuàng)新平臺(tái)。

學(xué)校圖書(shū)館2.6萬(wàn)平方米，館藏紙質(zhì)圖書(shū)85萬(wàn)冊(cè)，數(shù)字資源量2萬(wàn)多GB（其中，電子圖書(shū)67萬(wàn)冊(cè)），中外文現(xiàn)刊近千種。學(xué)校有8000多個(gè)多媒體教室座位，有近2000個(gè)圖書(shū)館閱覽座位，有設(shè)備先進(jìn)的語(yǔ)音室和視聽(tīng)室。學(xué)生住宿實(shí)行公寓化管理，環(huán)境整潔安寧，配套設(shè)施齊全，宿舍全部連通了校園網(wǎng)，是省級(jí)學(xué)生公寓先進(jìn)單位。學(xué)生食堂管理嚴(yán)格，服務(wù)規(guī)范，是省級(jí)高校標(biāo)準(zhǔn)化學(xué)生食堂。學(xué)校為學(xué)生提供了良好的學(xué)習(xí)和生活環(huán)境。

1.2系統(tǒng)研究背景和意義

校園網(wǎng)絡(luò)是指在校園范圍內(nèi)，將計(jì)算機(jī)以相互共享資源（硬件、軟件和數(shù)據(jù)）的方式連接起來(lái)，同時(shí)具有進(jìn)行教學(xué)、管理和信息服務(wù)等功能的計(jì)算機(jī)系統(tǒng)的集合。在校園網(wǎng)的建設(shè)中應(yīng)本著實(shí)用性原則、可靠性原則、先進(jìn)性原則、擴(kuò)展性原則、安全性原則、經(jīng)濟(jì)性原則、標(biāo)準(zhǔn)性原則進(jìn)行開(kāi)發(fā)。同時(shí)，要考慮校園網(wǎng)的規(guī)劃管理，聯(lián)網(wǎng)經(jīng)濟(jì)，技術(shù)換代時(shí)新技術(shù)的采用以及舊的設(shè)施沿用的繼承性和兼容性，網(wǎng)絡(luò)工程方面的問(wèn)題以及校園網(wǎng)應(yīng)用問(wèn)題。

學(xué)校教育是以管理者、教師和學(xué)生為主體，以傳授知識(shí)、教書(shū)育人為目的的綜合活動(dòng)過(guò)程，從信息和資源管理理論上看，它是一個(gè)通過(guò)教學(xué)環(huán)境、利用信息資源完成三者之間信息流傳遞轉(zhuǎn)換的過(guò)程。校園網(wǎng)系統(tǒng)的建設(shè)應(yīng)能滿足學(xué)校教學(xué)的需要，滿足學(xué)校管理的需要，滿足與Internet連接的需要。同時(shí)，要努力創(chuàng)設(shè)出一個(gè)符合學(xué)生身心健康發(fā)展需要的校園網(wǎng)絡(luò)文化環(huán)境。

2.系統(tǒng)分析

2.1可行性分析

2.1.1經(jīng)濟(jì)上的可行性

（1）前期投入資金比較少，只需要平臺(tái)系統(tǒng)的開(kāi)發(fā)、域名和空間的購(gòu)買(mǎi)費(fèi)用，如果需要可再購(gòu)買(mǎi)一臺(tái)服務(wù)器。（2）接下來(lái)就是資料的錄入工作。管理員登陸系統(tǒng)后臺(tái)，可對(duì)相關(guān)的資料進(jìn)行錄入、編輯等工作即可。

（3）中后期主要工作就是維護(hù)更新，工作量不大，只需一位管理人員來(lái)完成。

從經(jīng)濟(jì)上來(lái)說(shuō)，建設(shè)這樣一個(gè)系統(tǒng)是可行的。2.1.2技術(shù)上的可行性

技術(shù)可行性研究是研究現(xiàn)有的技術(shù)條件能否順利完成開(kāi)發(fā)工作，硬、軟件配置能否滿足開(kāi)發(fā)的需要等等。配置稍好的PC機(jī)，Winxp操作系統(tǒng)，IIS服務(wù)器，MySQL軟件，結(jié)合PHP語(yǔ)言，可以完成目標(biāo)系統(tǒng)的建設(shè)，從技術(shù)上來(lái)說(shuō)是容易實(shí)現(xiàn)的。

2.1.3操作上的可行性

首先，設(shè)計(jì)網(wǎng)站的幾種軟件現(xiàn)在都比較流行，一般設(shè)計(jì)人員對(duì)這幾款軟件比較熟悉，可以利用這些軟件設(shè)計(jì)出較完善的華航校園網(wǎng)。其次，系統(tǒng)的管理主要是信息的錄入、修改、統(tǒng)計(jì)等工作，一般工作人員都能夠勝任。從操作上來(lái)說(shuō)是可行的。

綜上所述，從各方面來(lái)看，我們?cè)诂F(xiàn)行條件下可以設(shè)計(jì)出較合適的平臺(tái)系統(tǒng)，完成客戶對(duì)會(huì)議的預(yù)訂。

2.2系統(tǒng)功能需求分析

通過(guò)前期的調(diào)查分析及研究，對(duì)本系統(tǒng)來(lái)說(shuō)，分兩種用戶類(lèi)型，管理員和瀏覽用戶，主要實(shí)現(xiàn)的系統(tǒng)功能有以下一些方面：

1）管理員賬號(hào)管理

主要功能是超級(jí)管理員對(duì)普通管理員進(jìn)行添加、修改、刪除等操作。2）學(xué)校概況

管理員把學(xué)校概況進(jìn)行添加、修改、刪除等操作。3）科研研究管理

管理員把科學(xué)研究的相關(guān)信息資料進(jìn)行添加、修改、刪除等操作。4）圖書(shū)館管理

管理員對(duì)圖書(shū)館信息進(jìn)行添加、查詢、修改、刪除等操作。5）友情連接管理。

管理員對(duì)友情連接地址進(jìn)行添加、查詢、修改、刪除等操作。6）要聞速覽管理

管理員圣要聞束覽信息進(jìn)行添加、查詢、修改、刪除等操作。7）新聞快遞管理

管理員對(duì)新聞信息進(jìn)行進(jìn)行添加、查詢、修改、刪除等操作。8）系統(tǒng)管理

管理員進(jìn)行系統(tǒng)公告、系統(tǒng)簡(jiǎn)介、黨群機(jī)構(gòu)、行政機(jī)構(gòu)、系部機(jī)構(gòu)、教師招聘等信息的添加、查詢、修改、刪除等操作。

9）瀏覽用戶可對(duì)前臺(tái)的各項(xiàng)信息進(jìn)行查看，包括：學(xué)校概況、黨群機(jī)構(gòu)、行政機(jī)構(gòu)、系部機(jī)構(gòu)、教師招聘、科學(xué)研究、招生就業(yè)、圖書(shū)館等內(nèi)容。

以上是用戶的主要需求，也是該系統(tǒng)主要功能，除了這些功能以外，在設(shè)計(jì)時(shí)也對(duì)一些細(xì)節(jié)做了優(yōu)化與調(diào)整，使系統(tǒng)更具有完整性與實(shí)用性。

系統(tǒng)功能模塊結(jié)構(gòu)圖如圖2.2所示：

華航校園網(wǎng)網(wǎng)站系統(tǒng)后臺(tái)管理前臺(tái)登錄管理員賬號(hào)管理學(xué)校概況科學(xué)研究管理圖書(shū)館管理友情連接管理要聞速覽管理新聞快遞管理系統(tǒng)管理學(xué)校概況黨群機(jī)構(gòu)行政機(jī)構(gòu)系部機(jī)構(gòu)教師招聘科學(xué)研究招圖生書(shū)就館業(yè)系統(tǒng)公告系統(tǒng)簡(jiǎn)介黨群機(jī)構(gòu)行政機(jī)構(gòu)系部機(jī)構(gòu)教師招聘 圖2.2模塊功能結(jié)構(gòu)圖

2.3業(yè)務(wù)流程分析

華航校園網(wǎng)工作流程為：系統(tǒng)啟動(dòng)并進(jìn)入首頁(yè)頁(yè)面，瀏覽用戶可在前臺(tái)頁(yè)面進(jìn)行所有欄目信息瀏覽。管理員點(diǎn)擊后臺(tái)，輸入用戶名和密碼進(jìn)行后臺(tái)登陸，登陸之后，可進(jìn)行后臺(tái)的所有操作。本系統(tǒng)的業(yè)務(wù)流程圖如下所示：

圖2.3業(yè)務(wù)流程圖

本系統(tǒng)是利用現(xiàn)代化的計(jì)算機(jī)網(wǎng)絡(luò)技術(shù)將校園信息進(jìn)行整合，按照實(shí)踐過(guò)程設(shè)計(jì)完成的。同時(shí)完善服務(wù)，初步設(shè)計(jì)一個(gè)華航校園網(wǎng)網(wǎng)站管理系統(tǒng)。為了使系統(tǒng)在各項(xiàng)管理中發(fā)揮更大的作用，實(shí)現(xiàn)工作過(guò)程的計(jì)算機(jī)化，提高工作效率和工作質(zhì)量，現(xiàn)提出如下系統(tǒng)開(kāi)發(fā)目標(biāo)：

1.操作簡(jiǎn)單、界面友好：完全控件式的頁(yè)面布局，使得信息的錄入工作更簡(jiǎn)便。

2.即時(shí)可見(jiàn)：對(duì)信息的處理（包括添加、修改、刪除）將立即在對(duì)應(yīng)的版塊顯示出來(lái)，達(dá)到“即時(shí)發(fā)布、即時(shí)見(jiàn)效”的功能。

3.功能完善：不僅包括常見(jiàn)系統(tǒng)的信息管理的各個(gè)方面：信息錄入、瀏覽、刪除、修改、查詢等各個(gè)方面，完整地實(shí)現(xiàn)了系統(tǒng)對(duì)即時(shí)信息的管理要求。而且，還能進(jìn)行上傳下載相關(guān)資源的管理。

4.方便移植：系統(tǒng)應(yīng)具有實(shí)用性、可靠性和適用性。系統(tǒng)界面中所需的數(shù)據(jù)都存放于數(shù)據(jù)文件中，只要對(duì)該文件做部分修改，就能在系統(tǒng)界面上實(shí)現(xiàn)及時(shí)更新的效果，減少了更改系統(tǒng)源代碼的復(fù)雜性。

5.動(dòng)態(tài)管理：對(duì)系統(tǒng)數(shù)據(jù)庫(kù)實(shí)行動(dòng)態(tài)操作，能實(shí)現(xiàn)對(duì)數(shù)據(jù)庫(kù)信息的動(dòng)態(tài)查詢、動(dòng)態(tài)更新修改和動(dòng)態(tài)錄入數(shù)據(jù)。

2.4數(shù)據(jù)流程分析

數(shù)據(jù)流程分析主要包括對(duì)信息的流動(dòng)、傳遞、處理、存儲(chǔ)等的分析。數(shù)據(jù)流程分析的目的就是要發(fā)現(xiàn)和解決數(shù)據(jù)流通中的問(wèn)題?，F(xiàn)有的數(shù)據(jù)流程分析多是通過(guò)分層的數(shù)據(jù)流程圖（data flow diagram，簡(jiǎn)稱DFD）來(lái)實(shí)現(xiàn)的。其具體的做法是：按業(yè)務(wù)流程圖理出的業(yè)務(wù)流程順序，將相應(yīng)調(diào)查過(guò)程中所掌握的數(shù)據(jù)處理過(guò)程，繪制成一套完整的數(shù)據(jù)流程圖。

整個(gè)系統(tǒng)的數(shù)據(jù)流程圖如下圖所示：

進(jìn)入華航校園網(wǎng)網(wǎng)站系統(tǒng)管理員登錄管理員添加、學(xué)校概況、科學(xué)研究等添加、修改。系統(tǒng)數(shù)據(jù)庫(kù)管理員信息數(shù)據(jù)備份數(shù)據(jù)恢復(fù)圖2.4 系統(tǒng)的數(shù)據(jù)流程

注銷(xiāo)登錄

3.系統(tǒng)設(shè)計(jì)

3.1系統(tǒng)B/S結(jié)構(gòu)

華航校園網(wǎng)是基于瀏覽器/服務(wù)器（B/S）技術(shù)的管理系統(tǒng)，解決傳統(tǒng)的客戶端/服務(wù)器模型結(jié)構(gòu)存在的客戶端（C/S）維護(hù)煩瑣的問(wèn)題，維護(hù)相對(duì)簡(jiǎn)單，具有良好的系統(tǒng)擴(kuò)展性，方便管理。

本系統(tǒng)所面向的對(duì)象是廣大的互連網(wǎng)用戶。因此，將要采用比較流行的B/S三層結(jié)構(gòu)。

圖2-4-1 B/S三層結(jié)構(gòu)圖

B/S體系結(jié)構(gòu)與B/S體系結(jié)構(gòu)相比不僅具有其全部的優(yōu)點(diǎn)，而且又有B/S體 系結(jié)構(gòu)所不具備的獨(dú)特優(yōu)勢(shì):(1)開(kāi)放的標(biāo)準(zhǔn)：B/S所采用的標(biāo)準(zhǔn)都是開(kāi)放的、非專(zhuān)用的，是經(jīng)過(guò)標(biāo)準(zhǔn)化組織所確定而非單一廠商所制定，保證了其應(yīng)用的通用性和跨平臺(tái)性。

(2)較低的開(kāi)發(fā)和維護(hù)成本：B/S的應(yīng)用只需在客戶端安裝通用的瀏覽器即可，維護(hù)和升級(jí)工作都在服務(wù)器端進(jìn)行，不需對(duì)客戶端進(jìn)行任何改變，故而大大降低了開(kāi)發(fā)和維護(hù)的成本。

(3)用戶使用簡(jiǎn)單，界面友好：B/S用戶的界面都在統(tǒng)一的瀏覽器上，瀏覽器易于使用、界面友好，又因?yàn)樗辉儇?fù)責(zé)數(shù)據(jù)的存取和復(fù)雜數(shù)據(jù)計(jì)算等任務(wù)，只需要進(jìn)行顯示，因而大大降低了對(duì)客戶端的要求。

從以上的分析與比較可以看出，B/S模式具有B/S模式無(wú)法替代的優(yōu)越性:它簡(jiǎn)化了系統(tǒng)的開(kāi)發(fā)和維護(hù)，并且特別適用于網(wǎng)上信息發(fā)布。因此，我開(kāi)發(fā)的課程在線瀏覽系統(tǒng)采用了基于B/S模式的體系結(jié)構(gòu)。

3.2 開(kāi)發(fā)軟件

3.2.1 PHP技術(shù)

PHP，是英文超文本預(yù)處理語(yǔ)言Hypertext Preprocessor的縮寫(xiě)。PHP 是一種 HTML 內(nèi)嵌式的語(yǔ)言，是一種在服務(wù)器端執(zhí)行的嵌入HTML文檔的腳本語(yǔ)言，語(yǔ)言的風(fēng)格有類(lèi)似于C語(yǔ)言，被廣泛地運(yùn)用。

PHP 獨(dú)特的語(yǔ)法混合了 C、Java、Perl 以及 PHP 自創(chuàng)的語(yǔ)法。

它可以比 CGI或者Perl更快速地執(zhí)行動(dòng)態(tài)網(wǎng)頁(yè)。用PHP做出的動(dòng)態(tài)頁(yè)面與其他的編程語(yǔ)言相比，PHP是將程序嵌入到HTML文檔中去執(zhí)行，執(zhí)行效率比完全生成HTML標(biāo)記的CGI要高許多；PHP還可以執(zhí)行編譯后代碼，編譯可以達(dá)到加密和優(yōu)化代碼運(yùn)行，使代碼運(yùn)行更快。PHP具有非常強(qiáng)大的功能，所有的CGI的功能PHP都能實(shí)現(xiàn)，而且支持幾乎所有流行的數(shù)據(jù)庫(kù)以及操作系統(tǒng)。最重要的是PHP可以用C、C++進(jìn)行程序的擴(kuò)展！3.2.2 Internet服務(wù)管理器

本系統(tǒng)運(yùn)用了Asp技術(shù)，而IIS是Windows XP中的Internet服務(wù)管理器。通過(guò)安裝和配置IIS后就可以運(yùn)行ASP程序。Internet Information Server(IIS)內(nèi)置在Windows XP操作系統(tǒng)中的網(wǎng)絡(luò)文件和應(yīng)用程序服務(wù)器中。ASP程序通過(guò)服務(wù)器解釋后才可以在瀏覽器中運(yùn)行，所以在Windows XP系統(tǒng)中必須安裝IIS 服務(wù)。IIS默認(rèn)情況下安裝在Windows XP中。IIS可以幫助Web管理員創(chuàng)建Web的應(yīng)用程序。IIS集成安裝向?qū)?、Web發(fā)布工具、集成的安全性和身份驗(yàn)證程序，以及對(duì)其他Web的應(yīng)用程序的支持。

IIS(Internet Information Server)，是微軟公司主推的服務(wù)器，最新的版本是IIS 6.0，IIS與Windows NT Server完全集成在一起，因而用戶能夠利用Windows NT Server和NTFS（NT File System，NT的文件系統(tǒng)）內(nèi)置的安全特性，建立強(qiáng)大，靈活而安全的Internet站點(diǎn)。

IIS支持HTTP（Hypertext Transfer Protocol，超文本傳輸協(xié)議）、FTP（File Transfer Protocol，文件傳輸協(xié)議）以及SMTP協(xié)議，通過(guò)使用CGI和ISAPI，IIS可以得到高度的擴(kuò)展。

IIS支持與語(yǔ)言無(wú)關(guān)的腳本編寫(xiě)和組件，通過(guò)IIS，開(kāi)發(fā)人員就可以開(kāi)發(fā)新一代動(dòng)態(tài)的，富有魅力的Web站點(diǎn)。IIS不需要開(kāi)發(fā)人員學(xué)習(xí)新的腳本語(yǔ)言或者編譯應(yīng)用程序，IIS完全支持VBScript，JavaScript開(kāi)發(fā)軟件以及Java，同時(shí)也支持CGI和WinCGI，以及ISAPI擴(kuò)展和過(guò)濾器。

IIS支持服務(wù)器應(yīng)用的Microsoft BackOffice系列，Microsoft BackOffice系列包括以下內(nèi)容：

Microsoft Exchange Server 客戶/服務(wù)器通訊和群組軟件； Microsoft Proxy Server 代理服務(wù)器；

用于連接IBM企業(yè)網(wǎng)絡(luò)的Microsoft SNA Server；

用于集中管理分布式系統(tǒng)的Microsoft Systems Management Server； Microsoft Commercial Internet System（MCIS）。

IIS的設(shè)計(jì)目的是建立一套集成的服務(wù)器服務(wù)，用以支持HTTP，F(xiàn)TP和SMTP，能夠提供快速且集成了現(xiàn)有產(chǎn)品，同時(shí)可擴(kuò)展的Internet服務(wù)器。IIS相應(yīng)性極高，同時(shí)系統(tǒng)資源的消耗也是最少，IIS的安裝，管理和配置都相當(dāng)簡(jiǎn)單，這是因?yàn)镮IS與Windows NT Server網(wǎng)絡(luò)操作系統(tǒng)緊密的集成在一起，另外，IIS還使用與Windows NT Server相同的SAM（Security Accounts Manager，安全性賬號(hào)管理器），對(duì)于管理員來(lái)說(shuō)，IIS使用諸如Performance Monitor和SNMP（Simple Network Management Protocol，簡(jiǎn)單網(wǎng)絡(luò)管理協(xié)議）之類(lèi)的NT已有管理工具。

IIS支持ISAPI，使用ISAPI可以擴(kuò)展服務(wù)器功能，而使用ISAPI過(guò)濾器可 以預(yù)先處理和事后處理儲(chǔ)存在IIS上的數(shù)據(jù)。用于32位Windows應(yīng)用程序的Internet擴(kuò)展可以把FTP，SMTP和HTTP協(xié)議置于容易使用且任務(wù)集中的界面中，這些界面將Internet應(yīng)用程序的使用大大簡(jiǎn)化，IIS也支持MIME（Multipurpose Internet Mail Extensions，多用于Internet郵件擴(kuò)展），可以為Internet應(yīng)用程序的訪問(wèn)提供一個(gè)簡(jiǎn)單的注冊(cè)項(xiàng)。

3.2.3 MySQL Server

MySQL是一個(gè)關(guān)系型數(shù)據(jù)庫(kù)管理系統(tǒng)，由瑞典MySQL AB公司開(kāi)發(fā)，目前屬于Oracle公司。MySQL是一種關(guān)聯(lián)數(shù)據(jù)庫(kù)管理系統(tǒng)，關(guān)聯(lián)數(shù)據(jù)庫(kù)將數(shù)據(jù)保存在不同的表中，而不是將所有數(shù)據(jù)放在一個(gè)大倉(cāng)庫(kù)內(nèi)，這樣就增加了速度并提高了靈活性。MySQL的SQL語(yǔ)言是用于訪問(wèn)數(shù)據(jù)庫(kù)的最常用標(biāo)準(zhǔn)化語(yǔ)言。MySQL軟件采用了雙授權(quán)政策（本詞條“授權(quán)政策”），它分為社區(qū)版和商業(yè)版，由于其體積小、速度快、總體擁有成本低，尤其是開(kāi)放源碼這一特點(diǎn)，一般中小型網(wǎng)站的開(kāi)發(fā)都選擇MySQL作為網(wǎng)站數(shù)據(jù)庫(kù)。由于其社區(qū)版的性能卓越，搭配PHP和Apache可組成良好的開(kāi)發(fā)環(huán)境。

MySQL是一個(gè)開(kāi)放源碼的小型關(guān)聯(lián)式數(shù)據(jù)庫(kù)管理系統(tǒng)，開(kāi)發(fā)者為瑞典MySQL AB公司。目前MySQL被廣泛地應(yīng)用在Internet上的中小型網(wǎng)站中。由于其體積小、速度快、總體擁有成本低，尤其是開(kāi)放源碼這一特點(diǎn)，許多中小型網(wǎng)站為了降低網(wǎng)站總體擁有成本而選擇了MySQL作為網(wǎng)站數(shù)據(jù)庫(kù)。

與其他的大型數(shù)據(jù)庫(kù)例如Oracle、DB2、SQL Server等相比，MySQL自有它的不足之處，如規(guī)模小、功能有限（MySQL Cluster的功能和效率都相對(duì)比較差）等，但是這絲毫也沒(méi)有減少它受歡迎的程度。對(duì)于一般的個(gè)人使用者和中小型企業(yè)來(lái)說(shuō)，MySQL提供的功能已經(jīng)綽綽有余，而且由于MySQL是開(kāi)放源碼軟件，因此可以大大降低總體擁有成本。

系統(tǒng)特性：

1．使用C和C++編寫(xiě)，并使用了多種編譯器進(jìn)行測(cè)試，保證源代碼的可移植性

2．支持AIX、FreeBSD、HP-UX、Linux、Mac OS、NovellNetware、OpenBSD、OS/2 Wrap、Solaris、Windows等多種操作系統(tǒng)

3．為多種編程語(yǔ)言提供了API。這些編程語(yǔ)言包括C、C++、Python、Java、Perl、PHP、Eiffel、Ruby和Tcl等。

4．支持多線程，充分利用CPU資源

5．優(yōu)化的SQL查詢算法，有效地提高查詢速度

6．既能夠作為一個(gè)單獨(dú)的應(yīng)用程序應(yīng)用在客戶端服務(wù)器網(wǎng)絡(luò)環(huán)境中，也能夠作為一個(gè)庫(kù)而嵌入到其他的軟件中。

7．提供多語(yǔ)言支持，常見(jiàn)的編碼如中文的GB 2312、BIG5，日文的Shift_JIS等都可以用作數(shù)據(jù)表名和數(shù)據(jù)列名。

8．提供TCP/IP、ODBC和JDBC等多種數(shù)據(jù)庫(kù)連接途徑。9．提供用于管理、檢查、優(yōu)化數(shù)據(jù)庫(kù)操作的管理工具。

10．支持大型的數(shù)據(jù)庫(kù)?？梢蕴幚?yè)碛猩锨f(wàn)條記錄的大型數(shù)據(jù)庫(kù)。11．支持多種存儲(chǔ)引擎。3.2.4 Macromedia Dreamweaver cs5 Macromedia Dreamweaver cs5是建立Web站點(diǎn)和應(yīng)用程序的專(zhuān)業(yè)工具。它將可視布局工具、應(yīng)用程序開(kāi)發(fā)功能和代碼編輯支持組合在一起，其功能強(qiáng)大，使得各個(gè)層次的開(kāi)發(fā)人員和設(shè)計(jì)人員都能夠快速創(chuàng)建界面吸引人的基于標(biāo)準(zhǔn)的網(wǎng)站和應(yīng)用程序。從對(duì)基于BS的設(shè)計(jì)的領(lǐng)先支持到手工編碼功能，Dreamdreanweaver cs5的工作界面和圖標(biāo)、(5張)weaver提供了專(zhuān)業(yè)人員在一個(gè)集成、高效的環(huán)境中所需的工具。開(kāi)發(fā)人員可以使用Dreamweaver及所選擇的服務(wù)器技術(shù)來(lái)創(chuàng)建功能強(qiáng)大的Internet應(yīng)用程序，從而使用戶能連接到數(shù)據(jù)庫(kù)、Web服務(wù)和舊式系統(tǒng)。

Dreamweaver是在網(wǎng)頁(yè)設(shè)計(jì)與制作領(lǐng)域中用戶最多、應(yīng)用最廣、功能最強(qiáng)大的軟件，隨著Dreamweaver cs5的發(fā)布，更堅(jiān)定Dreamweaver在該領(lǐng)域的地位。它集網(wǎng)頁(yè)設(shè)計(jì)、網(wǎng)站開(kāi)發(fā)和站點(diǎn)管理功能于一身，具有可視化、支持多平臺(tái)和跨瀏覽器的特性，是目前網(wǎng)站設(shè)計(jì)、開(kāi)發(fā)、制作的首選工具。

1、靈活的編寫(xiě)方式Dreamweaver具有靈活編寫(xiě)網(wǎng)頁(yè)的特點(diǎn)，不但將世界一流水平的“設(shè)計(jì)”和“代碼”編輯器合二為一，而且在設(shè)計(jì)窗口中還精化了源代碼，能幫助用戶按工作需要定制自己的用戶界面。

2、可視化編輯界面Dreamweaver是一種所見(jiàn)即所得的HTML編輯器，可實(shí)現(xiàn)頁(yè)面元素的插入和生成。或視化編輯環(huán)境大量減少了代碼的編寫(xiě)，同時(shí)亦保證 16 了其專(zhuān)業(yè)性和兼容性，并且可以對(duì)內(nèi)部的HTML編輯器和任何第三方的HTML編輯器進(jìn)行實(shí)時(shí)的訪問(wèn)。無(wú)論用戶習(xí)慣手工輸入HTML源代碼還是使用可視化的編輯界面，Dreamweaver都能提供便捷的方式使用戶設(shè)計(jì)網(wǎng)頁(yè)和管理網(wǎng)站變得更容易。

3、功能更多的CSS支持——CSS可視化設(shè)計(jì)、CSS檢查工具。

4、動(dòng)態(tài)跨瀏覽器驗(yàn)證當(dāng)保存時(shí)系統(tǒng)自動(dòng)檢查當(dāng)前文檔的跨瀏覽器有效性，可以指定何種瀏覽器為測(cè)試用瀏覽器，同時(shí)系統(tǒng)自動(dòng)檢驗(yàn)以確定頁(yè)面有沒(méi)有目標(biāo)瀏覽器不支持的tags或CSS結(jié)構(gòu)。動(dòng)態(tài)跨瀏覽器有效性檢查功能可以自動(dòng)核對(duì)tags和CSS規(guī)則是否適應(yīng)目前的主瀏覽器。

5、強(qiáng)大的WEB站點(diǎn)管理功能。

6、內(nèi)建的圖形編輯引擎。

7、Dreamweaver的集成特性Dreamweaver cs5繼承了Fireworks、Flash和Shockwave的集成特性，可以在這些Web創(chuàng)作工具之間自由地切換，輕松地創(chuàng)建美觀實(shí)用的網(wǎng)頁(yè)。

8、豐富的媒體支持能力可以方便地加入Java、Flash、Shockwave、ActiveX以及其他媒體。Dreamweaver具有強(qiáng)大的多媒體處理功能，在設(shè)計(jì)DHTML和CSS方面表現(xiàn)得極為出色，它利用JavaScript和DHTML語(yǔ)言代碼輕松地實(shí)現(xiàn)網(wǎng)頁(yè)元素的動(dòng)作和交互操作。Dreamweaver還提供行為和時(shí)間線兩種控件來(lái)產(chǎn)生交互式響應(yīng)和進(jìn)行動(dòng)畫(huà)處理。

9、超強(qiáng)的擴(kuò)展能力Dreamweaver還支持第三方插件，任何人都可以根據(jù)自己的需要擴(kuò)展Dreamweaver的功能，并且可以發(fā)布這些插件。

3.3數(shù)據(jù)庫(kù)設(shè)計(jì)

3.3.1數(shù)據(jù)庫(kù)概念結(jié)構(gòu)設(shè)計(jì)

根據(jù)上面的系統(tǒng)功能需求分析、業(yè)務(wù)流程分析和數(shù)據(jù)流程分析，就可以設(shè)計(jì)出能夠滿足用戶需求的各種實(shí)體，以及它們之間的關(guān)系，為后面的邏輯結(jié)構(gòu)設(shè)計(jì)打下基礎(chǔ)。這些實(shí)體包含各種具體信息，通過(guò)相互之間的作用形成數(shù)據(jù)的流動(dòng)。

下面對(duì)主要的實(shí)體E-R圖作一下展示。整體E-R圖如圖2.5.1a所示：

管理員賬號(hào)學(xué)校概況科學(xué)研究圖書(shū)館信息友情連接要聞速覽新聞快遞管理員添加、修改系統(tǒng)公告系統(tǒng)簡(jiǎn)介黨群機(jī)構(gòu)行政機(jī)構(gòu)系部機(jī)構(gòu)教師招聘瀏覽、查看瀏覽用戶 圖2.5.1a整體ER圖

管理員實(shí)體E-R圖如圖2.5.1b所示：

用戶名密碼管理員圖2.5.1a管理員E－R圖

學(xué)校概況實(shí)體E-R圖如圖2.5.1c所示：

類(lèi)別標(biāo)題內(nèi)容學(xué)校概況圖2.5.1c學(xué)校概況E－R圖

圖書(shū)館實(shí)體E-R圖如圖2.5.1d所示：

類(lèi)別標(biāo)題內(nèi)容圖書(shū)館圖2.5.1d圖書(shū)館E－R圖

3.3.2數(shù)據(jù)庫(kù)邏輯結(jié)構(gòu)設(shè)計(jì)

數(shù)據(jù)庫(kù)設(shè)計(jì)的好壞直接影響整個(gè)系統(tǒng)，如果數(shù)據(jù)庫(kù)設(shè)計(jì)不好，不僅僅很多的業(yè)務(wù)處理起來(lái)相當(dāng)?shù)膹?fù)雜和煩瑣，而且在編寫(xiě)系統(tǒng)代碼的時(shí)候也會(huì)遇到很多問(wèn)題。所以，一個(gè)合理的數(shù)據(jù)庫(kù)是必須的、是必要的。本系統(tǒng)的數(shù)據(jù)庫(kù)結(jié)構(gòu)在設(shè)計(jì)的時(shí)候注意到了規(guī)范命名和建立索引的必要性。

3.4系統(tǒng)的軟硬件平臺(tái)

1.客戶機(jī)/服務(wù)器：采用Pentium II 或以上級(jí)別PC機(jī)，至少30M硬盤(pán)，Pentium90MHZ，支持VGA或分辨率更高的顯示器

2.客戶機(jī)/服務(wù)器操作系統(tǒng)：Window xp/vista/7。3.數(shù)據(jù)庫(kù)：MySQL

4.網(wǎng)絡(luò)：以太網(wǎng)組成的局域網(wǎng)，可設(shè)多臺(tái)客戶機(jī)。

4．系統(tǒng)操作說(shuō)明

網(wǎng)站結(jié)構(gòu)分為兩個(gè)部分：前臺(tái)登入模塊、后臺(tái)管理模塊。

4.1系統(tǒng)前臺(tái)操作說(shuō)明

4.1.1首頁(yè)頁(yè)面

打開(kāi)系統(tǒng)首頁(yè)，界面如圖4.1.1所示。

圖4.1.1首頁(yè)頁(yè)面

系統(tǒng)首頁(yè)顏色歡快活潑，界面十分清晰，顯得希望和朝氣。最上方為系統(tǒng)功能導(dǎo)航欄，下方為各信息模塊的顯示區(qū)，整體呈左中右三塊。首頁(yè)設(shè)計(jì)功能齊全，沒(méi)有冗余也沒(méi)有遺漏，使用戶能一視而知之。4.1.2學(xué)校概況瀏覽頁(yè)面

圖4.1.2學(xué)校概況瀏覽頁(yè)面

此頁(yè)面實(shí)現(xiàn)的功能是瀏覽用戶對(duì)學(xué)校概況信息進(jìn)行查看。4.1.3黨群機(jī)構(gòu)頁(yè)面

圖4.1.3黨群機(jī)構(gòu)頁(yè)面

此頁(yè)面實(shí)現(xiàn)的功能是瀏覽用戶對(duì)學(xué)校黨群機(jī)構(gòu)進(jìn)行查看。

4.2系統(tǒng)后臺(tái)操作界面

4.2.1管理員賬號(hào)管理頁(yè)面

圖4.2.1管理員賬號(hào)管理頁(yè)面

此頁(yè)面實(shí)現(xiàn)的功能是超級(jí)管理員對(duì)普通管理員的添加操作。4.2.2學(xué)校概況添加頁(yè)面

圖4.2.2學(xué)校概況添加頁(yè)面

此界面實(shí)現(xiàn)的功能是管理員對(duì)學(xué)校概況信息進(jìn)行添加操作，包括標(biāo)題、類(lèi)別、內(nèi)容等相關(guān)信息。學(xué)校概況編輯頁(yè)面很清晰、簡(jiǎn)單，易于操作。4.2.3科學(xué)研究添加頁(yè)面

圖4.2.2科學(xué)研究添加頁(yè)面

此界面實(shí)現(xiàn)的功能是管理員對(duì)學(xué)?？茖W(xué)研究信息進(jìn)行添加操作，包括標(biāo)題、類(lèi)別、內(nèi)容等相關(guān)信息。

5.軟件測(cè)試與分析

測(cè)試是開(kāi)發(fā)時(shí)期最后一個(gè)階段，是保證軟件質(zhì)量的重要手段。軟件測(cè)試就是在受控制的條件下對(duì)系統(tǒng)或應(yīng)用程序進(jìn)行操作并評(píng)價(jià)操作結(jié)果的過(guò)程，所謂控制條件應(yīng)包括正常條件與非正常條件。軟件測(cè)試過(guò)程中應(yīng)該故意地去促使錯(cuò)誤的發(fā)生，也就是事情在不該出現(xiàn)的時(shí)候出現(xiàn)或者在應(yīng)該出現(xiàn)的時(shí)候沒(méi)有出現(xiàn)。從本質(zhì)上說(shuō)，軟件測(cè)試是“探測(cè)”，在“探測(cè)”中發(fā)現(xiàn)軟件的毛病。

5.1系統(tǒng)測(cè)試的定義

軟件測(cè)試是為了發(fā)現(xiàn)錯(cuò)誤而執(zhí)行程序的過(guò)程。它不僅是軟件開(kāi)發(fā)階段的有機(jī)組成部分，而且在整個(gè)軟件工程(即軟件定義、設(shè)計(jì)和開(kāi)發(fā)過(guò)程)中占據(jù)相當(dāng)大的比重。軟件測(cè)試是軟件質(zhì)量保證的關(guān)鍵環(huán)節(jié)，直接影響著軟件的質(zhì)量評(píng)估。軟件測(cè)試不僅要講究策略，更要講究時(shí)效性。驗(yàn)收測(cè)試作為軟件測(cè)試過(guò)程的最后一個(gè)環(huán)節(jié)，對(duì)軟件質(zhì)量、軟件的可交付性和軟件項(xiàng)目的實(shí)施周期起到“一錘定音”的作用。

5.2系統(tǒng)測(cè)試的目的及意義

軟件危機(jī)曾經(jīng)是軟件界甚至整個(gè)計(jì)算機(jī)界最熱門(mén)的話題。為了解決這場(chǎng)危機(jī)，軟件從業(yè)人員、專(zhuān)家和學(xué)者做出了大量的努力?，F(xiàn)在人們已經(jīng)逐步認(rèn)識(shí)到所謂的軟件危機(jī)實(shí)際上僅是一種狀況，那就是軟件中有錯(cuò)誤，正是這些錯(cuò)誤導(dǎo)致了軟件開(kāi)發(fā)在成本、進(jìn)度和質(zhì)量上的失控。有錯(cuò)是軟件的屬性，而且是無(wú)法改變的，因?yàn)檐浖怯扇藖?lái)完成的，所有由人做的工作都不會(huì)是完美無(wú)缺的。問(wèn)題在于我們?nèi)绾稳ケ苊忮e(cuò)誤的產(chǎn)生和消除已經(jīng)產(chǎn)生的錯(cuò)誤，使程序中的錯(cuò)誤密度達(dá)到盡可能低的程度。

5.3系統(tǒng)測(cè)試的重要性

軟件測(cè)試在軟件生命周期中占據(jù)重要的地位，在傳統(tǒng)的瀑布模型中，軟件測(cè)試學(xué)僅處于運(yùn)行維護(hù)階段之前，是軟件書(shū)籍交付用戶使用之前保證軟件質(zhì)量的重要手段。近來(lái)，軟件工程界趨向于一種新的觀點(diǎn)，即認(rèn)為軟件生命周期每一階段 中都應(yīng)包含測(cè)試，從而檢驗(yàn)本階段的成果是否接近預(yù)期的目標(biāo)，盡可能早的發(fā)現(xiàn)錯(cuò)誤并加以修正，如果不在早期階段進(jìn)行測(cè)試，錯(cuò)誤的延時(shí)擴(kuò)散常常會(huì)導(dǎo)致最后成品測(cè)試的巨大困難。

事實(shí)上，對(duì)于軟件來(lái)講，不論采用什么技術(shù)和什么方法，軟件中仍然會(huì)有錯(cuò)。采用新的語(yǔ)言、先進(jìn)的開(kāi)發(fā)方式、完善的開(kāi)發(fā)過(guò)程，可以減少錯(cuò)誤的引入，但是不可能完全杜絕軟件中的錯(cuò)誤，這些引入的錯(cuò)誤需要測(cè)試來(lái)找出，軟件中的錯(cuò)誤密度也需要測(cè)試來(lái)進(jìn)行估計(jì)。測(cè)試是所有工程學(xué)科的基本組成單元，是軟件開(kāi)發(fā)的重要部分。自有程序設(shè)計(jì)的那天起測(cè)試就一直伴隨著。統(tǒng)計(jì)表明，在典型的軟件開(kāi)發(fā)項(xiàng)目中，軟件測(cè)試工作量往往占軟件開(kāi)發(fā)總工作量的40％以上。而在軟件開(kāi)發(fā)的總成本中，用在測(cè)試上的開(kāi)銷(xiāo)要占30％到50％。如果把維護(hù)階段也考慮在內(nèi)，討論整個(gè)軟件生存期時(shí)，測(cè)試的成本比例也許會(huì)有所降低，但實(shí)際上維護(hù)工作相當(dāng)于二次開(kāi)發(fā)，乃至多次開(kāi)發(fā)，其中必定還包含有許多測(cè)試工作。

5.4系統(tǒng)測(cè)試的常用方法

程序測(cè)試的主要方法分為兩大類(lèi)，白盒測(cè)試和黑盒測(cè)試。

白盒測(cè)試：一種是以程序的內(nèi)部邏輯結(jié)構(gòu)為依據(jù)而設(shè)計(jì)測(cè)試用例的方法，因而又稱結(jié)構(gòu)測(cè)試或玻璃盒測(cè)試，將軟件看成一個(gè)透明的白盒子，按照程序的內(nèi)部結(jié)構(gòu)和處理邏輯來(lái)選定測(cè)試用例，對(duì)軟件的邏輯路徑及過(guò)程進(jìn)行測(cè)試，檢查它與設(shè)計(jì)是否相符。白盒測(cè)試就是要選取足夠的測(cè)試用例，對(duì)源代碼實(shí)行比較充分的覆蓋，以便盡可能多地發(fā)現(xiàn)程序中的錯(cuò)誤。主要有兩種方法：一種稱為邏輯覆蓋法，另一種稱為路徑覆蓋法。

黑盒測(cè)試：也稱功能測(cè)試，數(shù)據(jù)驅(qū)動(dòng)測(cè)試等，它將待測(cè)對(duì)象堪稱是一個(gè)黑盒子，在完全不考慮程序的內(nèi)部結(jié)構(gòu)和特性的情況下，只依據(jù)規(guī)格說(shuō)明書(shū)檢查程序的功能是否能正常使用。

黑盒測(cè)試主要是根據(jù)輸入條件和輸出條件的確定測(cè)試數(shù)據(jù)，來(lái)檢查程序是否能產(chǎn)生正確的輸出[16]。進(jìn)行黑盒測(cè)試主要有下面幾種方法：等價(jià)分類(lèi)法、邊界值分析法、猜錯(cuò)法、因果圖法。

本系統(tǒng)的測(cè)試綜合了白盒測(cè)試、黑盒測(cè)試兩種方法，但主要使用的是黑盒測(cè)試方法。在測(cè)試當(dāng)中遵循了“盡早地和不斷進(jìn)行測(cè)試”，“保證測(cè)試用例的完整 24 性和有效性”原則。通過(guò)測(cè)試達(dá)到以下測(cè)試目的：

1功能檢查。

檢查功能是否爭(zhēng)取，是否遺漏或?qū)崿F(xiàn)不了應(yīng)該實(shí)現(xiàn)的功能等。2接口檢查。

檢查能否正確地接受信息或輸出信息。3數(shù)據(jù)檢查。

檢查數(shù)據(jù)結(jié)構(gòu)或外部信息是否有（如數(shù)據(jù)文件）訪問(wèn)錯(cuò)誤。4性能檢查。

檢查性能需求能否得到滿足。5初始化、終止檢查。

檢查是否能進(jìn)行正確地初始化或終止。

5.5測(cè)試環(huán)境與測(cè)試條件

處理器：Inter(R)Core(TM)2 Duo T5750 內(nèi)存：2GB 硬盤(pán)：160G 操作系統(tǒng)：Windows XP 數(shù)據(jù)庫(kù)：MYSQL 2000 5.6系統(tǒng)運(yùn)行情況

系統(tǒng)評(píng)價(jià)是指系統(tǒng)在正式運(yùn)行了一段時(shí)間之后，對(duì)它在功能上、技術(shù)上和經(jīng)濟(jì)上所進(jìn)行的審核評(píng)價(jià)。針對(duì)本系統(tǒng)的評(píng)價(jià)如下：

(1)系統(tǒng)功能評(píng)價(jià)

根據(jù)本系統(tǒng)開(kāi)發(fā)前所訂的目標(biāo)，在系統(tǒng)完成后經(jīng)過(guò)測(cè)試運(yùn)行，該系統(tǒng)達(dá)到了預(yù)定的開(kāi)發(fā)目標(biāo)，在實(shí)際使用中的功能可以滿足用戶需求。

(2)系統(tǒng)技術(shù)評(píng)價(jià)

本系統(tǒng)設(shè)計(jì)合理，功能達(dá)到了預(yù)期目標(biāo)，且系統(tǒng)運(yùn)行后穩(wěn)定可靠，安全性高，具有實(shí)用性，大大提高了信訪辦公效率。

(3)系統(tǒng)經(jīng)濟(jì)評(píng)價(jià) 在規(guī)定時(shí)間內(nèi)，該系統(tǒng)完成了系統(tǒng)分析時(shí)所確定的系統(tǒng)開(kāi)發(fā)目標(biāo)，達(dá)到了設(shè)計(jì)要求，投入使用后為用戶節(jié)省了大量人力物力財(cái)力，提高了科學(xué)管理水平。

5.7測(cè)試總結(jié)

通過(guò)對(duì)系統(tǒng)的全面測(cè)試，所有測(cè)試條目都已經(jīng)通過(guò)，實(shí)現(xiàn)了基本要求，系統(tǒng)可以正常運(yùn)行。

6.結(jié)論

畢業(yè)設(shè)計(jì)是體現(xiàn)我們對(duì)所學(xué)知識(shí)的領(lǐng)悟和應(yīng)用，是對(duì)我們大學(xué)四年所學(xué)理論知識(shí)的一次鞏固和提高，在此我對(duì)此次畢業(yè)設(shè)計(jì)做了三點(diǎn)歸納。

6.1系統(tǒng)的特點(diǎn)

華航校園網(wǎng)，采用PHP+MySQL的模式來(lái)訂制的一個(gè)小型平臺(tái)。本系統(tǒng)從功能上來(lái)說(shuō)，比較完備。系統(tǒng)以Web界面與用戶交互，為用戶提供信息并接受其操作，同時(shí)通過(guò)數(shù)據(jù)庫(kù)管理系統(tǒng)來(lái)存儲(chǔ)信息數(shù)據(jù)。系統(tǒng)實(shí)現(xiàn)了根據(jù)用戶的需求及程序的應(yīng)用與維護(hù)的易用性，將各個(gè)部分置于不同的模塊當(dāng)中，方便了程序的擴(kuò)展與維護(hù)，同時(shí)建立了程序功能復(fù)用的基礎(chǔ)。

6.2系統(tǒng)的不足和改進(jìn)

本系統(tǒng)基本上滿足了華航校園網(wǎng)管理方面的需要。在界面上力求做到簡(jiǎn)潔，在操作方面上盡量避免由于用戶操作不當(dāng)帶來(lái)系統(tǒng)的出錯(cuò)現(xiàn)象。但由于時(shí)間倉(cāng)促，本系統(tǒng)還存在不足有待改進(jìn)。界面不夠美觀，需要進(jìn)一步修飾和美化；對(duì)數(shù)據(jù)庫(kù)操作的性能有待進(jìn)一步優(yōu)化，雖然本系統(tǒng)優(yōu)化了不少，但要達(dá)到理想狀態(tài)還有一段距離，如部分功能程序代碼過(guò)長(zhǎng)，如果后臺(tái)數(shù)據(jù)庫(kù)過(guò)大將會(huì)影響運(yùn)行速度；部分?jǐn)?shù)據(jù)庫(kù)表的設(shè)計(jì)存在一定的冗余，有待進(jìn)一步優(yōu)化。根據(jù)系統(tǒng)的不足，繼續(xù)改進(jìn)和完善本系統(tǒng)。簡(jiǎn)化程序代碼，可使不同界面之間能共享一些方法、函數(shù)和變量，這樣就會(huì)提高系統(tǒng)的運(yùn)行速度；使用數(shù)據(jù)庫(kù)連接池技術(shù)提高數(shù)據(jù)庫(kù)操作的性能；數(shù)據(jù)庫(kù)的關(guān)系模式可以進(jìn)一步規(guī)范化，減少冗余現(xiàn)象。

6.3設(shè)計(jì)收獲與心得

畢業(yè)設(shè)計(jì)是體現(xiàn)我們對(duì)所學(xué)知識(shí)的領(lǐng)悟和應(yīng)用，是對(duì)我們大學(xué)四年所學(xué)理論 知識(shí)的一次鞏固和提高。設(shè)計(jì)本系統(tǒng)的過(guò)程不僅是對(duì)我學(xué)過(guò)的知識(shí)的一次回顧，更是在對(duì)我處理問(wèn)題、解決實(shí)際問(wèn)題能力的培養(yǎng)和鍛煉。通過(guò)本次畢業(yè)設(shè)計(jì)使我對(duì)系統(tǒng)開(kāi)發(fā)有了深入的了解，我的編程能力也有了較大的提高。我在設(shè)計(jì)過(guò)程中也遇到了很多困難，但是通過(guò)指導(dǎo)老師和同學(xué)的幫助以及自己的努力，最終還是順利地完成了畢業(yè)設(shè)計(jì)。

雖然，畢業(yè)設(shè)計(jì)只有短暫的幾個(gè)月，但卻使我充分認(rèn)識(shí)到自身還存在很多不足的地方，還需要不斷的努力實(shí)踐來(lái)充實(shí)自己、完善自己，只有這樣才能學(xué)無(wú)止境，以求得更大的發(fā)展。

致 謝

大學(xué)生活在這個(gè)時(shí)候即將劃上一個(gè)句號(hào)。但是對(duì)于我的人生道路來(lái)說(shuō)，這僅僅是一個(gè)逗號(hào)，我將面對(duì)的是又一次征程的開(kāi)始。

在此畢業(yè)設(shè)計(jì)期間，我首先要感謝我的指導(dǎo)老師——xx老師的幫助和支持，老師扎實(shí)的理論知識(shí)和認(rèn)真負(fù)責(zé)的工作態(tài)度都使我受益匪淺，特別是在論文指導(dǎo)方面給予了我很大幫助，使我順利地完成了畢業(yè)論文。

同時(shí)我也要感謝我的同學(xué)，通過(guò)大學(xué)四年的相處，彼此都互相關(guān)心和幫助，每當(dāng)我遇到困難和挫折的時(shí)候，他們都積極的鼓勵(lì)我，幫助我。

最后還要感謝在這大學(xué)四年中所有教過(guò)我的老師們，是你們使我獲得了知識(shí)的擴(kuò)充，掌握了各種技術(shù)的理論基礎(chǔ)。這都為我最后進(jìn)行畢業(yè)設(shè)計(jì)提供了強(qiáng)大的理論支持。

參 考 文 獻(xiàn)

[1] Luke?Welling，《PHP和MySql Web開(kāi)發(fā)》，機(jī)械工業(yè)出版社 [2] 孔祥盛，《PHP編程基礎(chǔ)與實(shí)例教程》，人民郵電出版社

[3] 丁海燕，《Dreamweaver 網(wǎng)頁(yè)設(shè)計(jì)與制作案例教程》，清華大學(xué)出版社 [4] 本社，《Photoshop CS6從入門(mén)到精通》，北京希望電子出版社 [5] 羅云模，SQL Server 2000數(shù)據(jù)倉(cāng)庫(kù)應(yīng)用與開(kāi)發(fā)，人民郵電出版社

[6] 殷佳庭,陸婷婷.基于PHP技術(shù)的ECSHOP的二次開(kāi)發(fā)[J].科技信息.2011(32)[7] 紀(jì)海燕.基于PHP技術(shù)的教師資格考試準(zhǔn)考證網(wǎng)上打印系統(tǒng)及后臺(tái)管理系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)[J].科技信息.2012(09)[8] 張飛.基于PHP和MySQL的同學(xué)錄管理系統(tǒng)[J].計(jì)算機(jī)光盤(pán)軟件與應(yīng)用.2012(03)[9] 邱煜炎.基于PHP的論文管理系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)[J].中國(guó)教育信息化.2012(05)[10] 王歡,何友軍,杜鑫,李智宇.基于PHP MVC與ExtJs結(jié)合開(kāi)發(fā)會(huì)議預(yù)約系統(tǒng)[J].電腦編程技巧與維護(hù).2012(12)[11] 賈素來(lái).使用PHP和MySQL開(kāi)發(fā)動(dòng)態(tài)網(wǎng)站[J].大眾科技.2011(03)[12] 劉艷杰,王軍豪.基于PHP技術(shù)在線考試系統(tǒng)的設(shè)計(jì)[J].電腦知識(shí)與技術(shù).2011(29)[13] 田寧莉.基于PHP的Web數(shù)據(jù)庫(kù)訪問(wèn)[J].科技風(fēng).2008(05)[14] 郭亮,高輝.動(dòng)態(tài)網(wǎng)頁(yè)技術(shù)ASP,PHP,JSP的比較[J].黑龍江科技信息.2007(17)[15] 劉艷妮,張平平,張都應(yīng).利用PHP技術(shù)加強(qiáng)高校數(shù)字化校園的信息資源建設(shè)[J].技術(shù)與創(chuàng)新管理.2009(04)[16] 毛耀,楊頌華,祖正容,葉海濱.基于Flash的動(dòng)態(tài)網(wǎng)站新方案[J].西南民族學(xué)院學(xué)報(bào)(自然科學(xué)版).2001(03)

第四篇：個(gè)人網(wǎng)站的設(shè)計(jì)與實(shí)現(xiàn) 畢業(yè)設(shè)計(jì)(論文)

隨著國(guó)際互聯(lián)網(wǎng)的普及，很多人已經(jīng)不滿足僅僅在Internet上的瀏覽信息，而

是希望更深入的參與其中，擁有自己的Web網(wǎng)站，這似乎已經(jīng)成為一種潮流。如果說(shuō)個(gè)

人建立網(wǎng)站是為了追求時(shí)尚，那么企業(yè)建立網(wǎng)站就是必然的選擇了。

無(wú)論是專(zhuān)業(yè)的，還是業(yè)余的，很多人對(duì)網(wǎng)頁(yè)制作頗感興趣。事實(shí)上制作一個(gè)簡(jiǎn)單的

網(wǎng)頁(yè)并不困難，會(huì)使用Word的人都可以勝任。但想做出超凡脫俗的網(wǎng)頁(yè)就不那么容易

了，而Dreamweaver卻可以滿足你的愿望，它是Macromedia公司開(kāi)發(fā)的集網(wǎng)頁(yè)制作和

網(wǎng)站管理于一身的所見(jiàn)即所得的網(wǎng)頁(yè)編輯器。

同樣出自Macromedia公司的Flash,Fireworks在制作網(wǎng)站的過(guò)程中起到了錦上添

花的作用，是個(gè)人網(wǎng)站實(shí)現(xiàn)的好幫手，在制作網(wǎng)站的時(shí)候經(jīng)常會(huì)用到這些軟件。

本文有五章，我來(lái)由淺到深介紹個(gè)人網(wǎng)站的設(shè)計(jì)與實(shí)現(xiàn)。

摘

摘摘

摘

要

要要 要

在互聯(lián)網(wǎng)走進(jìn)我們的生活之前，沒(méi)有人敢夢(mèng)想擁有自己的報(bào)紙、雜志、電臺(tái)、電

視臺(tái)。除了政策上的制約外，一個(gè)人也根本沒(méi)有操作一份傳播媒體的能力。現(xiàn)在不同了，互聯(lián)網(wǎng)給我們提供了一個(gè)“表達(dá)自我”的自由天地,你可以擁有自己的新聞郵件，你可

以建立自己的個(gè)人網(wǎng)站。只要你辦得成功也可以吸引成千上萬(wàn)的訂戶、讀者,并建立自

己在眾多參與者中的權(quán)威地位。建立個(gè)人網(wǎng)站的基本過(guò)程可以分為以下七個(gè)環(huán)節(jié) : 1 了解中國(guó)網(wǎng)絡(luò)個(gè)人主頁(yè)研究背景與發(fā)展現(xiàn)狀 系統(tǒng)需求分析與總體設(shè)計(jì) 熟悉網(wǎng)站開(kāi)發(fā)模式、工具及環(huán)境 把自己的作品和想要展示的內(nèi)容制作成網(wǎng)頁(yè)。使用動(dòng)態(tài)網(wǎng)頁(yè)技術(shù)(ASP)，實(shí)現(xiàn)動(dòng)態(tài)內(nèi)容更新。認(rèn)真地選取測(cè)試用例，進(jìn)行交叉測(cè)試 網(wǎng)站的后期完善、宣傳及發(fā)展方向

其中 ,網(wǎng)頁(yè)制作和使用動(dòng)態(tài)網(wǎng)頁(yè)技術(shù)(ASP)實(shí)現(xiàn)動(dòng)態(tài)內(nèi)容更新是網(wǎng)站開(kāi)發(fā)的核心內(nèi)容。

關(guān)鍵詞：網(wǎng)頁(yè)、制作、訪問(wèn)、鏈接

Abstract

目 錄

第一章 引言

1.1 什么是Internet

1.2 Internet有哪些功能 1.3 www簡(jiǎn)介

1.4 網(wǎng)頁(yè)基本構(gòu)成元素

1.5 軟件的安裝與啟動(dòng)

1.5.1 軟件的安裝

1.5.2 軟件的啟動(dòng)

1.5.3 創(chuàng)建快捷方式

1.6 制作網(wǎng)頁(yè)前的準(zhǔn)備

1.7 Dreamweaver的操作環(huán)境

1.7.1標(biāo)題欄

1.7.2菜單欄

1.7.3快捷工具欄

1.7.4屬性面板

第二章 網(wǎng)站制作實(shí)戰(zhàn)

2.1 站點(diǎn)

2.1.1創(chuàng)建站點(diǎn)

2.1.2 創(chuàng)建站點(diǎn)內(nèi)容

2.2 首頁(yè)

2.2.1 設(shè)置首頁(yè)布局

2.2.2 設(shè)置首頁(yè)的頁(yè)面屬性 2.2.3 查看和編輯頭內(nèi)容

2.2.4 插入圖像

2.2.5 插入多媒體 2.2.6 插入文本

2.3 創(chuàng)建其它網(wǎng)頁(yè)

第三章 建立網(wǎng)頁(yè)鏈接

3.1 文字鏈接

3.2 圖像鏈接

3.3 E-Mail鏈接

3.4 文件下載鏈接

3.5 在HTML語(yǔ)言中建立網(wǎng)頁(yè)鏈接

3.5.1 文字鏈接

3.5.2 圖像鏈接

3.5.3 E-Mail鏈接

3.6.4 文件下載鏈接

第四章 結(jié)論

致 謝

參考文獻(xiàn)

第一章

第一章第一章

第一章

預(yù)備知識(shí)

預(yù)備知識(shí)預(yù)備知識(shí)

預(yù)備知識(shí)

1.1

InternetInternet

Internet

Internet的中文名為“國(guó)際互聯(lián)網(wǎng)”，又稱“因特網(wǎng)”。

Internet是由眾多的計(jì)算機(jī)網(wǎng)絡(luò)互聯(lián)而成的互聯(lián)網(wǎng)，它覆蓋了全世界各地，它是采

用開(kāi)放系統(tǒng)協(xié)議的計(jì)算機(jī)通訊網(wǎng)絡(luò)。然而，Internet不僅僅是計(jì)算機(jī)的互聯(lián)網(wǎng)，它還是

全球最大的信息資源寶庫(kù)，它提供了包括科研、教育、文化娛樂(lè)、商業(yè)和信息交流等各

種各樣的服務(wù)，使得世界范圍內(nèi)的人與人之間的交流在時(shí)間和空間上變的更小了。

要了解Internet，就必須先了解局域網(wǎng)。我們可以將同一地點(diǎn)的許多計(jì)算機(jī)使用網(wǎng)

線連接在一起，構(gòu)成一個(gè)高效率的計(jì)算機(jī)網(wǎng)絡(luò)，所有處于網(wǎng)絡(luò)內(nèi)的終端機(jī)或電腦都能享

受網(wǎng)絡(luò)內(nèi)所有的資源，比如程序，圖文資料等。這種計(jì)算機(jī)網(wǎng)絡(luò)因?yàn)橐话愣季窒拊谝欢?/p>

區(qū)域中，我們稱之為“局域網(wǎng)”（Local Area Network,簡(jiǎn)稱LAN）,它是在日常工作中

用得最多的一種小型計(jì)算機(jī)網(wǎng)絡(luò)。局域網(wǎng)所覆蓋的地理范圍比較小，通常不超過(guò)幾十公

里，甚至只在同一座建筑物內(nèi)或者鄰近的幾座建筑內(nèi)。像常見(jiàn)的校園網(wǎng)，一座寫(xiě)字樓內(nèi)

部的網(wǎng)絡(luò)等都屬于局域網(wǎng)。

而Internet則不是指單個(gè)區(qū)域范圍內(nèi)的網(wǎng)絡(luò)，而是指將全世界的各中不同類(lèi)型的

計(jì)算機(jī)網(wǎng)絡(luò)連接起來(lái)的一個(gè)全球性的網(wǎng)絡(luò)。Internet上有取之不盡，用之不竭的信息資

源。對(duì)于Internet中各種各樣的信息，所有的人都可以通過(guò)網(wǎng)絡(luò)的連接來(lái)共享和使用。1.2

1.2 Internet有那些功能

Web頁(yè)瀏覽：這是目前利用最廣泛、最直接的互聯(lián)網(wǎng)服務(wù)，通過(guò)瀏覽WWW（萬(wàn)維網(wǎng)）

中的網(wǎng)頁(yè)，可以了解世界各地的新聞，查看最新的股市行情，最新的娛樂(lè)動(dòng)態(tài)、科技發(fā)

明，找到眾多的就業(yè)信息??幾乎想找到什么樣的信息，就有什么信息。正是有了WWW、Internet才會(huì)變得如此豐富多彩，才能走進(jìn)千家萬(wàn)戶。信息發(fā)布：通過(guò)Internet，不僅可以瀏覽別人發(fā)布在Web頁(yè)上的信息，也可以將

自己要發(fā)布的信息制作成Web頁(yè)，也即網(wǎng)頁(yè)，然后發(fā)布到Internet上，供全世界的人

瀏覽。

電子郵件：不同于傳統(tǒng)郵件，電子郵件(E-mail)通過(guò)Internet傳輸，寫(xiě)信，發(fā)信，收信都在計(jì)算機(jī)上完成，一封電子郵件最短在一秒之內(nèi)就可以發(fā)送出去，其效率是傳統(tǒng)

郵件無(wú)法比擬的。而且發(fā)送與接收電子郵件幾乎是免費(fèi)的，所以比傳統(tǒng)郵件既節(jié)省時(shí)間

又經(jīng)濟(jì)的多。

網(wǎng)上聊天：通過(guò)聊天軟件（如QQ、ICQ等）或不同網(wǎng)站的聊天室，可以和世界各

地的網(wǎng)友聊天。網(wǎng)友可能是遠(yuǎn)在天邊的異國(guó)朋友，也可能是與你一起工作的餓同事，或

者是一起生活的家人，在這里沒(méi)有年齡、性別、身份、職業(yè)、國(guó)籍、膚色的限制，完全

突破了交友的傳統(tǒng)方式，人們可通過(guò)Internet互相了解對(duì)方，進(jìn)行各種各樣的交流。

電子商務(wù)：現(xiàn)在網(wǎng)上交易已經(jīng)成為現(xiàn)實(shí)，網(wǎng)上購(gòu)物、網(wǎng)上商品銷(xiāo)售、網(wǎng)上拍賣(mài)、企業(yè)級(jí)電子商務(wù)、網(wǎng)上貨幣支付等電子商務(wù)活動(dòng)已經(jīng)搞的有聲有色，幾乎所有的專(zhuān)家都

預(yù)測(cè)，在未來(lái)的幾年內(nèi)，電子商務(wù)會(huì)飛速發(fā)展。在不久的將來(lái)，您可以做在電腦前進(jìn)行

各種各樣的商務(wù)活動(dòng)。

網(wǎng)絡(luò)游戲：通過(guò)Internet，可以與全世界的玩家一起進(jìn)行游戲?qū)?zhàn)，也可以協(xié)同

作戰(zhàn)。網(wǎng)絡(luò)游戲已經(jīng)成為信息產(chǎn)業(yè)全新的經(jīng)濟(jì)增長(zhǎng)點(diǎn)，每年都為開(kāi)發(fā)商帶來(lái)巨額的利潤(rùn)。

通過(guò)網(wǎng)絡(luò)游戲，可以充分享受Internet給我們帶來(lái)的樂(lè)趣。

網(wǎng)絡(luò)電話：網(wǎng)絡(luò)電話也稱IP電話。它采用Internet技術(shù)，利用專(zhuān)門(mén)的網(wǎng)絡(luò)電話

軟件，只需支付非常低廉的話費(fèi)就可通話。Internet在電信市場(chǎng)上的應(yīng)用將越來(lái)越廣泛。

1.3 WWW的簡(jiǎn)介

WWW的全稱為World Wide Web，含義是“環(huán)球網(wǎng)”，又稱“萬(wàn)維網(wǎng)”、3W、Web。

WWW是一個(gè)基于超文本（Hypertext）方式的信息檢索服務(wù)工具。我們上網(wǎng)瀏覽到的網(wǎng)頁(yè)就是這樣的超文本，也就是HTML(Hypertext Mark-up Language,超文本標(biāo)記語(yǔ)言)文件，這些網(wǎng)頁(yè)文件被放置到WWW服務(wù)器上，并且都有一定的地址。當(dāng)我們想瀏覽某個(gè)網(wǎng)站時(shí)，首先要在電腦上安裝瀏覽器，如Internet Explorer或Netscape，然后在瀏覽器中輸

入網(wǎng)站的地址（網(wǎng)址），就可以進(jìn)入網(wǎng)站進(jìn)行瀏覽。在這些網(wǎng)頁(yè)中，都有超連接，當(dāng)將

鼠標(biāo)指針移動(dòng)到某個(gè)地方（如文本或圖象）時(shí)，鼠標(biāo)指針就會(huì)變成一個(gè)小手形形狀，單

擊它就可以連接到另個(gè)網(wǎng)頁(yè)中，從而使得瀏覽者能在不同的信息之間跳轉(zhuǎn)，我們之所以

能在Internet的海洋中穿梭自如，正是超連接的功勞。

WWW 為我們帶來(lái)的是世界范圍的超級(jí)文本服務(wù)：只須操縱鼠標(biāo)，就可以通過(guò)Inter net從世界各地調(diào)來(lái)你所希望的文本、圖像、動(dòng)畫(huà)和聲音等信息。通過(guò)使用WWW，一個(gè)

不熟悉網(wǎng)絡(luò)使用的人也可以成為Internet的行家。

1.4網(wǎng)頁(yè)基本構(gòu)成元素

要學(xué)會(huì)制作網(wǎng)頁(yè)，首先需要了解網(wǎng)頁(yè)都是由什么元素構(gòu)成的。

文字：文本是構(gòu)成網(wǎng)頁(yè)的基本元素。一個(gè)最簡(jiǎn)單的網(wǎng)頁(yè)可以只有幾行文本。

圖片：正是有個(gè)各種美麗的圖片，網(wǎng)頁(yè)才變得多姿多彩。

動(dòng)畫(huà)：如今，網(wǎng)頁(yè)上的動(dòng)畫(huà)越來(lái)越多，最常用的有GIF動(dòng)畫(huà)、Flash動(dòng)畫(huà)等。

超連接：如上所述，超連接幾乎是必不可少的。一個(gè)沒(méi)有超連接的網(wǎng)頁(yè)，就如同汪

洋大海中的一座孤島，失去了與外界的一切聯(lián)系。

其它元素：還可以在網(wǎng)頁(yè)中添加聲音、視頻等元素。

1.5軟件的安裝與啟動(dòng)

要使用網(wǎng)站設(shè)計(jì)軟件，自然先要將這些軟件安裝到自己的電腦中。安裝完畢，還需

要如何啟動(dòng)，如何創(chuàng)建快捷方式。下面就讓我們來(lái)詳細(xì)地看一看具體的操作步驟。

1.5.1軟件的安裝

安裝之前，需要先了解軟件對(duì)系統(tǒng)的要求。以Windows為例，系統(tǒng)要求如下：

Intel Pentium II處理器或等效處理器，主頻300MHz或更高。

Windows 98Windows 2000Windows NT(具有Service Pack 3 或更高版本)、Windo

ws Me或Windows XP.Netscape Navigator 4.0版或更高版本或Microsoft Internet Explorer.96MB的可用內(nèi)存（RAM），建議采用128MB內(nèi)存。

分辨率可達(dá) 800×600像素的256色顯示器（建議顏色為百萬(wàn)顏色，分辨率達(dá)到102

4×768像素）。

CD-ROM 驅(qū)動(dòng)器。

檢查一下您的計(jì)算機(jī)，看是否具備了以上條件。如果具備，將“Macromedia Stud

io MX”程序會(huì)自動(dòng)運(yùn)行。如果不能自動(dòng)運(yùn)行，可以找到光盤(pán)放入光驅(qū)，安裝程序會(huì)自

動(dòng)運(yùn)行?？梢哉业焦獗P(pán)中的“Install Macromedia Studio MX”程序或“Autorun”程

序并雙擊運(yùn)行。

Dreamweaver的安裝比較容易，幾乎可以自動(dòng)完成。下面簡(jiǎn)要說(shuō)明一下安裝步驟。

操作步驟：

1、將安裝光盤(pán)放入光驅(qū)，安裝程序自動(dòng)運(yùn)行，并出現(xiàn)安裝界面。如果單擊安裝界面

上的“Macromedia STUDIO MX安裝”，那么將會(huì)安裝其下方所列出的軟件。所有的安裝

會(huì)自動(dòng)完成。

2、單擊Dreamweaver MX,開(kāi)始安裝過(guò)裝過(guò)程.先是出現(xiàn)解壓縮文件窗口,等待一會(huì)兒，便會(huì)出現(xiàn)安裝向?qū)?duì)話框。單擊“下一步”按鈕，繼續(xù)安裝過(guò)程。

3、出現(xiàn)“選擇目的地位置”對(duì)話框，默認(rèn)的盤(pán)是C盤(pán)，如果想安裝到不同的位置，可以單擊目的文件夾右邊的“瀏覽”按鈕，并在彈出的“選擇文件夾”對(duì)話框選擇不同 的文件，如要安裝在D盤(pán)則可直接將路徑中的“C：”改為“D:”。也可以在下面的“目

錄”中選擇其它的文件夾，設(shè)置完后，單擊“確定”，回到“選擇目的地址”對(duì)話框，單擊“下一步”繼續(xù)。

4、而后會(huì)出現(xiàn)“默認(rèn)編輯器”的對(duì)話框，默認(rèn)為全選。如果希望讓Dreamweaver M

X成為下面所列文件類(lèi)型的默認(rèn)編輯器，那么可以在這里做選擇。選擇完畢，單擊“下

一步”按鈕。

5、出現(xiàn)“開(kāi)始復(fù)制文件”對(duì)話框，單擊“下一步”安裝程序開(kāi)始復(fù)制文件，過(guò)幾

分鐘后，安裝結(jié)束，單擊“結(jié)束”按鈕，結(jié)束安裝。

1.5.2 軟件啟動(dòng)

軟件安裝完畢后，我們就可以使用它了。安裝程序已經(jīng)自動(dòng)在“開(kāi)始”菜單中加入

了快捷方式。

單擊“開(kāi)始”菜單，將鼠標(biāo)指針依次指向“程序”|“Macromedia”|“MacromediaMX”,并在上面單擊鼠標(biāo)左鍵。

1.5.3 創(chuàng)建快捷方式

使用“開(kāi)始”菜單啟動(dòng)程序的過(guò)程比較煩瑣。可以在Windows桌面或快速啟動(dòng)欄上

創(chuàng)建快捷方式，這樣可以快速的啟動(dòng)程序。

具體實(shí)現(xiàn)方法是：在“開(kāi)始”菜單中找到相應(yīng)程序的快捷方式，不過(guò)這是不要用

鼠標(biāo)左鍵單擊，而是用右鍵按住向桌面拖動(dòng)，然后松開(kāi)右鍵，會(huì)出現(xiàn)一個(gè)快捷菜單，在

其中可以選擇不同的命令，比如選擇“在當(dāng)前位置創(chuàng)建快捷方式”或“復(fù)制到當(dāng)前位置”。

這樣以后在運(yùn)行程序時(shí)，就方便快捷的多了。

1.6 制作網(wǎng)頁(yè)前的準(zhǔn)備

電腦必備：

電腦速度夠快，最好能夠上網(wǎng)。

操作系統(tǒng)：Windows XP.軟件可選： 其它軟件：看圖軟件美圖秀秀 圖像處理軟件Photoshop、上傳工具CuteFTP

1.7 Dreamweaver MX的操作環(huán)境

我們將工作界面分成了“標(biāo)題欄”、“菜單欄”、“快捷工具欄”、“屬性面板”、“浮動(dòng)控制面板”5個(gè)部分來(lái)分別介紹。

1.7.1 標(biāo)題欄

Dreamweaver MX的“標(biāo)題欄”中將顯示文字“Macromedia Dreamweaver MX”如果

打開(kāi)網(wǎng)頁(yè)的話，在后面還會(huì)顯示該網(wǎng)頁(yè)的一些信息，如網(wǎng)頁(yè)標(biāo)題、所在位置及網(wǎng)頁(yè)名稱，右邊有三個(gè)鈕，分別對(duì)應(yīng)Dreamweaver MX的最大化最小化和關(guān)閉的操作。

1.7.2 菜單欄

“標(biāo)題欄”下面就是“菜單欄”，欄中提供了“文件”、“編輯”、“查看”、“插

入”、“修改”、“文本”、“站點(diǎn)”、“窗口”、“幫助”10項(xiàng)菜單。單擊其中任意

一項(xiàng)菜單，隨即就會(huì)出現(xiàn)一個(gè)下拉式指令菜單。有些指令的右邊會(huì)有鍵盤(pán)的代碼，這是

該指令的快捷鍵，熟練使用快捷鍵將會(huì)有助于提高工作效率。有些指令的右邊會(huì)有一個(gè)

小黑三角的標(biāo)記，它代表該指令還包含下一級(jí)的指令，鼠標(biāo)停留片刻即可顯示。

1.7.3 快捷工具欄

“快捷工具欄”指的是“菜單欄”下邊的3排按鈕，選擇菜單“查看/工具欄”，勾

選里面的“插入”、“文檔”和“標(biāo)準(zhǔn)”3項(xiàng)，完整的快捷工具欄就顯現(xiàn)出來(lái)了。

1.7.4 屬性面板

在網(wǎng)頁(yè)編輯窗口的下面還有一個(gè)面板，它是有名的“屬性面板”，它在這個(gè)軟件中

起到舉足輕重的作用。

屬性面板顧名思義，就是顯示，調(diào)整屬性的面板，根據(jù)鼠標(biāo)所選中對(duì)象的不同，“屬性

面板”在界面上也會(huì)有所差異，用戶可以分別對(duì)不同的對(duì)象進(jìn)行調(diào)整。

站點(diǎn)

2.1.1

創(chuàng)建站點(diǎn)

創(chuàng)建站點(diǎn)

要制作一個(gè)網(wǎng)站，第一步操作都是一樣的，就是要?jiǎng)?chuàng)造一個(gè)“站點(diǎn)”，這樣可以使

整個(gè)網(wǎng)站的脈絡(luò)結(jié)構(gòu)清晰地展現(xiàn)在面前，避免了以后再進(jìn)行紛雜的管理。

從菜單中選擇“站點(diǎn)/管理站點(diǎn)”在彈出的對(duì)話框中選擇“新建”，之后再選擇其

中的“站點(diǎn)”，再次彈出一個(gè)對(duì)話框，在文本框中輸入自己已經(jīng)企化好的網(wǎng)站名稱“追

夢(mèng)人”。

填好后，單擊“下一步”，進(jìn)入下一個(gè)步驟。由于我要做的是一個(gè)靜態(tài)的網(wǎng)頁(yè)，所以選擇上面的一項(xiàng)“否，我不想使用服務(wù)器技術(shù)。”

單擊“下一步”，進(jìn)入下一個(gè)步驟。

在此選項(xiàng)中有兩個(gè)選擇，選擇推薦的“編輯我的計(jì)算機(jī)上的本地副本，完成后再上

傳到服務(wù)器”。底下的文本框允許在本地磁盤(pán)上指定一個(gè)文件夾，Dreamweaver將在其 中儲(chǔ)存站點(diǎn)文件的本地副本。單擊該文本框后面的文件夾圖標(biāo)，新建并指定一個(gè)空的文

件夾“E:/ding”。之后單擊“下一步“，進(jìn)入下一個(gè)步驟。

這一步是如何設(shè)置連接到遠(yuǎn)程服務(wù)器，彈出式菜單中有6中選擇，這里選擇“無(wú)”。

而后“下一步”再“完成”，即可。

2.1.2 創(chuàng)建站點(diǎn)內(nèi)容

站點(diǎn)創(chuàng)建完成后，就可以創(chuàng)建Web頁(yè)來(lái)填充站點(diǎn)了。在“右側(cè)浮動(dòng)面板組”中選擇

“文件/文件”面板，此時(shí)整個(gè)網(wǎng)站中沒(méi)有任何內(nèi)容。用鼠標(biāo)右擊面板中的本地根目錄

文件夾。在彈出的菜單中選擇“新建文件”，新建一個(gè)文件后將其命名為“index.htm(或i

ndex.html),它就是未來(lái)的首頁(yè)。

由于“追夢(mèng)人”網(wǎng)站分為“平面設(shè)計(jì)”、“動(dòng)畫(huà)制作”、“網(wǎng)文精品”、“經(jīng)典回

顧”、“個(gè)人說(shuō)明“這五個(gè)大欄目，所以繼續(xù)用鼠標(biāo)右擊右側(cè)，在彈出的菜單中選擇第

二項(xiàng)“New Folder（新建文件夾）”。執(zhí)行五次操作，新建五個(gè)文件夾，并把它們重命

名為graph、anim、books、music、letter，分別對(duì)應(yīng)上面的五個(gè)大欄目。存放它們各

自的內(nèi)容。之后再次新建1個(gè)文件夾，命名為images,用來(lái)存放“所有的圖象文件”的

內(nèi)容。

之后在個(gè)欄目的文件夾里還要建立想相應(yīng)的欄目網(wǎng)頁(yè)。

2.2.1 設(shè)置首頁(yè)布局

每個(gè)網(wǎng)站都會(huì)有一個(gè)首頁(yè)，就功能上而言，它代表著一個(gè)網(wǎng)站的風(fēng)格與特色，就網(wǎng)站

架構(gòu)上而言，它代表了網(wǎng)站的第一層架構(gòu)，至于網(wǎng)站上其他Web頁(yè)，原則上都必須通過(guò)

首頁(yè)來(lái)連接散播出去，可見(jiàn)首頁(yè)是多么的重要。

首頁(yè)是打開(kāi)網(wǎng)站后在瀏覽器中顯示的第一個(gè)頁(yè)面。它是起什么名字通常要視Server端 的設(shè)置，一般的有index.htm,default.htm或home.htm等，目前主要以index.htm的

居多。當(dāng)然，后綴名為html也是正確的。

具體設(shè)置方法是：右健單擊“文件”浮動(dòng)面板中的index.htm,在彈出的菜單中選擇“設(shè)

成首頁(yè)”。

首頁(yè)的布局有很多方法，在這里我所用到的是表格的“布局模式”?！安季帧蹦Ｊ街械谋砀穹Q為布局表格，單元格稱為布局單元格。在繪制布局表格和布局單元格時(shí)，必須從

“標(biāo)準(zhǔn)”模式切換到“布局”模式。直接單擊“布局”按鈕即可。

操作步驟：

1、在“插入快捷欄”的“布局”分類(lèi)中，單擊“布局表格”按紐。

2、將變成“+”形狀的鼠標(biāo)光標(biāo)放到編輯中網(wǎng)頁(yè)上，在要繪制的地方進(jìn)行拖動(dòng)

就可以進(jìn)行創(chuàng)建了。（如果繪制的是第一個(gè)表格必須從網(wǎng)頁(yè)的最左上角開(kāi)始繪制）。

3、在這里要繪制多個(gè)表格，可以再次單擊“布局表格”按紐進(jìn)行繪制，也可

以按住Ctrl鍵繪制多個(gè)表格。追夢(mèng)人”網(wǎng)站首頁(yè)的布局如圖所示：

2.2.2設(shè)置首頁(yè)的頁(yè)面屬性

首先雙擊“文件”浮動(dòng)面板中的index.htm,進(jìn)入頁(yè)面的編輯窗口。右健單擊空白

區(qū)域，在菜單中選擇“頁(yè)面屬性”，之后彈出“頁(yè)面屬性”對(duì)話框，若選擇主菜單“修

改/頁(yè)面屬性”項(xiàng)，也可以把打開(kāi)該對(duì)話框。

在“頁(yè)面屬性”對(duì)話框中，左側(cè)窗口顯示“分類(lèi)”，其中包括了“外觀”、“鏈

接”、“標(biāo)題”、“標(biāo)題/編碼”、“跟蹤圖像”5項(xiàng)，右側(cè)區(qū)域則顯示各類(lèi)中可以設(shè)置 的項(xiàng)目?！白穳?mèng)人”首頁(yè)設(shè)置的屬性如下圖所示：

2.2.3查看和編輯頭內(nèi)容

一個(gè)網(wǎng)頁(yè)文件結(jié)構(gòu)上實(shí)際是由兩部分組成，頭（head）內(nèi)容和主體（body）內(nèi)容

主體內(nèi)容（body）是文檔的主要部分，也是包含文本和圖像等的可見(jiàn)部分。頭內(nèi)容（he

ad）是除文檔標(biāo)題外的不可見(jiàn)部分，包含有文檔類(lèi)型、語(yǔ)言編碼、搜索引擎的關(guān)鍵的關(guān)鍵字和內(nèi)容指示器以及樣式定義等重要信息，這些元器并不是每個(gè)頁(yè)面都需要的，例如，可以僅為主頁(yè)提供關(guān)鍵字。

下面就以首頁(yè)為例，說(shuō)明怎樣插入較常用的頭（head）內(nèi)容。

單擊“菜單攔”下面“插入快捷”的下拉列表，選擇其中的HTML類(lèi)，此時(shí)右側(cè)將

會(huì)顯示該類(lèi)中可以插入的對(duì)象快捷按鈕，再次單擊第2個(gè)按鈕“文件頭”旁邊的下拉箭

頭，會(huì)彈出菜單，該項(xiàng)列出的便是即將插入的頭內(nèi)容。

2.2.4 插入圖像

圖像是網(wǎng)頁(yè)中不可或缺的組成成份，恰當(dāng)?shù)厥褂脠D像，可以使網(wǎng)站充滿生活生命力

與說(shuō)服力，吸引更多的瀏覽者，加深他們欣賞你網(wǎng)站的意愿。

另一方面，網(wǎng)頁(yè)的容量大小是網(wǎng)站成功與否的一大關(guān)鍵因素。由于網(wǎng)絡(luò)在傳輸上 的限制，導(dǎo)致了下載的速度不可能太快，因此，網(wǎng)頁(yè)的大小就不能太大，其中關(guān)鍵就在

于圖像的大小了，否則瀏覽者會(huì)失去等待的耐心，無(wú)論你的網(wǎng)站多么精彩也無(wú)濟(jì)于事了。所以，在網(wǎng)面容量大小的問(wèn)題上一定要重視。下面就來(lái)詳細(xì)介紹對(duì)網(wǎng)頁(yè)圖像進(jìn)行處理的

操作步驟，以使得它們?cè)诒３謭D形美麗與網(wǎng)站風(fēng)格搭配的基礎(chǔ)上，圖片文件能夠變的更

小。

1、首先將光標(biāo)停留在要插入圖像的位置，然后單擊“菜單欄”下面“插入快健欄” 的下拉表，選擇其中的“常用”類(lèi)，則右側(cè)將會(huì)顯示該類(lèi)中可以插入的對(duì)象快鍵按鈕。

左起第5個(gè)即為“圖像：圖像”按鈕，單擊它右側(cè)的下拉列表，選擇第1項(xiàng)“圖像”。

2、隨即彈出“選擇圖像源文件”對(duì)話框。從計(jì)算機(jī)磁盤(pán)中選擇想要插入的圖像文件，或在URL編輯框中輸入圖像的路徑和名稱。下面的“相對(duì)于”下拉表框中，可選擇文件

URL地址的類(lèi)型，如果選擇“文檔”選項(xiàng)，表示圖像地址相對(duì)于當(dāng)前文檔；如果選擇“站

點(diǎn)根目錄”選項(xiàng)，表示地址相對(duì)于根目錄。在這里我要插入的是網(wǎng)站標(biāo)志logo，插入l

ogo圖象，如圖所示：

最后單擊“確定”按鈕，即可完成插入圖像的操作。2.2.5插入多媒體

在Dreamweaver MX2004中，除了之前講到的可以插入“圖像”外，還可插入動(dòng)畫(huà)、聲音、視頻等媒體元素，如Flash,Shockwave,Applets,ActieX及格Midi聲音文件等，并且還可以在Dreamweaver自身內(nèi)插入Macromedia Flash MX2004按鈕和文本對(duì)象，以

及進(jìn)行相關(guān)的后期處理和添加設(shè)計(jì)備注等操作。

在Dreamweaver MX 2004文檔中，可以插入媒體文件包括Flash Shockwave影片、QuickTime、AVI java、applet Active X控件以及各種格式的音頻文件。

要在瀏覽器中播放放Flash 動(dòng)畫(huà)，必須在瀏覽器中集成“Flash 播放器（Flash Play er）”。其中，Internet Explorer通過(guò)ActiveX控制來(lái)實(shí)現(xiàn)，Netscape Navigator則

是通過(guò)相應(yīng)的插件來(lái)實(shí)現(xiàn)的。在最新的Netscape Navigator和Internet Explorer瀏

覽器中，均已集成了 Flash動(dòng)畫(huà)播放功能。操場(chǎng)作步驟：

步驟1 將光標(biāo)停留在要插入Flash的位置，然后單擊菜單欄下面“插入快捷欄”的下

拉列表，選擇其中的“常用”分類(lèi)，右側(cè)將會(huì)顯示該類(lèi)中可以插入的對(duì)象快捷

按鈕。左起第6個(gè)即為“媒體”按鈕，單擊它右側(cè)的下拉列表，選擇第1項(xiàng)Fl

ash圖標(biāo)。

步驟2 在彈出的對(duì)話框中選擇擴(kuò)展名為swf 的Flash文件，即可將其插入到Dreamwe

aver的“網(wǎng)頁(yè)編輯窗口”中，可以看到，在這個(gè)窗口中Flash文件的大小。在

這里我的主頁(yè)插入的一個(gè)動(dòng)畫(huà)，如圖所示：

2.2.6插入文本

文字是人類(lèi)語(yǔ)言最基本的表達(dá)方式，在網(wǎng)頁(yè)中，文本內(nèi)容也可以說(shuō)是重要的組成

部分，一個(gè)網(wǎng)站成功與否，它是最關(guān)鍵的因素。在這最關(guān)鍵的因素?？韶S富網(wǎng)站的文字

內(nèi)容，并以最最美觀、最整齊的方式放入到網(wǎng)頁(yè)中。

插入文本的兩種方式

網(wǎng)頁(yè)中需要大量的文本，我們或以通過(guò)以下兩種方式插入它們。

一種是在網(wǎng)頁(yè)編輯窗口中直接用鍵盤(pán)敲入文本。這可以算是最基本的輸入方式了，和一些文本編輯軟件（如Microsoft Word）的使用方法一樣，選擇好習(xí)慣的輸入法，就

可以運(yùn)指如飛了。

另一種是復(fù)制文本的方式。有些讀者可能不喜歡使用Dreamweaver MX2004來(lái)進(jìn)行

打字的工作，而更習(xí)慣在專(zhuān)門(mén)的文本編輯軟件中快速打字，如Microsoft Word和 Wind

ows自帶的記事本等，又或者讀者已經(jīng)準(zhǔn)備好了要放入網(wǎng)頁(yè)的文本的電子版本，那么我

們就可以直接使用Dreamweaver的文本復(fù)制功能，將大段的文本內(nèi)容拷貝到網(wǎng)頁(yè)的編輯

窗口來(lái)進(jìn)行排版的工作，具體步驟如下。

打開(kāi)文本編輯軟件（如Microsoft Word），選中要復(fù)制的文本，它們將反白顯示，執(zhí)行菜單“編輯/復(fù)制”命令或直接用快捷鍵Ctrl+C，之后切換回Dreamweaver,將光標(biāo)

停留在插入文本的位置，執(zhí)行主菜單“編輯/粘貼”命令或直接使用快捷鍵Ctrl+v,即可

將大段的文本快速粘貼到網(wǎng)頁(yè)中。

這在我的“網(wǎng)文精品”中用到很多，全部是在word軟件中排好ctrl+c,然后點(diǎn)擊要

粘貼的位置，crtl+v到Dreamweaver即可。

2.3創(chuàng)建其它網(wǎng)頁(yè)

還有其它的幾個(gè)網(wǎng)站與主頁(yè)的制作相同，一個(gè)網(wǎng)頁(yè)是圖象和文字的組合。“平面設(shè)計(jì)”中的圖象插入和前面的介紹相似，并可以在屬性攔中調(diào)節(jié)圖象的大小。

在Dreamwerver中常常會(huì)用到Firework、Flash，它們是相輔相成，在主頁(yè)中的主體部

分就是用Firework,如圖所示：

在“個(gè)人說(shuō)明”中也用到這點(diǎn)，首先定好需要尺寸，在屬性中設(shè)好背景，顏色等

等，插入圖象，輸入文字，也word里的操作雷同。

3.建立網(wǎng)頁(yè)鏈接

網(wǎng)站實(shí)際上是由很多網(wǎng)頁(yè)組成的，那么網(wǎng)頁(yè)之間是如何聯(lián)系的呢？這就是本章要講 的內(nèi)容----網(wǎng)頁(yè)的“鏈接”?！版溄印保址Q“超鏈接"（Hyperlink）,它作為網(wǎng)頁(yè)的橋梁，起著相當(dāng)重要的作用。網(wǎng)頁(yè)中的很多對(duì)象都可以加入“鏈接”屬性。在Dreamweaver MX2004中，如果以“鏈

接”的媒介來(lái)劃分的話，則“鏈接”可以分為“文字鏈接”、“圖像鏈接”、“圖像地圖鏈接”、“內(nèi)部鏈接和外部鏈接”、“E-mail鏈接”、“命名錨記鏈接”、“文件下載鏈接”和“跳轉(zhuǎn)菜單”，共8種。其中部分內(nèi)容在之前的章節(jié)中可能接觸過(guò)，這里將對(duì)其進(jìn)行更深入的講解。3.1文字鏈接

“文字鏈接”即以文字作為媒介的鏈接，它是網(wǎng)頁(yè)中最常被使用的鏈接方式，具

有“文件小、制作簡(jiǎn)單和便于維護(hù)”的特點(diǎn)。

接下來(lái)結(jié)合我的個(gè)人網(wǎng)站為實(shí)例，來(lái)講解如何為文字建立“鏈接”。

具體操作步驟如下所述。操作步驟

步驟1 準(zhǔn)備好已經(jīng)制作完成的首頁(yè)的各個(gè)欄目頁(yè)面（假設(shè)除了“鏈接”，其他內(nèi)容都

已經(jīng)制作完成了），該網(wǎng)站包含6個(gè)欄目，這里的5個(gè)欄目----“平面設(shè)計(jì)”、“動(dòng)畫(huà)

制作”和“網(wǎng)文精品”、“經(jīng)典回顧”、“個(gè)人說(shuō)明”為例來(lái)進(jìn)行講解。

步驟2 在Dreamweaver 中打開(kāi)首頁(yè)，之后反白選取作為“鏈接”的文字。實(shí)例中要做

到單擊不同的欄目的網(wǎng)頁(yè)。因此為第1個(gè)欄目“平面設(shè)計(jì)”設(shè)置鏈接，首先要反白選中

“平面設(shè)計(jì)”4個(gè)文字。

步驟3 觀察“屬性面板”，其中包括一個(gè)“鏈接”文本框。

步驟4 接下來(lái)需要把鏈接的地址加入到文本框中，方法有3種。

這里我用到的是直接點(diǎn)擊文件夾圖標(biāo)，在文件夾中找到要鏈接的對(duì)象graph.htm。這樣

就建立了超鏈接。不過(guò)有點(diǎn)很重要，由于大多數(shù)服務(wù)器都不支持中文文件名，而且對(duì)大

小寫(xiě)敏感，因此采用英文文件名并統(tǒng)一大小寫(xiě)。如圖所示：

步驟5 在“鏈接”文本框下面還有一個(gè)“目標(biāo)”下拉列表，從中可以選擇鏈接網(wǎng)頁(yè)顯示 的窗口方式，共有4種。如圖：

實(shí)例中沒(méi)有選擇任何選項(xiàng)，保持空白，表示在原窗口中打開(kāi)鏈接網(wǎng)頁(yè)。

步驟6 還可以設(shè)置一些“鏈接”的屬性，這是前面講過(guò)的內(nèi)容。單擊“屬性面板”中的 “頁(yè)面屬性”，選擇其中的“鏈接”分類(lèi)，可以進(jìn)行的設(shè)置有“鏈接字體”、“大小”、“鏈接顏色”、“變換圖像鏈接”顏色、“已訪問(wèn)鏈接”顏色、“活動(dòng)鏈接”顏色及“下

劃線樣式”。

步驟7 至此，第1個(gè)欄目的鏈接就制作完畢了，按下Ctrl+S保存網(wǎng)頁(yè)，再按下F12預(yù)

覽，測(cè)試一下，當(dāng)鼠標(biāo)放在“平面設(shè)計(jì)”這4個(gè)文字上時(shí)將變成手形，并且瀏覽器窗口下面的狀態(tài)欄中會(huì)顯示鏈接到的網(wǎng)頁(yè)的地址，單擊文字，頁(yè)面會(huì)立即跳轉(zhuǎn)到第1個(gè)欄目

中，這表示鏈接已經(jīng)制作成功了。

步驟8 同理，按照以上步驟，再為“動(dòng)畫(huà)制作”和“網(wǎng)文精品”“經(jīng)典回顧“等其它欄

制作指向?qū)?yīng)欄目的鏈接。

步驟9 通常在欄目頁(yè)面中還需要有“返回首頁(yè)”的鏈接，單擊其后可以跳轉(zhuǎn)回首頁(yè)，因

此在各個(gè)欄目中還要插入“網(wǎng)站首頁(yè)”的文字，并且制作指向首頁(yè)index.html的鏈接，制作方法不變。

至此，整個(gè)“文字鏈接”的實(shí)例就全就全部完成了。通過(guò)對(duì)這個(gè)實(shí)例的講解，讀者不僅

應(yīng)該學(xué)會(huì)如何為文字制作鏈接，還應(yīng)用對(duì)“鏈接”有了更加深刻的理解，鏈接的目的何

在？它到底能夠在網(wǎng)頁(yè)的網(wǎng)站中發(fā)揮什么樣的作用？怎樣才能更好地使用它？這些是

網(wǎng)頁(yè)制作者更應(yīng)該思考的問(wèn)題。

下面繼續(xù)介紹其他類(lèi)型的鏈接。

3.2

3.23.2

3.2圖像鏈接

圖像鏈接圖像鏈接

圖像鏈接

“圖像”也是常被使用的鏈接媒體，它和“文字鏈接”非常相似。為圖像加入鏈接，首

先應(yīng)該在網(wǎng)頁(yè)中插入“圖像”，有關(guān)插入“圖像”或“導(dǎo)航條”按鈕的內(nèi)容，接下來(lái)以

我的網(wǎng)站“追夢(mèng)人“為例，講解如何建立“圖像鏈接”。

操作步驟

步驟1 首先仍然要準(zhǔn)備好已經(jīng)制作完成的首頁(yè)和各個(gè)欄目的頁(yè)面（假設(shè)除了“鏈接”，其他內(nèi)容都已經(jīng)制作完成了），該網(wǎng)站包含6個(gè)欄目，下面我們就動(dòng)手為這6個(gè)欄目分

別制作它們的鏈接。

步驟2 在Dreamweaver中打開(kāi)網(wǎng)站的首頁(yè)，之后選取要制作“鏈接”的圖像。實(shí)例中先

為第3個(gè)欄目“動(dòng)畫(huà)制作”設(shè)置鏈接，因此選中包含“動(dòng)畫(huà)制作”4個(gè)字的圖像。步驟3 觀察“屬性面板”，在“鏈接”文本框中輸入鏈接的文字地址?？梢允褂弥爸v

過(guò)的“指向文件”和“選擇文件”的方法。

步驟4 如果有需要，可以在“目標(biāo)”下拉列表中選擇“鏈接”網(wǎng)頁(yè)顯示的窗口方式，分

別為-blank、-parent、-self或 top。實(shí)例中使用了默認(rèn)出的保留空白選項(xiàng)的方式。

步驟5 另外，讀者還可以為圖像增加“替代”文本。實(shí)例中為第1個(gè)欄目增加欄目名稱 的“替代”文本。

步驟6 至此，第1個(gè)欄目的圖像鏈接就制作完畢了，按下Ctrl+S保存網(wǎng)頁(yè)，再按下F1 2預(yù)覽，測(cè)試一下，將鼠標(biāo)放在“動(dòng)畫(huà)制作”4個(gè)文字上時(shí)將變成手形，同時(shí)瀏覽器窗

口下面的狀態(tài)欄中會(huì)顯示出鏈接到的網(wǎng)頁(yè)的地址，并且會(huì)顯示出“替代”文本“動(dòng)畫(huà)制

作”，單擊文字，頁(yè)面會(huì)立即跳轉(zhuǎn)到第3個(gè)欄目中，這表示鏈接已經(jīng)制作成功了。

步驟7 同理，按照以上步驟，再為其它幾幅圖像制作指向?qū)?yīng)欄目的鏈接。

步驟8 在欄目頁(yè)面中制作“返回首頁(yè)”的鏈接，使得單擊后可以跳轉(zhuǎn)回首頁(yè)，其制作方

法不變。

至此，整個(gè)“圖像鏈像”的實(shí)例就全部完成了。

3.3E

3.3E 3.3E

3.3E –

––

–Mail

MailMail

Mail的鏈接 的鏈接的鏈接 的鏈接

E-Mail鏈接，是指當(dāng)瀏覽者單擊該鏈接之后，不是打開(kāi)一個(gè)網(wǎng)頁(yè)文件，而是啟動(dòng)用戶的

E-Mail客戶端軟件（如Outlook Express）,并打開(kāi)一個(gè)空白的新郵件，供瀏覽者撰寫(xiě)

內(nèi)容來(lái)與網(wǎng)站聯(lián)系人聯(lián)系，這是一種最方便的互動(dòng)方式。

結(jié)合“個(gè)人說(shuō)明”網(wǎng)頁(yè)，建立E-Mail鏈接的步驟如下所述。

操作步驟 步驟1 將光標(biāo)停留在頁(yè)面右下角要插入E-mail鏈接的位置。步驟2 選擇“插入快捷欄”中的“常用”分類(lèi)，單擊左側(cè)第2個(gè)“電子郵件鏈接”按鈕。

步驟3 在彈出的“電子郵件鏈接”對(duì)話框中有兩個(gè)輸入項(xiàng)，分別是“文本”和“E-Mai

l”。在“文本”項(xiàng)中輸入鏈接的文字，中文、英文均可，在E-Mail項(xiàng)中輸入網(wǎng)站聯(lián)

系有的電子郵件地址，如實(shí)例中的 ding_zhuimeng123@163.net。

步驟4 單擊“確定”按鈕，具有“E-Mail鏈接”屬性的文本就ding_zhuimeng123@163.net。插入到光標(biāo)所在位置了，按下 Ctrl+S保存網(wǎng)頁(yè)，再按下F12預(yù)覽查看實(shí)際效果。

上面的方法只適用于文本的“E-Mail鏈接”，如果想在其它的對(duì)象（如圖像）上也加入

這種鏈接，該怎辦呢？下面介紹第2種建立“E-Mail鏈接”的方法。

其實(shí)很簡(jiǎn)單，與前面講過(guò)的圖像加入鏈接的方法基本一樣。先在頁(yè)面中需要的地方插入

圖像，之后選中圖像，并在“屬性面板”的“鏈接”文本框中輸入如下語(yǔ)句即可----ma

ilto: ding_zhuimeng123@163.net ?subject=網(wǎng)站的建議與第1種方法不同的是，E-Ma

il 地址前面增加了mailto:字樣。用這種方法就可以給圖像等其他對(duì)象建立“E-Mail

鏈接”了。

3.4

3.43.4

3.4文件下載鏈接

文件下載鏈接文件下載鏈接

文件下載鏈接

“文件下載鏈接”的原理很簡(jiǎn)單，只要鏈接文件屬于瀏覽無(wú)法識(shí)別的關(guān)型，便都會(huì)使用 IE瀏覽器直接進(jìn)行下載，并保存到本地計(jì)算機(jī)中。

瀏覽器無(wú)法識(shí)別的文件類(lèi)型有很多，這里就介紹一個(gè)最常用的，以zip或rar為后綴名 的壓縮格式文件，這種文件可以使用主流的壓縮軟件（如winzip、winrar）來(lái)制作。下

面我們就業(yè)以實(shí)例來(lái)說(shuō)明。在前面“插入多媒體”一章中，我們?cè)?jīng)講過(guò)直接鏈接文件的方式來(lái)插入“視頻”，即

直接在“鏈接”文本框中輸入“文件名+名后綴名”，如olympus.wmv。單日擊這個(gè)鏈接，經(jīng)過(guò)數(shù)據(jù)下載后，Windows系統(tǒng)將啟動(dòng)自帶的媒體播放器Windows Media Player 來(lái)播

放該視頻。

操作步驟

步驟1 先將視頻文件olympus.wmv通壓縮成olympus.rar文件，放入站點(diǎn)的media文件

夾下。

步驟2 將文件路徑輸入至“鏈接”文本框中。

步驟3 保存網(wǎng)頁(yè)，按下F12預(yù)覽，在瀏覽器中單擊“下載精彩廣告視頻”鏈接文本，會(huì)

彈出“文本下載”選擇框，單擊其中的“保存”按鈕。

步驟4 在“另存為”對(duì)框中選擇保存到本地計(jì)算機(jī)中的位置，實(shí)例中為“經(jīng)典回顧”文

件夾。之后單擊“保存”按鈕，壓縮文件即保存到該位置中。至此，“文件下載鏈接”

便制作完成了。讀者可以打開(kāi)“我的文檔”文件夾，解壓縮olympus.rar文件，隨時(shí)欣

賞下載影片。

本設(shè)計(jì)中未用到此鏈接，在此只作簡(jiǎn)單介紹。

3.5

3.53.5

3.5在在在

在HTML

HTMLHTML

HTML語(yǔ)言中建立網(wǎng)頁(yè)鏈接

語(yǔ)言中建立網(wǎng)頁(yè)鏈接語(yǔ)言中建立網(wǎng)頁(yè)鏈接

語(yǔ)言中建立網(wǎng)頁(yè)鏈接

3.5.1

3.5.13.5.1

3.5.1文字鏈接

文字鏈接文字鏈接

文字鏈接

在HTML語(yǔ)言中用超鏈接標(biāo)記指向一個(gè)目標(biāo)。其基本格式為： 舉個(gè)簡(jiǎn)單的“文本鏈接”的實(shí)例，該實(shí)例相對(duì)應(yīng)的HTML代碼如下所示。

a href-“index2.html”target=”-blank”>平面設(shè)計(jì)（新開(kāi)窗口，-blank)< /p>

動(dòng)畫(huà)制作（原窗口，默認(rèn)為空）

網(wǎng)文精品

第五篇：畢業(yè)設(shè)計(jì)(論文)個(gè)人網(wǎng)站的設(shè)計(jì)與實(shí)現(xiàn)

題目：個(gè)人網(wǎng)站實(shí)現(xiàn)技術(shù)

個(gè)人網(wǎng)站實(shí)現(xiàn)技術(shù)

個(gè)人網(wǎng)站的設(shè)計(jì)與實(shí)現(xiàn)

前 言

隨著國(guó)際互聯(lián)網(wǎng)的普及，很多人已經(jīng)不滿足僅僅在Internet上的瀏覽信息，而是希望更深入的參與其中，擁有自己的Web網(wǎng)站，這似乎已經(jīng)成為一種潮流。如果說(shuō)個(gè)人建立網(wǎng)站是為了追求時(shí)尚，那么企業(yè)建立網(wǎng)站就是必然的選擇了。

無(wú)論是專(zhuān)業(yè)的，還是業(yè)余的，很多人對(duì)網(wǎng)頁(yè)制作頗感興趣。事實(shí)上制作一個(gè)簡(jiǎn)單的網(wǎng)頁(yè)并不困難，會(huì)使用Word的人都可以勝任。但想做出超凡脫俗的網(wǎng)頁(yè)就不那么容易了，而Dreamweaver卻可以滿足你的愿望，它是Macromedia公司開(kāi)發(fā)的集網(wǎng)頁(yè)制作和網(wǎng)站管理于一身的所見(jiàn)即所得的網(wǎng)頁(yè)編輯器。

同樣出自Macromedia公司的Flash,Fireworks在制作網(wǎng)站的過(guò)程中起到了錦上添花的作用，是個(gè)人網(wǎng)站實(shí)現(xiàn)的好幫手，在制作網(wǎng)站的時(shí)候經(jīng)常會(huì)用到這些軟件。

本文有五章，我來(lái)由淺到深介紹個(gè)人網(wǎng)站的設(shè)計(jì)與實(shí)現(xiàn)。

摘 要

在互聯(lián)網(wǎng)走進(jìn)我們的生活之前，沒(méi)有人敢夢(mèng)想擁有自己的報(bào)紙、雜志、電臺(tái)、電視臺(tái)。除了政策上的制約外，一個(gè)人也根本沒(méi)有操作一份傳播媒體的能力?，F(xiàn)在不同了，互聯(lián)網(wǎng)給我們提供了一個(gè)“表達(dá)自我”的自由天地,你可以擁有自己的新聞郵件，你可以建立自己的個(gè)人網(wǎng)站。只要你辦得成功也可以吸引成千上萬(wàn)的訂戶、讀者,并建立自己在眾多參與者中的權(quán)威地位。建立個(gè)人網(wǎng)站的基本過(guò)程可以分為以下七個(gè)環(huán)節(jié) : 1 了解中國(guó)網(wǎng)絡(luò)個(gè)人主頁(yè)研究背景與發(fā)展現(xiàn)狀 2 系統(tǒng)需求分析與總體設(shè)計(jì) 3 熟悉網(wǎng)站開(kāi)發(fā)模式、工具及環(huán)境 把自己的作品和想要展示的內(nèi)容制作成網(wǎng)頁(yè)。5 使用動(dòng)態(tài)網(wǎng)頁(yè)技術(shù)(ASP)，實(shí)現(xiàn)動(dòng)態(tài)內(nèi)容更新。6 認(rèn)真地選取測(cè)試用例，進(jìn)行交叉測(cè)試 7 網(wǎng)站的后期完善、宣傳及發(fā)展方向

其中 ,網(wǎng)頁(yè)制作和使用動(dòng)態(tài)網(wǎng)頁(yè)技術(shù)(ASP)實(shí)現(xiàn)動(dòng)態(tài)內(nèi)容更新是網(wǎng)站開(kāi)發(fā)的核心內(nèi)容。

關(guān)鍵詞：網(wǎng)頁(yè)、制作、訪問(wèn)、鏈接 Abstract Enters before our life in the Internet, nobody dares to vainly hope for has own newspaper, the magazine, the broadcasting station, the television station.Besides the policy in restriction, a person simply has not also operated dissemination media the ability.Now has been different, Internet has provided to us “the expression” free world,You may have own news mail, you may establish own individual website.So long as you also manage the success to be possible to attract the tens of thousands of subscribers, the reader,And establishes oneself in the multitudinous participant's authoritative status.Establishes individual website the unit process to be possible to divide into following seven links: 1、understands the Chinese network individual main page research background and the development present situation 2 systems demands analysis and system design 3 familiar websites developments pattern, tool and environment 4 and wants own work the content which demonstrated to manufacture the homepage.5 uses dynamic homepages technology(ASP), realization dynamic content renewal.6 earnestly selects measured the test example, carries on the overlapping test 7 websites later periods consummate, the propaganda and the development direction Among them,The homepage manufacture and the use dynamic homepage technology(ASP)realizes the dynamic content renewal is the website development core content.Key word: Homepage, manufacture, visit, link

目 錄 第一章 引言 1.1 什么是Internet 1.2 Internet有哪些功能 1.3 www簡(jiǎn)介

1.4 網(wǎng)頁(yè)基本構(gòu)成元素 1.5 軟件的安裝與啟動(dòng) 1.5.1 軟件的安裝 1.5.2 軟件的啟動(dòng) 1.5.3 創(chuàng)建快捷方式 1.6 制作網(wǎng)頁(yè)前的準(zhǔn)備 1.7 Dreamweaver的操作環(huán)境 1.7.1標(biāo)題欄 1.7.2菜單欄 1.7.3快捷工具欄 1.7.4屬性面板 第二章 網(wǎng)站制作實(shí)戰(zhàn) 2.1 站點(diǎn) 2.1.1創(chuàng)建站點(diǎn) 2.1.2 創(chuàng)建站點(diǎn)內(nèi)容 2.2 首頁(yè)

2.2.1 設(shè)置首頁(yè)布局 2.2.2 設(shè)置首頁(yè)的頁(yè)面屬性 2.2.3 查看和編輯頭內(nèi)容 2.2.4 插入圖像 2.2.5 插入多媒體 2.2.6 插入文本 2.3 創(chuàng)建其它網(wǎng)頁(yè) 第三章 建立網(wǎng)頁(yè)鏈接 3.1 文字鏈接 3.2 圖像鏈接 3.3 E-Mail鏈接 3.4 文件下載鏈接

3.5 在HTML語(yǔ)言中建立網(wǎng)頁(yè)鏈接 3.5.1 文字鏈接 3.5.2 圖像鏈接 3.5.3 E-Mail鏈接 3.6.4 文件下載鏈接 第四章 結(jié)論 致 謝 參考文獻(xiàn)

第一章 預(yù)備知識(shí)

1.1 什么是Internet Internet的中文名為“國(guó)際互聯(lián)網(wǎng)”，又稱“因特網(wǎng)”。

Internet是由眾多的計(jì)算機(jī)網(wǎng)絡(luò)互聯(lián)而成的互聯(lián)網(wǎng)，它覆蓋了全世界各地，它是采用開(kāi)放系統(tǒng)協(xié)議的計(jì)算機(jī)通訊網(wǎng)絡(luò)。然而，Internet不僅僅是計(jì)算機(jī)的互聯(lián)網(wǎng)，它還是全球最大的信息資源寶庫(kù)，它提供了包括科研、教育、文化娛樂(lè)、商業(yè)和信息交流等各種各樣的服務(wù)，使得世界范圍內(nèi)的人與人之間的交流在時(shí)間和空間上變的更小了。

要了解Internet，就必須先了解局域網(wǎng)。我們可以將同一地點(diǎn)的許多計(jì)算機(jī)使用網(wǎng)線連接在一起，構(gòu)成一個(gè)高效率的計(jì)算機(jī)網(wǎng)絡(luò)，所有處于網(wǎng)絡(luò)內(nèi)的終端機(jī)或電腦都能享受網(wǎng)絡(luò)內(nèi)所有的資源，比如程序，圖文資料等。這種計(jì)算機(jī)網(wǎng)絡(luò)因?yàn)橐话愣季窒拊谝欢▍^(qū)域中，我們稱之為“局域網(wǎng)”（Local Area Network,簡(jiǎn)稱LAN）,它是在日常工作中用得最多的一種小型計(jì)算機(jī)網(wǎng)絡(luò)。局域網(wǎng)所覆蓋的地理范圍比較小，通常不超過(guò)幾十公里，甚至只在同一座建筑物內(nèi)或者鄰近的幾座建筑內(nèi)。像常見(jiàn)的校園網(wǎng)，一座寫(xiě)字樓內(nèi)部的網(wǎng)絡(luò)等都屬于局域網(wǎng)。

而Internet則不是指單個(gè)區(qū)域范圍內(nèi)的網(wǎng)絡(luò)，而是指將全世界的各中不同類(lèi)型的計(jì)算機(jī)網(wǎng)絡(luò)連接起來(lái)的一個(gè)全球性的網(wǎng)絡(luò)。Internet上有取之不盡，用之不竭的信息資源。對(duì)于Internet中各種各樣的信息，所有的人都可以通過(guò)網(wǎng)絡(luò)的連接來(lái)共享和使用。

1.2 Internet有那些功能

Web頁(yè)瀏覽：這是目前利用最廣泛、最直接的互聯(lián)網(wǎng)服務(wù)，通過(guò)瀏覽WWW（萬(wàn)維網(wǎng)）中的網(wǎng)頁(yè)，可以了解世界各地的新聞，查看最新的股市行情，最新的娛樂(lè)動(dòng)態(tài)、科技發(fā)明，找到眾多的就業(yè)信息??幾乎想找到什么樣的信息，就有什么信息。正是有了WWW、Internet才會(huì)變得如此豐富多彩，才能走進(jìn)千家萬(wàn)戶。信息發(fā)布：通過(guò)Internet，不僅可以瀏覽別人發(fā)布在Web頁(yè)上的信息，也可以將自己要發(fā)布的信息制作成Web頁(yè)，也即網(wǎng)頁(yè)，然后發(fā)布到Internet上，供全世界的人瀏覽。

電子郵件：不同于傳統(tǒng)郵件，電子郵件(E-mail)通過(guò)Internet傳輸，寫(xiě)信，發(fā)信，收信都在計(jì)算機(jī)上完成，一封電子郵件最短在一秒之內(nèi)就可以發(fā)送出去，其效率是傳統(tǒng)郵件無(wú)法比擬的。而且發(fā)送與接收電子郵件幾乎是免費(fèi)的，所以比傳統(tǒng)郵件既節(jié)省時(shí)間又經(jīng)濟(jì)的多。

網(wǎng)上聊天：通過(guò)聊天軟件（如QQ、ICQ等）或不同網(wǎng)站的聊天室，可以和世界各地的網(wǎng)友聊天。網(wǎng)友可能是遠(yuǎn)在天邊的異國(guó)朋友，也可能是與你一起工作的餓同事，或者是一起生活的家人，在這里沒(méi)有年齡、性別、身份、職業(yè)、國(guó)籍、膚色的限制，完全突破了交友的傳統(tǒng)方式，人們可通過(guò)Internet互相了解對(duì)方，進(jìn)行各種各樣的交流。

電子商務(wù)：現(xiàn)在網(wǎng)上交易已經(jīng)成為現(xiàn)實(shí)，網(wǎng)上購(gòu)物、網(wǎng)上商品銷(xiāo)售、網(wǎng)上拍賣(mài)、企業(yè)級(jí)電子商務(wù)、網(wǎng)上貨幣支付等電子商務(wù)活動(dòng)已經(jīng)搞的有聲有色，幾乎所有的專(zhuān)家都預(yù)測(cè)，在未來(lái)的幾年內(nèi)，電子商務(wù)會(huì)飛速發(fā)展。在不久的將來(lái)，您可以做在電腦前進(jìn)行各種各樣的商務(wù)活動(dòng)。

網(wǎng)絡(luò)游戲：通過(guò)Internet，可以與全世界的玩家一起進(jìn)行游戲?qū)?zhàn)，也可以協(xié)同作戰(zhàn)。網(wǎng)絡(luò)游戲已經(jīng)成為信息產(chǎn)業(yè)全新的經(jīng)濟(jì)增長(zhǎng)點(diǎn)，每年都為開(kāi)發(fā)商帶來(lái)巨額的利潤(rùn)。通過(guò)網(wǎng)絡(luò)游戲，可以充分享受Internet給我們帶來(lái)的樂(lè)趣。

網(wǎng)絡(luò)電話：網(wǎng)絡(luò)電話也稱IP電話。它采用Internet技術(shù)，利用專(zhuān)門(mén)的網(wǎng)絡(luò)電話軟件，只需支付非常低廉的話費(fèi)就可通話。Internet在電信市場(chǎng)上的應(yīng)用將越來(lái)越廣泛。

1.3 WWW的簡(jiǎn)介

WWW的全稱為World Wide Web，含義是“環(huán)球網(wǎng)”，又稱“萬(wàn)維網(wǎng)”、3W、Web。WWW是一個(gè)基于超文本（Hypertext）方式的信息檢索服務(wù)工具。我們上網(wǎng)瀏覽到的網(wǎng)頁(yè)就是這樣的超文本，也就是HTML(Hypertext Mark-up Language,超文本標(biāo)記語(yǔ)言)文件，這些網(wǎng)頁(yè)文件被放置到WWW服務(wù)器上，并且都有一定的地址。當(dāng)我們想瀏覽某個(gè)網(wǎng)站時(shí)，首先要在電腦上安裝瀏覽器，如Internet Explorer或Netscape，然后在瀏覽器中輸入網(wǎng)站的地址（網(wǎng)址），就可以進(jìn)入網(wǎng)站進(jìn)行瀏覽。在這些網(wǎng)頁(yè)中，都有超連接，當(dāng)將鼠標(biāo)指針移動(dòng)到某個(gè)地方（如文本或圖象）時(shí)，鼠標(biāo)指針就會(huì)變成一個(gè)小手形形狀，單擊它就可以連接到另個(gè)網(wǎng)頁(yè)中，從而使得瀏覽者能在不同的信息之間跳轉(zhuǎn)，我們之所以能在Internet的海洋中穿梭自如，正是超連接的功勞。

WWW 為我們帶來(lái)的是世界范圍的超級(jí)文本服務(wù)：只須操縱鼠標(biāo)，就可以通過(guò)Internet從世界各地調(diào)來(lái)你所希望的文本、圖像、動(dòng)畫(huà)和聲音等信息。通過(guò)使用WWW，一個(gè)不熟悉網(wǎng)絡(luò)使用的人也可以成為Internet的行家。

1.4網(wǎng)頁(yè)基本構(gòu)成元素

要學(xué)會(huì)制作網(wǎng)頁(yè)，首先需要了解網(wǎng)頁(yè)都是由什么元素構(gòu)成的。

文字：文本是構(gòu)成網(wǎng)頁(yè)的基本元素。一個(gè)最簡(jiǎn)單的網(wǎng)頁(yè)可以只有幾行文本。

圖片：正是有個(gè)各種美麗的圖片，網(wǎng)頁(yè)才變得多姿多彩。

動(dòng)畫(huà)：如今，網(wǎng)頁(yè)上的動(dòng)畫(huà)越來(lái)越多，最常用的有GIF動(dòng)畫(huà)、Flash動(dòng)畫(huà)等。

超連接：如上所述，超連接幾乎是必不可少的。一個(gè)沒(méi)有超連接的網(wǎng)頁(yè)，就如同汪洋大海中的一座孤島，失去了與外界的一切聯(lián)系。

其它元素：還可以在網(wǎng)頁(yè)中添加聲音、視頻等元素。

1.5軟件的安裝與啟動(dòng) 要使用網(wǎng)站設(shè)計(jì)軟件，自然先要將這些軟件安裝到自己的電腦中。安裝完畢，還需要如何啟動(dòng)，如何創(chuàng)建快捷方式。下面就讓我們來(lái)詳細(xì)地看一看具體的操作步驟。

1.5.1軟件的安裝

安裝之前，需要先了解軟件對(duì)系統(tǒng)的要求。以Windows為例，系統(tǒng)要求如下： Intel Pentium II處理器或等效處理器，主頻300MHz或更高。

Windows 98Windows 2000Windows NT(具有Service Pack 3 或更高版本)、Windows Me或Windows XP.Netscape Navigator 4.0版或更高版本或Microsoft Internet Explorer.96MB的可用內(nèi)存（RAM），建議采用128MB內(nèi)存。

分辨率可達(dá) 800×600像素的256色顯示器（建議顏色為百萬(wàn)顏色，分辨率達(dá)到1024×768像素）。CD-ROM 驅(qū)動(dòng)器。

檢查一下您的計(jì)算機(jī)，看是否具備了以上條件。如果具備，將“Macromedia Studio MX”程序會(huì)自動(dòng)運(yùn)行。如果不能自動(dòng)運(yùn)行，可以找到光盤(pán)放入光驅(qū)，安裝程序會(huì)自動(dòng)運(yùn)行?？梢哉业焦獗P(pán)中的“Install Macromedia Studio MX”程序或“Autorun”程序并雙擊運(yùn)行。

Dreamweaver的安裝比較容易，幾乎可以自動(dòng)完成。下面簡(jiǎn)要說(shuō)明一下安裝步驟。

操作步驟：

1、將安裝光盤(pán)放入光驅(qū)，安裝程序自動(dòng)運(yùn)行，并出現(xiàn)安裝界面。如果單擊安裝界面上的“Macromedia STUDIO MX安裝”，那么將會(huì)安裝其下方所列出的軟件。所有的安裝會(huì)自動(dòng)完成。

2、單擊Dreamweaver MX,開(kāi)始安裝過(guò)裝過(guò)程.先是出現(xiàn)解壓縮文件窗口,等待一會(huì)兒,便會(huì)出現(xiàn)安裝向?qū)?duì)話框。單擊“下一步”按鈕，繼續(xù)安裝過(guò)程。

3、出現(xiàn)“選擇目的地位置”對(duì)話框，默認(rèn)的盤(pán)是C盤(pán)，如果想安裝到不同的位置，可以單擊目的文件夾右邊的“瀏覽”按鈕，并在彈出的“選擇文件夾”對(duì)話框選擇不同的文件，如要安裝在D盤(pán)則可直接將路徑中的“C：”改為“D:”。也可以在下面的“目錄”中選擇其它的文件夾，設(shè)置完后，單擊“確定”，回到“選擇目的地址”對(duì)話框，單擊“下一步”繼續(xù)。

4、而后會(huì)出現(xiàn)“默認(rèn)編輯器”的對(duì)話框，默認(rèn)為全選。如果希望讓Dreamweaver MX成為下面所列文件類(lèi)型的默認(rèn)編輯器，那么可以在這里做選擇。選擇完畢，單擊“下一步”按鈕。

5、出現(xiàn)“開(kāi)始復(fù)制文件”對(duì)話框，單擊“下一步”安裝程序開(kāi)始復(fù)制文件，過(guò)幾分鐘后，安裝結(jié)束，單擊“結(jié)束”按鈕，結(jié)束安裝。

1.5.2 軟件啟動(dòng)

軟件安裝完畢后，我們就可以使用它了。安裝程序已經(jīng)自動(dòng)在“開(kāi)始”菜單中加入了快捷方式。

單擊“開(kāi)始”菜單，將鼠標(biāo)指針依次指向“程序”|“Macromedia”|“Macromedia MX”,并在上面單擊鼠標(biāo)左鍵。

1.5.3 創(chuàng)建快捷方式 使用“開(kāi)始”菜單啟動(dòng)程序的過(guò)程比較煩瑣?？梢栽赪indows桌面或快速啟動(dòng)欄上創(chuàng)建快捷方式，這樣可以快速的啟動(dòng)程序。

具體實(shí)現(xiàn)方法是：在“開(kāi)始”菜單中找到相應(yīng)程序的快捷方式，不過(guò)這是不要用鼠標(biāo)左鍵單擊，而是用右鍵按住向桌面拖動(dòng)，然后松開(kāi)右鍵，會(huì)出現(xiàn)一個(gè)快捷菜單，在其中可以選擇不同的命令，比如選擇“在當(dāng)前位置創(chuàng)建快捷方式”或“復(fù)制到當(dāng)前位置”。

這樣以后在運(yùn)行程序時(shí)，就方便快捷的多了。

1.6 制作網(wǎng)頁(yè)前的準(zhǔn)備

電腦必備：

電腦速度夠快，最好能夠上網(wǎng)。操作系統(tǒng)：Windows 98/NT/Me/2000/XP.軟件可選：

其它軟件：看圖軟件ACDSee、圖像處理軟件Photoshop、上傳工具CuteFTP、Fireworks、動(dòng)畫(huà)軟件Flash等。

1.7 Dreamweaver MX的操作環(huán)境

我們將工作界面分成了“標(biāo)題欄”、“菜單欄”、“快捷工具欄”、“屬性面板”、“浮動(dòng)控制面板”5個(gè)部分來(lái)分別介紹。

1.7.1 標(biāo)題欄 Dreamweaver MX的“標(biāo)題欄”中將顯示文字“Macromedia Dreamweaver MX”如果打開(kāi)網(wǎng)頁(yè)的話，在后面還會(huì)顯示該網(wǎng)頁(yè)的一些信息，如網(wǎng)頁(yè)標(biāo)題、所在位置及網(wǎng)頁(yè)名稱，右邊有三個(gè)鈕，分別對(duì)應(yīng)Dreamweaver MX的最大化最小化和關(guān)閉的操作。

1.7.2 菜單欄

“標(biāo)題欄”下面就是“菜單欄”，欄中提供了“文件”、“編輯”、“查看”、“插入”、“修改”、“文本”、“站點(diǎn)”、“窗口”、“幫助”10項(xiàng)菜單。單擊其中任意一項(xiàng)菜單，隨即就會(huì)出現(xiàn)一個(gè)下拉式指令菜單。有些指令的右邊會(huì)有鍵盤(pán)的代碼，這是該指令的快捷鍵，熟練使用快捷鍵將會(huì)有助于提高工作效率。有些指令的右邊會(huì)有一個(gè)小黑三角的標(biāo)記，它代表該指令還包含下一級(jí)的指令，鼠標(biāo)停留片刻即可顯示。

1.7.3 快捷工具欄

“快捷工具欄”指的是“菜單欄”下邊的3排按鈕，選擇菜單“查看/工具欄”，勾選里面的“插入”、“文檔”和“標(biāo)準(zhǔn)”3項(xiàng)，完整的快捷工具欄就顯現(xiàn)出來(lái)了。

1.7.4 屬性面板

在網(wǎng)頁(yè)編輯窗口的下面還有一個(gè)面板，它是有名的“屬性面板”，它在這個(gè)軟件中起到舉足輕重的作用。

屬性面板顧名思義，就是顯示，調(diào)整屬性的面板，根據(jù)鼠標(biāo)所選中對(duì)象的不同，“屬性面板”在界面上也會(huì)有所差異，用戶可以分別對(duì)不同的對(duì)象進(jìn)行調(diào)整。

第二章 網(wǎng)站制作實(shí)戰(zhàn)

2.1 站點(diǎn)

2.1.1 創(chuàng)建站點(diǎn)

要制作一個(gè)網(wǎng)站，第一步操作都是一樣的，就是要?jiǎng)?chuàng)造一個(gè)“站點(diǎn)”，這樣可以使整個(gè)網(wǎng)站的脈絡(luò)結(jié)構(gòu)清晰地展現(xiàn)在面前，避免了以后再進(jìn)行紛雜的管理。

從菜單中選擇“站點(diǎn)/管理站點(diǎn)”在彈出的對(duì)話框中選擇“新建”，之后再選擇其中的“站點(diǎn)”，再次彈出一個(gè)對(duì)話框，在文本框中輸入自己已經(jīng)企化好的網(wǎng)站名稱“追夢(mèng)人”。

填好后，單擊“下一步”，進(jìn)入下一個(gè)步驟。由于我要做的是一個(gè)靜態(tài)的網(wǎng)頁(yè)，所以選擇上面的一項(xiàng)“否，我不想使用服務(wù)器技術(shù)?！?單擊“下一步”，進(jìn)入下一個(gè)步驟。

在此選項(xiàng)中有兩個(gè)選擇，選擇推薦的“編輯我的計(jì)算機(jī)上的本地副本，完成后再上傳到服務(wù)器”。底下的文本框允許在本地磁盤(pán)上指定一個(gè)文件夾，Dreamweaver將在其中儲(chǔ)存站點(diǎn)文件的本地副本。單擊該文本框后面的文件夾圖標(biāo)，新建并指定一個(gè)空的文件夾“E:/ding”。之后單擊“下一步“，進(jìn)入下一個(gè)步驟。

這一步是如何設(shè)置連接到遠(yuǎn)程服務(wù)器，彈出式菜單中有6中選擇，這里選擇“無(wú)”。而后“下一步”再“完成”，即可。

2.1.2 創(chuàng)建站點(diǎn)內(nèi)容

站點(diǎn)創(chuàng)建完成后，就可以創(chuàng)建Web頁(yè)來(lái)填充站點(diǎn)了。在“右側(cè)浮動(dòng)面板組”中選擇“文件/文件”面板，此時(shí)整個(gè)網(wǎng)站中沒(méi)有任何內(nèi)容。用鼠標(biāo)右擊面板中的本地根目錄文件夾。在彈出的菜單中選擇“新建文件”，新建一個(gè)文件后將其命名為“index.htm(或index.html),它就是未來(lái)的首頁(yè)。

由于“追夢(mèng)人”網(wǎng)站分為“平面設(shè)計(jì)”、“動(dòng)畫(huà)制作”、“網(wǎng)文精品”、“經(jīng)典回顧”、“個(gè)人說(shuō)明“這五個(gè)大欄目，所以繼續(xù)用鼠標(biāo)右擊右側(cè)，在彈出的菜單中選擇第二項(xiàng)“New Folder（新建文件夾）”。執(zhí)行五次操作，新建五個(gè)文件夾，并把它們重命名為graph、anim、books、music、letter，分別對(duì)應(yīng)上面的五個(gè)大欄目。存放它們各自的內(nèi)容。之后再次新建1個(gè)文件夾，命名為images,用來(lái)存放“所有的圖象文件”的內(nèi)容。

之后在個(gè)欄目的文件夾里還要建立想相應(yīng)的欄目網(wǎng)頁(yè)。

2.2 首頁(yè)

2.2.1 設(shè)置首頁(yè)布局

每個(gè)網(wǎng)站都會(huì)有一個(gè)首頁(yè)，就功能上而言，它代表著一個(gè)網(wǎng)站的風(fēng)格與特色，就網(wǎng)站架構(gòu)上而言，它代表了網(wǎng)站的第一層架構(gòu)，至于網(wǎng)站上其他Web頁(yè)，原則上都必須通過(guò)首頁(yè)來(lái)連接散播出去，可見(jiàn)首頁(yè)是多么的重要。

首頁(yè)是打開(kāi)網(wǎng)站后在瀏覽器中顯示的第一個(gè)頁(yè)面。它是起什么名字通常要視Server端的設(shè)置，一般的有index.htm,default.htm或home.htm等，目前主要以index.htm的居多。當(dāng)然，后綴名為html也是正確的。

具體設(shè)置方法是：右健單擊“文件”浮動(dòng)面板中的index.htm,在彈出的菜單中選擇“設(shè)成首頁(yè)”。

首頁(yè)的布局有很多方法，在這里我所用到的是表格的“布局模式”?！安季帧蹦Ｊ街械谋砀穹Q為布局表格，單元格稱為布局單元格。在繪制布局表格和布局單元格時(shí)，必須從“標(biāo)準(zhǔn)”模式切換到“布局”模式。直接單擊“布局”按鈕即可。操作步驟：

1、在“插入快捷欄”的“布局”分類(lèi)中，單擊“布局表格”按紐。

2、將變成“+”形狀的鼠標(biāo)光標(biāo)放到編輯中網(wǎng)頁(yè)上，在要繪制的地方進(jìn)行拖動(dòng)就可以進(jìn)行創(chuàng)建了。（如果繪制的是第一個(gè)表格必須從網(wǎng)頁(yè)的最左上角開(kāi)始繪制）。

3、在這里要繪制多個(gè)表格，可以再次單擊“布局表格”按紐進(jìn)行繪制，也可以按住Ctrl鍵繪制多個(gè)表格。追夢(mèng)人”網(wǎng)站首頁(yè)的布局如圖所示：

2.2.2設(shè)置首頁(yè)的頁(yè)面屬性

首先雙擊“文件”浮動(dòng)面板中的index.htm,進(jìn)入頁(yè)面的編輯窗口。右健單擊空白區(qū)域，在菜單中選擇“頁(yè)面屬性”，之后彈出“頁(yè)面屬性”對(duì)話框，若選擇主菜單“修改/頁(yè)面屬性”項(xiàng)，也可以把打開(kāi)該對(duì)話框。

在“頁(yè)面屬性”對(duì)話框中，左側(cè)窗口顯示“分類(lèi)”，其中包括了“外觀”、“鏈接”、“標(biāo)題”、“標(biāo)題/編碼”、“跟蹤圖像”5項(xiàng)，右側(cè)區(qū)域則顯示各類(lèi)中可以設(shè)置的項(xiàng)目?！白穳?mèng)人”首頁(yè)設(shè)置的屬性如下圖所示：

2.2.3查看和編輯頭內(nèi)容

一個(gè)網(wǎng)頁(yè)文件結(jié)構(gòu)上實(shí)際是由兩部分組成，頭（head）內(nèi)容和主體（body）內(nèi)容主體內(nèi)容（body）是文檔的主要部分，也是包含文本和圖像等的可見(jiàn)部分。頭內(nèi)容（head）是除文檔標(biāo)題外的不可見(jiàn)部分，包含有文檔類(lèi)型、語(yǔ)言編碼、搜索引擎的關(guān)鍵的關(guān)鍵字和內(nèi)容指示器以及樣式定義等重要信息，這些元器并不是每個(gè)頁(yè)面都需要的，例如，可以僅為主頁(yè)提供關(guān)鍵字。

下面就以首頁(yè)為例，說(shuō)明怎樣插入較常用的頭（head）內(nèi)容。

單擊“菜單攔”下面“插入快捷”的下拉列表，選擇其中的HTML類(lèi)，此時(shí)右側(cè)將會(huì)顯示該類(lèi)中可以插入的對(duì)象快捷按鈕，再次單擊第2個(gè)按鈕“文件頭”旁邊的下拉箭頭，會(huì)彈出菜單，該項(xiàng)列出的便是即將插入的頭內(nèi)容。

2.2.4 插入圖像

圖像是網(wǎng)頁(yè)中不可或缺的組成成份，恰當(dāng)?shù)厥褂脠D像，可以使網(wǎng)站充滿生活生命力與說(shuō)服力，吸引更多的瀏覽者，加深他們欣賞你網(wǎng)站的意愿。

另一方面，網(wǎng)頁(yè)的容量大小是網(wǎng)站成功與否的一大關(guān)鍵因素。由于網(wǎng)絡(luò)在傳輸上的限制，導(dǎo)致了下載的速度不可能太快，因此，網(wǎng)頁(yè)的大小就不能太大，其中關(guān)鍵就在于圖像的大小了，否則瀏覽者會(huì)失去等待的耐心，無(wú)論你的網(wǎng)站多么精彩也無(wú)濟(jì)于事了。所以，在網(wǎng)面容量大小的問(wèn)題上一定要重視。下面就來(lái)詳細(xì)介紹對(duì)網(wǎng)頁(yè)圖像進(jìn)行處理的操作步驟，以使得它們?cè)诒３謭D形美麗與網(wǎng)站風(fēng)格搭配的基礎(chǔ)上，圖片文件能夠變的更小。

1、首先將光標(biāo)停留在要插入圖像的位置，然后單擊“菜單欄”下面“插入快健欄”的下拉表，選擇其中的“常用”類(lèi)，則右側(cè)將會(huì)顯示該類(lèi)中可以插入的對(duì)象快鍵按鈕。左起第5個(gè)即為“圖像：圖像”按鈕，單擊它右側(cè)的下拉列表，選擇第1項(xiàng)“圖像”。

2、隨即彈出“選擇圖像源文件”對(duì)話框。從計(jì)算機(jī)磁盤(pán)中選擇想要插入的圖像文件，或在URL編輯框中輸入圖像的路徑和名稱。下面的“相對(duì)于”下拉表框中，可選擇文件URL地址的類(lèi)型，如果選擇“文檔”選項(xiàng)，表示圖像地址相對(duì)于當(dāng)前文檔；如果選擇“站點(diǎn)根目錄”選項(xiàng)，表示地址相對(duì)于根目錄。在這里我要插入的是網(wǎng)站標(biāo)志logo，插入logo圖象，如圖所示：

最后單擊“確定”按鈕，即可完成插入圖像的操作。2.2.5插入多媒體

在Dreamweaver MX2004中，除了之前講到的可以插入“圖像”外，還可插入動(dòng)畫(huà)、聲音、視頻等媒體元素，如Flash,Shockwave,Applets,ActieX及格Midi聲音文件等，并且還可以在Dreamweaver自身內(nèi)插入Macromedia Flash MX2004按鈕和文本對(duì)象，以及進(jìn)行相關(guān)的后期處理和添加設(shè)計(jì)備注等操作。

在Dreamweaver MX 2004文檔中，可以插入媒體文件包括Flash Shockwave影片、QuickTime、AVI java、applet Active X控件以及各種格式的音頻文件。要在瀏覽器中播放放Flash 動(dòng)畫(huà)，必須在瀏覽器中集成“Flash 播放器（Flash Player）”。其中，Internet Explorer通過(guò)ActiveX控制來(lái)實(shí)現(xiàn)，Netscape Navigator則是通過(guò)相應(yīng)的插件來(lái)實(shí)現(xiàn)的。在最新的Netscape Navigator和Internet Explorer瀏覽器中，均已集成了 Flash動(dòng)畫(huà)播放功能。操場(chǎng)作步驟：

步驟1 將光標(biāo)停留在要插入Flash的位置，然后單擊菜單欄下面“插入快捷欄”的下拉列表，選擇其中的“常用”分類(lèi)，右側(cè)將會(huì)顯示該類(lèi)中可以插入的對(duì)象快捷按鈕。左起第6個(gè)即為“媒體”按鈕，單擊它右側(cè)的下拉列表，選擇第1項(xiàng)Flash圖標(biāo)。

步驟2 在彈出的對(duì)話框中選擇擴(kuò)展名為swf 的Flash文件，即可將其插入到Dreamwe aver的“網(wǎng)頁(yè)編輯窗口”中，可以看到，在這個(gè)窗口中Flash文件的大小。在這里我的主頁(yè)插入的一個(gè)動(dòng)畫(huà)，如圖所示：

2.2.6插入文本 文字是人類(lèi)語(yǔ)言最基本的表達(dá)方式，在網(wǎng)頁(yè)中，文本內(nèi)容也可以說(shuō)是重要的組成部分，一個(gè)網(wǎng)站成功與否，它是最關(guān)鍵的因素。在這最關(guān)鍵的因素?？韶S富網(wǎng)站的文字內(nèi)容，并以最最美觀、最整齊的方式放入到網(wǎng)頁(yè)中。插入文本的兩種方式

網(wǎng)頁(yè)中需要大量的文本，我們或以通過(guò)以下兩種方式插入它們。

一種是在網(wǎng)頁(yè)編輯窗口中直接用鍵盤(pán)敲入文本。這可以算是最基本的輸入方式了，和一些文本編輯軟件（如Microsoft Word）的使用方法一樣，選擇好習(xí)慣的輸入法，就可以運(yùn)指如飛了。

另一種是復(fù)制文本的方式。有些讀者可能不喜歡使用Dreamweaver MX2004來(lái)進(jìn)行打字的工作，而更習(xí)慣在專(zhuān)門(mén)的文本編輯軟件中快速打字，如Microsoft Word和 Windows自帶的記事本等，又或者讀者已經(jīng)準(zhǔn)備好了要放入網(wǎng)頁(yè)的文本的電子版本，那么我們就可以直接使用Dreamweaver的文本復(fù)制功能，將大段的文本內(nèi)容拷貝到網(wǎng)頁(yè)的編輯窗口來(lái)進(jìn)行排版的工作，具體步驟如下。

打開(kāi)文本編輯軟件（如Microsoft Word），選中要復(fù)制的文本，它們將反白顯示，執(zhí)行菜單“編輯/復(fù)制”命令或直接用快捷鍵Ctrl+C，之后切換回Dreamweaver,將光標(biāo)停留在插入文本的位置，執(zhí)行主菜單“編輯/粘貼”命令或直接使用快捷鍵Ctrl+v,即可將大段的文本快速粘貼到網(wǎng)頁(yè)中。

這在我的“網(wǎng)文精品”中用到很多，全部是在word軟件中排好ctrl+c,然后點(diǎn)擊要粘貼的位置，crtl+v到Dreamweaver即可。

2.3創(chuàng)建其它網(wǎng)頁(yè)

還有其它的幾個(gè)網(wǎng)站與主頁(yè)的制作相同，一個(gè)網(wǎng)頁(yè)是圖象和文字的組合。“平面設(shè)計(jì)”中的圖象插入和前面的介紹相似，并可以在屬性攔中調(diào)節(jié)圖象的大小。在Dreamwerver中常常會(huì)用到Firework、Flash，它們是相輔相成，在主頁(yè)中的主體部分就是用Firework,如圖所示：

在“個(gè)人說(shuō)明”中也用到這點(diǎn)，首先定好需要尺寸，在屬性中設(shè)好背景，顏色等等，插入圖象，輸入文字，也word里的操作雷同。

第三章 建立網(wǎng)頁(yè)鏈接

網(wǎng)站實(shí)際上是由很多網(wǎng)頁(yè)組成的，那么網(wǎng)頁(yè)之間是如何聯(lián)系的呢？這就是本章要講的內(nèi)容----網(wǎng)頁(yè)的“鏈接”。

“鏈接”，又稱“超鏈接"（Hyperlink）,它作為網(wǎng)頁(yè)的橋梁，起著相當(dāng)重要的作用。網(wǎng)頁(yè)中的很多對(duì)象都可以加入“鏈接”屬性。在Dreamweaver MX2004中，如果以“鏈接”的媒介來(lái)劃分的話，則“鏈接”可以分為“文字鏈接”、“圖像鏈接”、“圖像地圖鏈接”、“內(nèi)部鏈接和外部鏈接”、“E-mail鏈接”、“命名錨記鏈接”、“文件下載鏈接”和“跳轉(zhuǎn)菜單”，共8種。其中部分內(nèi)容在之前的章節(jié)中可能接觸過(guò)，這里將對(duì)其進(jìn)行更深入的講解。

3.1文字鏈接

“文字鏈接”即以文字作為媒介的鏈接，它是網(wǎng)頁(yè)中最常被使用的鏈接方式，具有“文件小、制作簡(jiǎn)單和便于維護(hù)”的特點(diǎn)。

接下來(lái)結(jié)合我的個(gè)人網(wǎng)站為實(shí)例，來(lái)講解如何為文字建立“鏈接”。具體操作步驟如下所述。操作步驟

步驟1 準(zhǔn)備好已經(jīng)制作完成的首頁(yè)的各個(gè)欄目頁(yè)面（假設(shè)除了“鏈接”，其他內(nèi)容都已經(jīng)制作完成了），該網(wǎng)站包含6個(gè)欄目，這里的5個(gè)欄目----“平面設(shè)計(jì)”、“動(dòng)畫(huà)制作”和“網(wǎng)文精品”、“經(jīng)典回顧”、“個(gè)人說(shuō)明”為例來(lái)進(jìn)行講解。

步驟2 在Dreamweaver 中打開(kāi)首頁(yè)，之后反白選取作為“鏈接”的文字。實(shí)例中要做到單擊不同的欄目的網(wǎng)頁(yè)。因此為第1個(gè)欄目“平面設(shè)計(jì)”設(shè)置鏈接，首先要反白選中“平面設(shè)計(jì)”4個(gè)文字。

步驟3 觀察“屬性面板”，其中包括一個(gè)“鏈接”文本框。步驟4 接下來(lái)需要把鏈接的地址加入到文本框中，方法有3種。

這里我用到的是直接點(diǎn)擊文件夾圖標(biāo)，在文件夾中找到要鏈接的對(duì)象graph.htm。這樣就建立了超鏈接。不過(guò)有點(diǎn)很重要，由于大多數(shù)服務(wù)器都不支持中文文件名，而且對(duì)大小寫(xiě)敏感，因此采用英文文件名并統(tǒng)一大小寫(xiě)。如圖所示：

步驟5 在“鏈接”文本框下面還有一個(gè)“目標(biāo)”下拉列表，從中可以選擇鏈接網(wǎng)頁(yè)顯示的窗口方式，共有4種。如圖：

實(shí)例中沒(méi)有選擇任何選項(xiàng)，保持空白，表示在原窗口中打開(kāi)鏈接網(wǎng)頁(yè)。

步驟6 還可以設(shè)置一些“鏈接”的屬性，這是前面講過(guò)的內(nèi)容。單擊“屬性面板”中的“頁(yè)面屬性”，選擇其中的“鏈接”分類(lèi)，可以進(jìn)行的設(shè)置有“鏈接字體”、“大小”、“鏈接顏色”、“變換圖像鏈接”顏色、“已訪問(wèn)鏈接”顏色、“活動(dòng)鏈接”顏色及“下劃線樣式”。

步驟7 至此，第1個(gè)欄目的鏈接就制作完畢了，按下Ctrl+S保存網(wǎng)頁(yè)，再按下F12預(yù)覽，測(cè)試一下，當(dāng)鼠標(biāo)放在“平面設(shè)計(jì)”這4個(gè)文字上時(shí)將變成手形，并且瀏覽器窗口下面的狀態(tài)欄中會(huì)顯示鏈接到的網(wǎng)頁(yè)的地址，單擊文字，頁(yè)面會(huì)立即跳轉(zhuǎn)到第1個(gè)欄目中，這表示鏈接已經(jīng)制作成功了。

步驟8 同理，按照以上步驟，再為“動(dòng)畫(huà)制作”和“網(wǎng)文精品”“經(jīng)典回顧“等其它欄制作指向?qū)?yīng)欄目的鏈接。

步驟9 通常在欄目頁(yè)面中還需要有“返回首頁(yè)”的鏈接，單擊其后可以跳轉(zhuǎn)回首頁(yè)，因此在各個(gè)欄目中還要插入“網(wǎng)站首頁(yè)”的文字，并且制作指向首頁(yè)index.html的鏈接，制作方法不變。

至此，整個(gè)“文字鏈接”的實(shí)例就全就全部完成了。通過(guò)對(duì)這個(gè)實(shí)例的講解，讀者不僅應(yīng)該學(xué)會(huì)如何為文字制作鏈接，還應(yīng)用對(duì)“鏈接”有了更加深刻的理解，鏈接的目的何在？它到底能夠在網(wǎng)頁(yè)的網(wǎng)站中發(fā)揮什么樣的作用？怎樣才能更好地使用它？這些是網(wǎng)頁(yè)制作者更應(yīng)該思考的問(wèn)題。下面繼續(xù)介紹其他類(lèi)型的鏈接。

3.2圖像鏈接

“圖像”也是常被使用的鏈接媒體，它和“文字鏈接”非常相似。為圖像加入鏈接，首先應(yīng)該在網(wǎng)頁(yè)中插入“圖像”，有關(guān)插入“圖像”或“導(dǎo)航條”按鈕的內(nèi)容，接下來(lái)以我的網(wǎng)站“追夢(mèng)人“為例，講解如何建立“圖像鏈接”。操作步驟

步驟1 首先仍然要準(zhǔn)備好已經(jīng)制作完成的首頁(yè)和各個(gè)欄目的頁(yè)面（假設(shè)除了“鏈接”，其他內(nèi)容都已經(jīng)制作完成了），該網(wǎng)站包含6個(gè)欄目，下面我們就動(dòng)手為這6個(gè)欄目分別制作它們的鏈接。

步驟2 在Dreamweaver中打開(kāi)網(wǎng)站的首頁(yè)，之后選取要制作“鏈接”的圖像。實(shí)例中先為第3個(gè)欄目“動(dòng)畫(huà)制作”設(shè)置鏈接，因此選中包含“動(dòng)畫(huà)制作”4個(gè)字的圖像。步驟3 觀察“屬性面板”，在“鏈接”文本框中輸入鏈接的文字地址?？梢允褂弥爸v過(guò)的“指向文件”和“選擇文件”的方法。

步驟4 如果有需要，可以在“目標(biāo)”下拉列表中選擇“鏈接”網(wǎng)頁(yè)顯示的窗口方式，分別為-blank、-parent、-self或 top。實(shí)例中使用了默認(rèn)出的保留空白選項(xiàng)的方式。

步驟5 另外，讀者還可以為圖像增加“替代”文本。實(shí)例中為第1個(gè)欄目增加欄目名稱的“替代”文本。

步驟6 至此，第1個(gè)欄目的圖像鏈接就制作完畢了，按下Ctrl+S保存網(wǎng)頁(yè)，再按下F12預(yù)覽，測(cè)試一下，將鼠標(biāo)放在“動(dòng)畫(huà)制作”4個(gè)文字上時(shí)將變成手形，同時(shí)瀏覽器窗口下面的狀態(tài)欄中會(huì)顯示出鏈接到的網(wǎng)頁(yè)的地址，并且會(huì)顯示出“替代”文本“動(dòng)畫(huà)制作”，單擊文字，頁(yè)面會(huì)立即跳轉(zhuǎn)到第3個(gè)欄目中，這表示鏈接已經(jīng)制作成功了。步驟7 同理，按照以上步驟，再為其它幾幅圖像制作指向?qū)?yīng)欄目的鏈接。

步驟8 在欄目頁(yè)面中制作“返回首頁(yè)”的鏈接，使得單擊后可以跳轉(zhuǎn)回首頁(yè)，其制作方法不變。

至此，整個(gè)“圖像鏈像”的實(shí)例就全部完成了。

3.3E –Mail的鏈接

E-Mail鏈接，是指當(dāng)瀏覽者單擊該鏈接之后，不是打開(kāi)一個(gè)網(wǎng)頁(yè)文件，而是啟動(dòng)用戶的E-Mail客戶端軟件（如Outlook Express）,并打開(kāi)一個(gè)空白的新郵件，供瀏覽者撰寫(xiě)內(nèi)容來(lái)與網(wǎng)站聯(lián)系人聯(lián)系，這是一種最方便的互動(dòng)方式。結(jié)合“個(gè)人說(shuō)明”網(wǎng)頁(yè)，建立E-Mail鏈接的步驟如下所述。操作步驟 步驟1 將光標(biāo)停留在頁(yè)面右下角要插入E-mail鏈接的位置。

步驟2 選擇“插入快捷欄”中的“常用”分類(lèi)，單擊左側(cè)第2個(gè)“電子郵件鏈接”按鈕。

步驟3 在彈出的“電子郵件鏈接”對(duì)話框中有兩個(gè)輸入項(xiàng)，分別是“文本”和“E-Mail”。在“文本”項(xiàng)中輸入鏈接的文字，中文、英文均可，在E-Mail項(xiàng)中輸入網(wǎng)站聯(lián)系有的電子郵件地址，如實(shí)例中的 ding_zhuimeng123@163.net。

步驟4 單擊“確定”按鈕，具有“E-Mail鏈接”屬性的文本就ding_zhuimeng123@163.net。插入到光標(biāo)所在位置了，按下 Ctrl+S保存網(wǎng)頁(yè)，再按下F12預(yù)覽查看實(shí)際效果。上面的方法只適用于文本的“E-Mail鏈接”，如果想在其它的對(duì)象（如圖像）上也加入這種鏈接，該怎辦呢？下面介紹第2種建立“E-Mail鏈接”的方法。

其實(shí)很簡(jiǎn)單，與前面講過(guò)的圖像加入鏈接的方法基本一樣。先在頁(yè)面中需要的地方插入圖像，之后選中圖像，并在“屬性面板”的“鏈接”文本框中輸入如下語(yǔ)句即可----mailto: ding_zhuimeng123@163.net ?subject=網(wǎng)站的建議與第1種方法不同的是，E-Mail 地址前面增加了mailto:字樣。用這種方法就可以給圖像等其他對(duì)象建立“E-Mail鏈接”了。

3.4文件下載鏈接

“文件下載鏈接”的原理很簡(jiǎn)單，只要鏈接文件屬于瀏覽無(wú)法識(shí)別的關(guān)型，便都會(huì)使用IE瀏覽器直接進(jìn)行下載，并保存到本地計(jì)算機(jī)中。

瀏覽器無(wú)法識(shí)別的文件類(lèi)型有很多，這里就介紹一個(gè)最常用的，以zip或rar為后綴名的壓縮格式文件，這種文件可以使用主流的壓縮軟件（如winzip、winrar）來(lái)制作。下面我們就業(yè)以實(shí)例來(lái)說(shuō)明。在前面“插入多媒體”一章中，我們?cè)?jīng)講過(guò)直接鏈接文件的方式來(lái)插入“視頻”，即直接在“鏈接”文本框中輸入“文件名+名后綴名”，如olympus.wmv。單日擊這個(gè)鏈接，經(jīng)過(guò)數(shù)據(jù)下載后，Windows系統(tǒng)將啟動(dòng)自帶的媒體播放器Windows Media Player 來(lái)播放該視頻。操作步驟

步驟1 先將視頻文件olympus.wmv通壓縮成olympus.rar文件，放入站點(diǎn)的media文件夾下。

步驟2 將文件路徑輸入至“鏈接”文本框中。

步驟3 保存網(wǎng)頁(yè)，按下F12預(yù)覽，在瀏覽器中單擊“下載精彩廣告視頻”鏈接文本，會(huì)彈出“文本下載”選擇框，單擊其中的“保存”按鈕。

步驟4 在“另存為”對(duì)框中選擇保存到本地計(jì)算機(jī)中的位置，實(shí)例中為“經(jīng)典回顧”文件夾。之后單擊“保存”按鈕，壓縮文件即保存到該位置中。至此，“文件下載鏈接”便制作完成了。讀者可以打開(kāi)“我的文檔”文件夾，解壓縮olympus.rar文件，隨時(shí)欣賞下載影片。

本設(shè)計(jì)中未用到此鏈接，在此只作簡(jiǎn)單介紹。

3.5在HTML語(yǔ)言中建立網(wǎng)頁(yè)鏈接

3.5.1文字鏈接

在HTML語(yǔ)言中用超鏈接標(biāo)記指向一個(gè)目標(biāo)。其基本格式為： 舉個(gè)簡(jiǎn)單的“文本鏈接”的實(shí)例，該實(shí)例相對(duì)應(yīng)的HTML代碼如下所示。

a href-“index2.html”target=”-blank”>平面設(shè)計(jì)（新開(kāi)窗口，-blank)

動(dòng)畫(huà)制作（原窗口，默認(rèn)為空）

網(wǎng)文精品