隨著國際互聯網的普及，很多人已經不滿足僅僅在Internet上的瀏覽信息，而是希望更深入的參與其中，擁有自己的Web網站，這似乎已經成為一種潮流。如果說個人建立網站是為了追求時尚，那么企業建立網站就是必然的選擇了。無論是專業的，還是業余的，很多人對網頁制作頗感興趣。事實上制作一個簡單的網頁并不困難，會使用Word的人都可以勝任。但想做出超凡脫俗的網頁就不那么容易了，而Dreamweaver卻可以滿足你的愿望，它是Macromedia公司開發的集網頁制作和網站管理于一身的所見即所得的網頁編輯器。同樣出自Macromedia公司的Flash,Fireworks在制作網站的過程中起到了錦上添花的作用，是個人網站實現的好幫手，在制作網站的時候經常會用到這些軟件。本文有五章，我來由淺到深介紹個人網站的設計與實現。

在互聯網走進我們的生活之前，沒有人敢夢想擁有自己的報紙、雜志、電臺、電視臺。除了政策上的制約外，一個人也根本沒有操作一份傳播媒體的能力。現在不同了，互聯網給我們提供了一個“表達自我”的自由天地,你可以擁有自己的新聞郵件，你可以建立自己的個人網站。只要你辦得成功也可以吸引成千上萬的訂戶、讀者,并建立自己在眾多參與者中的權威地位。建立個人網站的基本過程可以分為以下七個環節:1了解中國網絡個人主頁研究背景與發展現狀2系統需求分析與總體設計3熟悉網站開發模式、工具及環境4把自己的作品和想要展示的內容制作成網頁。5使用動態網頁技術(ASP)，實現動態內容更新。6認真地選取測試用例，進行交叉測試7網站的后期完善、宣傳及發展方向其中,網頁制作和使用動態網頁技術(ASP)實現動態內容更新是網站開發的核心內容。關鍵詞：網頁、制作、訪問、鏈接Abstract目錄第一章引言1.1什么是Internet1.2Internet有哪些功能1.3www簡介1.4網頁基本構成元素1.5軟件的安裝與啟動1.5.1軟件的安裝1.5.2軟件的啟動1.5.3創建快捷方式1.6制作網頁前的準備1.7Dreamweaver的操作環境1.7.1標題欄1.7.2菜單欄1.7.3快捷工具欄1.7.4屬性面板第二章網站制作實戰2.1站點2.1.1創建站點2.1.2創建站點內容2.2首頁2.2.1設置首頁布局2.2.2設置首頁的頁面屬性2.2.3查看和編輯頭內容2.2.4插入圖像2.2.5插入多媒體2.2.6插入文本2.3創建其它網頁第三章建立網頁鏈接3.1文字鏈接3.2圖像鏈接3.3E-Mail鏈接3.4文件下載鏈接3.5在HTML語言中建立網頁鏈接3.5.1文字鏈接3.5.2圖像鏈接3.5.3E-Mail鏈接3.6.4文件下載鏈接第四章結論致謝參考文獻第一章第一章第一章第一章預備知識預備知識預備知識預備知識1.1InternetInternetInternetInternet的中文名為“國際互聯網”，又稱“因特網”。Internet是由眾多的計算機網絡互聯而成的互聯網，它覆蓋了全世界各地，它是采用開放系統協議的計算機通訊網絡。然而，Internet不僅僅是計算機的互聯網，它還是全球最大的信息資源寶庫，它提供了包括科研、教育、文化娛樂、商業和信息交流等各種各樣的服務，使得世界范圍內的人與人之間的交流在時間和空間上變的更小了。要了解Internet，就必須先了解局域網。我們可以將同一地點的許多計算機使用網線連接在一起，構成一個高效率的計算機網絡，所有處于網絡內的終端機或電腦都能享受網絡內所有的資源，比如程序，圖文資料等。這種計算機網絡因為一般都局限在一定區域中，我們稱之為“局域網”（LocalAreaNetwork,簡稱LAN）,它是在日常工作中用得最多的一種小型計算機網絡。局域網所覆蓋的地理范圍比較小，通常不超過幾十公里，甚至只在同一座建筑物內或者鄰近的幾座建筑內。像常見的校園網，一座寫字樓內部的網絡等都屬于局域網。而Internet則不是指單個區域范圍內的網絡，而是指將全世界的各中不同類型的計算機網絡連接起來的一個全球性的網絡。Internet上有取之不盡，用之不竭的信息資源。對于Internet中各種各樣的信息，所有的人都可以通過網絡的連接來共享和使用。1.21.2Internet有那些功能Web頁瀏覽：這是目前利用最廣泛、最直接的互聯網服務，通過瀏覽WWW（萬維網）中的網頁，可以了解世界各地的新聞，查看最新的股市行情，最新的娛樂動態、科技發明，找到眾多的就業信息……幾乎想找到什么樣的信息，就有什么信息。正是有了WWW、Internet才會變得如此豐富多彩，才能走進千家萬戶。信息發布：通過Internet，不僅可以瀏覽別人發布在Web頁上的信息，也可以將自己要發布的信息制作成Web頁，也即網頁，然后發布到Internet上，供全世界的人瀏覽。電子郵件：不同于傳統郵件，電子郵件(E-mail)通過Internet傳輸，寫信，發信，收信都在計算機上完成，一封電子郵件最短在一秒之內就可以發送出去，其效率是傳統郵件無法比擬的。而且發送與接收電子郵件幾乎是免費的，所以比傳統郵件既節省時間又經濟的多。網上聊天：通過聊天軟件（如QQ、ICQ等）或不同網站的聊天室，可以和世界各地的網友聊天。網友可能是遠在天邊的異國朋友，也可能是與你一起工作的餓同事，或者是一起生活的家人，在這里沒有年齡、性別、身份、職業、國籍、膚色的限制，完全突破了交友的傳統方式，人們可通過Internet互相了解對方，進行各種各樣的交流。電子商務：現在網上交易已經成為現實，網上購物、網上商品銷售、網上拍賣、企業級電子商務、網上貨幣支付等電子商務活動已經搞的有聲有色，幾乎所有的專家都預測，在未來的幾年內，電子商務會飛速發展。在不久的將來，您可以做在電腦前進行各種各樣的商務活動。網絡游戲：通過Internet，可以與全世界的玩家一起進行游戲對戰，也可以協同作戰。網絡游戲已經成為信息產業全新的經濟增長點，每年都為開發商帶來巨額的利潤。通過網絡游戲，可以充分享受Internet給我們帶來的樂趣。網絡電話：網絡電話也稱IP電話。它采用Internet技術，利用專門的網絡電話軟件，只需支付非常低廉的話費就可通話。Internet在電信市場上的應用將越來越廣泛。1.3WWW的簡介WWW的全稱為WorldWideWeb，含義是“環球網”，又稱“萬維網”、3W、Web。WWW是一個基于超文本（Hypertext）方式的信息檢索服務工具。我們上網瀏覽到的網頁就是這樣的超文本，也就是HTML(HypertextMark-upLanguage,超文本標記語言)文件，這些網頁文件被放置到WWW服務器上，并且都有一定的地址。當我們想瀏覽某個網站時，首先要在電腦上安裝瀏覽器，如InternetExplorer或Netscape，然后在瀏覽器中輸入網站的地址（網址），就可以進入網站進行瀏覽。在這些網頁中，都有超連接，當將鼠標指針移動到某個地方（如文本或圖象）時，鼠標指針就會變成一個小手形形狀，單擊它就可以連接到另個網頁中，從而使得瀏覽者能在不同的信息之間跳轉，我們之所以能在Internet的海洋中穿梭自如，正是超連接的功勞。WWW為我們帶來的是世界范圍的超級文本服務：只須操縱鼠標，就可以通過Internet從世界各地調來你所希望的文本、圖像、動畫和聲音等信息。通過使用WWW，一個不熟悉網絡使用的人也可以成為Internet的行家。1.4網頁基本構成元素要學會制作網頁，首先需要了解網頁都是由什么元素構成的。文字：文本是構成網頁的基本元素。一個最簡單的網頁可以只有幾行文本。圖片：正是有個各種美麗的圖片，網頁才變得多姿多彩。動畫：如今，網頁上的動畫越來越多，最常用的有GIF動畫、Flash動畫等。超連接：如上所述，超連接幾乎是必不可少的。一個沒有超連接的網頁，就如同汪洋大海中的一座孤島，失去了與外界的一切聯系。其它元素：還可以在網頁中添加聲音、視頻等元素。1.5軟件的安裝與啟動要使用網站設計軟件，自然先要將這些軟件安裝到自己的電腦中。安裝完畢，還需要如何啟動，如何創建快捷方式。下面就讓我們來詳細地看一看具體的操作步驟。1.5.1軟件的安裝安裝之前，需要先了解軟件對系統的要求。以Windows為例，系統要求如下：IntelPentiumII處理器或等效處理器，主頻300MHz或更高。Windows98\Windows2000\WindowsNT(具有ServicePack3或更高版本)、WindowsMe或WindowsXP.NetscapeNavigator4.0版或更高版本或MicrosoftInternetExplorer.96MB的可用內存（RAM），建議采用128MB內存。分辨率可達800×600像素的256色顯示器（建議顏色為百萬顏色，分辨率達到1024×768像素）。CD-ROM驅動器。檢查一下您的計算機，看是否具備了以上條件。如果具備，將“MacromediaStudioMX”程序會自動運行。如果不能自動運行，可以找到光盤放入光驅，安裝程序會自動運行。可以找到光盤中的“InstallMacromediaStudioMX”程序或“Autorun”程序并雙擊運行。Dreamweaver的安裝比較容易，幾乎可以自動完成。下面簡要說明一下安裝步驟。操作步驟：1、將安裝光盤放入光驅，安裝程序自動運行，并出現安裝界面。如果單擊安裝界面上的“MacromediaSTUDIOMX安裝”，那么將會安裝其下方所列出的軟件。所有的安裝會自動完成。2、單擊DreamweaverMX,開始安裝過裝過程.先是出現解壓縮文件窗口,等待一會兒,便會出現安裝向導對話框。單擊“下一步”按鈕，繼續安裝過程。3、出現“選擇目的地位置”對話框，默認的盤是C盤，如果想安裝到不同的位置，可以單擊目的文件夾右邊的“瀏覽”按鈕，并在彈出的“選擇文件夾”對話框選擇不同的文件，如要安裝在D盤則可直接將路徑中的“C：”改為“D:”。也可以在下面的“目錄”中選擇其它的文件夾，設置完后，單擊“確定”，回到“選擇目的地址”對話框，單擊“下一步”繼續。4、而后會出現“默認編輯器”的對話框，默認為全選。如果希望讓DreamweaverMX成為下面所列文件類型的默認編輯器，那么可以在這里做選擇。選擇完畢，單擊“下一步”按鈕。5、出現“開始復制文件”對話框，單擊“下一步”安裝程序開始復制文件，過幾分鐘后，安裝結束，單擊“結束”按鈕，結束安裝。1.5.2軟件啟動軟件安裝完畢后，我們就可以使用它了。安裝程序已經自動在“開始”菜單中加入了快捷方式。單擊“開始”菜單，將鼠標指針依次指向“程序”|“Macromedia”|“MacromediaMX”,并在上面單擊鼠標左鍵。1.5.3創建快捷方式使用“開始”菜單啟動程序的過程比較煩瑣。可以在Windows桌面或快速啟動欄上創建快捷方式，這樣可以快速的啟動程序。具體實現方法是：在“開始”菜單中找到相應程序的快捷方式，不過這是不要用鼠標左鍵單擊，而是用右鍵按住向桌面拖動，然后松開右鍵，會出現一個快捷菜單，在其中可以選擇不同的命令，比如選擇“在當前位置創建快捷方式”或“復制到當前位置”。這樣以后在運行程序時，就方便快捷的多了。1.6制作網頁前的準備電腦必備：電腦速度夠快，最好能夠上網。操作系統：WindowsXP.軟件可選：其它軟件：看圖軟件美圖秀秀圖像處理軟件Photoshop、上傳工具CuteFTP1.7DreamweaverMX的操作環境我們將工作界面分成了“標題欄”、“菜單欄”、“快捷工具欄”、“屬性面板”、“浮動控制面板”5個部分來分別介紹。1.7.1標題欄DreamweaverMX的“標題欄”中將顯示文字“MacromediaDreamweaverMX”如果打開網頁的話，在后面還會顯示該網頁的一些信息，如網頁標題、所在位置及網頁名稱，右邊有三個鈕，分別對應DreamweaverMX的最大化最小化和關閉的操作。1.7.2菜單欄“標題欄”下面就是“菜單欄”，欄中提供了“文件”、“編輯”、“查看”、“插入”、“修改”、“文本”、“站點”、“窗口”、“幫助”10項菜單。單擊其中任意一項菜單，隨即就會出現一個下拉式指令菜單。有些指令的右邊會有鍵盤的代碼，這是該指令的快捷鍵，熟練使用快捷鍵將會有助于提高工作效率。有些指令的右邊會有一個小黑三角的標記，它代表該指令還包含下一級的指令，鼠標停留片刻即可顯示。1.7.3快捷工具欄“快捷工具欄”指的是“菜單欄”下邊的3排按鈕，選擇菜單“查看/工具欄”，勾選里面的“插入”、“文檔”和“標準”3項，完整的快捷工具欄就顯現出來了。1.7.4屬性面板在網頁編輯窗口的下面還有一個面板，它是有名的“屬性面板”，它在這個軟件中起到舉足輕重的作用。屬性面板顧名思義，就是顯示，調整屬性的面板，根據鼠標所選中對象的不同，“屬性面板”在界面上也會有所差異，用戶可以分別對不同的對象進行調整。站點2.1.1創建站點創建站點要制作一個網站，第一步操作都是一樣的，就是要創造一個“站點”，這樣可以使整個網站的脈絡結構清晰地展現在面前，避免了以后再進行紛雜的管理。從菜單中選擇“站點/管理站點”在彈出的對話框中選擇“新建”，之后再選擇其中的“站點”，再次彈出一個對話框，在文本框中輸入自己已經企化好的網站名稱“追夢人”。填好后，單擊“下一步”，進入下一個步驟。由于我要做的是一個靜態的網頁，所以選擇上面的一項“否，我不想使用服務器技術。”單擊“下一步”，進入下一個步驟。在此選項中有兩個選擇，選擇推薦的“編輯我的計算機上的本地副本，完成后再上傳到服務器”。底下的文本框允許在本地磁盤上指定一個文件夾，Dreamweaver將在其中儲存站點文件的本地副本。單擊該文本框后面的文件夾圖標，新建并指定一個空的文件夾“E:/ding”。之后單擊“下一步“，進入下一個步驟。這一步是如何設置連接到遠程服務器，彈出式菜單中有6中選擇，這里選擇“無”。而后“下一步”再“完成”，即可。2.1.2創建站點內容站點創建完成后，就可以創建Web頁來填充站點了。在“右側浮動面板組”中選擇“文件/文件”面板，此時整個網站中沒有任何內容。用鼠標右擊面板中的本地根目錄文件夾。在彈出的菜單中選擇“新建文件”，新建一個文件后將其命名為“index.htm(或index.html),它就是未來的首頁。由于“追夢人”網站分為“平面設計”、“動畫制作”、“網文精品”、“經典回顧”、“個人說明“這五個大欄目，所以繼續用鼠標右擊右側，在彈出的菜單中選擇第二項“NewFolder（新建文件夾）”。執行五次操作，新建五個文件夾，并把它們重命名為graph、anim、books、music、letter，分別對應上面的五個大欄目。存放它們各自的內容。之后再次新建1個文件夾，命名為images,用來存放“所有的圖象文件”的內容。之后在個欄目的文件夾里還要建立想相應的欄目網頁。2.2.1設置首頁布局每個網站都會有一個首頁，就功能上而言，它代表著一個網站的風格與特色，就網站架構上而言，它代表了網站的第一層架構，至于網站上其他Web頁，原則上都必須通過首頁來連接散播出去，可見首頁是多么的重要。首頁是打開網站后在瀏覽器中顯示的第一個頁面。它是起什么名字通常要視Server端的設置，一般的有index.htm,default.htm或home.htm等，目前主要以index.htm的居多。當然，后綴名為html也是正確的。具體設置方法是：右健單擊“文件”浮動面板中的index.htm,在彈出的菜單中選擇“設成首頁”。首頁的布局有很多方法，在這里我所用到的是表格的“布局模式”。“布局”模式中的表格稱為布局表格，單元格稱為布局單元格。在繪制布局表格和布局單元格時，必須從“標準”模式切換到“布局”模式。直接單擊“布局”按鈕即可。操作步驟：1、在“插入快捷欄”的“布局”分類中，單擊“布局表格”按紐。2、將變成“+”形狀的鼠標光標放到編輯中網頁上，在要繪制的地方進行拖動就可以進行創建了。（如果繪制的是第一個表格必須從網頁的最左上角開始繪制）。3、在這里要繪制多個表格，可以再次單擊“布局表格”按紐進行繪制，也可以按住Ctrl鍵繪制多個表格。追夢人”網站首頁的布局如圖所示：2.2.2設置首頁的頁面屬性首先雙擊“文件”浮動面板中的index.htm,進入頁面的編輯窗口。右健單擊空白區域，在菜單中選擇“頁面屬性”，之后彈出“頁面屬性”對話框，若選擇主菜單“修改/頁面屬性”項，也可以把打開該對話框。在“頁面屬性”對話框中，左側窗口顯示“分類”，其中包括了“外觀”、“鏈接”、“標題”、“標題/編碼”、“跟蹤圖像”5項，右側區域則顯示各類中可以設置的項目。“追夢人”首頁設置的屬性如下圖所示：2.2.3查看和編輯頭內容一個網頁文件結構上實際是由兩部分組成，頭（head）內容和主體（body）內容主體內容（body）是文檔的主要部分，也是包含文本和圖像等的可見部分。頭內容（head）是除文檔標題外的不可見部分，包含有文檔類型、語言編碼、搜索引擎的關鍵的關鍵字和內容指示器以及樣式定義等重要信息，這些元器并不是每個頁面都需要的，例如，可以僅為主頁提供關鍵字。下面就以首頁為例，說明怎樣插入較常用的頭（head）內容。單擊“菜單攔”下面“插入快捷”的下拉列表，選擇其中的HTML類，此時右側將會顯示該類中可以插入的對象快捷按鈕，再次單擊第2個按鈕“文件頭”旁邊的下拉箭頭，會彈出菜單，該項列出的便是即將插入的頭內容。2.2.4插入圖像圖像是網頁中不可或缺的組成成份，恰當地使用圖像，可以使網站充滿生活生命力與說服力，吸引更多的瀏覽者，加深他們欣賞你網站的意愿。另一方面，網頁的容量大小是網站成功與否的一大關鍵因素。由于網絡在傳輸上的限制，導致了下載的速度不可能太快，因此，網頁的大小就不能太大，其中關鍵就在于圖像的大小了，否則瀏覽者會失去等待的耐心，無論你的網站多么精彩也無濟于事了。所以，在網面容量大小的問題上一定要重視。下面就來詳細介紹對網頁圖像進行處理的操作步驟，以使得它們在保持圖形美麗與網站風格搭配的基礎上，圖片文件能夠變的更小。1、首先將光標停留在要插入圖像的位置，然后單擊“菜單欄”下面“插入快健欄”的下拉表，選擇其中的“常用”類，則右側將會顯示該類中可以插入的對象快鍵按鈕。左起第5個即為“圖像：圖像”按鈕，單擊它右側的下拉列表，選擇第1項“圖像”。2、隨即彈出“選擇圖像源文件”對話框。從計算機磁盤中選擇想要插入的圖像文件，或在URL編輯框中輸入圖像的路徑和名稱。下面的“相對于”下拉表框中，可選擇文件URL地址的類型，如果選擇“文檔”選項，表示圖像地址相對于當前文檔；如果選擇“站點根目錄”選項，表示地址相對于根目錄。在這里我要插入的是網站標志logo，插入logo圖象，如圖所示：最后單擊“確定”按鈕，即可完成插入圖像的操作。2.2.5插入多媒體在DreamweaverMX2004中，除了之前講到的可以插入“圖像”外，還可插入動畫、聲音、視頻等媒體元素，如Flash,Shockwave,Applets,ActieX及格Midi聲音文件等，并且還可以在Dreamweaver自身內插入MacromediaFlashMX2004按鈕和文本對象，以及進行相關的后期處理和添加設計備注等操作。在DreamweaverMX2004文檔中，可以插入媒體文件包括FlashShockwave影片、QuickTime、AVIjava、appletActiveX控件以及各種格式的音頻文件。要在瀏覽器中播放放Flash動畫，必須在瀏覽器中集成“Flash播放器（FlashPlayer）”。其中，InternetExplorer通過ActiveX控制來實現，NetscapeNavigator則是通過相應的插件來實現的。在最新的NetscapeNavigator和InternetExplorer瀏覽器中，均已集成了Flash動畫播放功能。操場作步驟：步驟1將光標停留在要插入Flash的位置，然后單擊菜單欄下面“插入快捷欄”的下拉列表，選擇其中的“常用”分類，右側將會顯示該類中可以插入的對象快捷按鈕。左起第6個即為“媒體”按鈕，單擊它右側的下拉列表，選擇第1項Flash圖標。步驟2在彈出的對話框中選擇擴展名為swf的Flash文件，即可將其插入到Dreamweaver的“網頁編輯窗口”中，可以看到，在這個窗口中Flash文件的大小。在這里我的主頁插入的一個動畫，如圖所示：2.2.6插入文本文字是人類語言最基本的表達方式，在網頁中，文本內容也可以說是重要的組成部分，一個網站成功與否，它是最關鍵的因素。在這最關鍵的因素。可豐富網站的文字內容，并以最最美觀、最整齊的方式放入到網頁中。插入文本的兩種方式網頁中需要大量的文本，我們或以通過以下兩種方式插入它們。一種是在網頁編輯窗口中直接用鍵盤敲入文本。這可以算是最基本的輸入方式了，和一些文本編輯軟件（如MicrosoftWord）的使用方法一樣，選擇好習慣的輸入法，就可以運指如飛了。另一種是復制文本的方式。有些讀者可能不喜歡使用DreamweaverMX2004來進行打字的工作，而更習慣在專門的文本編輯軟件中快速打字，如MicrosoftWord和Windows自帶的記事本等，又或者讀者已經準備好了要放入網頁的文本的電子版本，那么我們就可以直接使用Dreamweaver的文本復制功能，將大段的文本內容拷貝到網頁的編輯窗口來進行排版的工作，具體步驟如下。打開文本編輯軟件（如MicrosoftWord），選中要復制的文本，它們將反白顯示，執行菜單“編輯/復制”命令或直接用快捷鍵Ctrl+C，之后切換回Dreamweaver,將光標停留在插入文本的位置，執行主菜單“編輯/粘貼”命令或直接使用快捷鍵Ctrl+v,即可將大段的文本快速粘貼到網頁中。這在我的“網文精品”中用到很多，全部是在word軟件中排好ctrl+c,然后點擊要粘貼的位置，crtl+v到Dreamweaver即可。2.3創建其它網頁還有其它的幾個網站與主頁的制作相同，一個網頁是圖象和文字的組合。“平面設計”中的圖象插入和前面的介紹相似，并可以在屬性攔中調節圖象的大小。在Dreamwerver中常常會用到Firework、Flash，它們是相輔相成，在主頁中的主體部分就是用Firework,如圖所示：在“個人說明”中也用到這點，首先定好需要尺寸，在屬性中設好背景，顏色等等，插入圖象，輸入文字，也word里的操作雷同。3.建立網頁鏈接網站實際上是由很多網頁組成的，那么網頁之間是如何聯系的呢？這就是本章要講的內容----網頁的“鏈接”。“鏈接”，又稱“超鏈接"（Hyperlink）,它作為網頁的橋梁，起著相當重要的作用。網頁中的很多對象都可以加入“鏈接”屬性。在DreamweaverMX2004中，如果以“鏈接”的媒介來劃分的話，則“鏈接”可以分為“文字鏈接”、“圖像鏈接”、“圖像地圖鏈接”、“內部鏈接和外部鏈接”、“E-mail鏈接”、“命名錨記鏈接”、“文件下載鏈接”和“跳轉菜單”，共8種。其中部分內容在之前的章節中可能接觸過，這里將對其進行更深入的講解。3.1文字鏈接“文字鏈接”即以文字作為媒介的鏈接，它是網頁中最常被使用的鏈接方式，具有“文件小、制作簡單和便于維護”的特點。接下來結合我的個人網站為實例，來講解如何為文字建立“鏈接”。具體操作步驟如下所述。操作步驟步驟1準備好已經制作完成的首頁的各個欄目頁面（假設除了“鏈接”，其他內容都已經制作完成了），該網站包含6個欄目，這里的5個欄目----“平面設計”、“動畫制作”和“網文精品”、“經典回顧”、“個人說明”為例來進行講解。步驟2在Dreamweaver中打開首頁，之后反白選取作為“鏈接”的文字。實例中要做到單擊不同的欄目的網頁。因此為第1個欄目“平面設計”設置鏈接，首先要反白選中“平面設計”4個文字。步驟3觀察“屬性面板”，其中包括一個“鏈接”文本框。步驟4接下來需要把鏈接的地址加入到文本框中，方法有3種。這里我用到的是直接點擊文件夾圖標，在文件夾中找到要鏈接的對象graph.htm。這樣就建立了超鏈接。不過有點很重要，由于大多數服務器都不支持中文文件名，而且對大小寫敏感，因此采用英文文件名并統一大小寫。如圖所示：步驟5在“鏈接”文本框下面還有一個“目標”下拉列表，從中可以選擇鏈接網頁顯示的窗口方式，共有4種。如圖：實例中沒有選擇任何選項，保持空白，表示在原窗口中打開鏈接網頁。步驟6還可以設置一些“鏈接”的屬性，這是前面講過的內容。單擊“屬性面板”中的“頁面屬性”，選擇其中的“鏈接”分類，可以進行的設置有“鏈接字體”、“大小”、“鏈接顏色”、“變換圖像鏈接”顏色、“已訪問鏈接”顏色、“活動鏈接”顏色及“下劃線樣式”。步驟7至此，第1個欄目的鏈接就制作完畢了，按下Ctrl+S保存網頁，再按下F12預覽，測試一下，當鼠標放在“平面設計”這4個文字上時將變成手形，并且瀏覽器窗口下面的狀態欄中會顯示鏈接到的網頁的地址，單擊文字，頁面會立即跳轉到第1個欄目中，這表示鏈接已經制作成功了。步驟8同理，按照以上步驟，再為“動畫制作”和“網文精品”“經典回顧“等其它欄制作指向對應欄目的鏈接。步驟9通常在欄目頁面中還需要有“返回首頁”的鏈接，單擊其后可以跳轉回首頁，因此在各個欄目中還要插入“網站首頁”的文字，并且制作指向首頁index.html的鏈接，制作方法不變。至此，整個“文字鏈接”的實例就全就全部完成了。通過對這個實例的講解，讀者不僅應該學會如何為文字制作鏈接，還應用對“鏈接”有了更加深刻的理解，鏈接的目的何在？它到底能夠在網頁的網站中發揮什么樣的作用？怎樣才能更好地使用它？這些是網頁制作者更應該思考的問題。下面繼續介紹其他類型的鏈接。3.2圖像鏈接圖像鏈接圖像鏈接圖像鏈接“圖像”也是常被使用的鏈接媒體，它和“文字鏈接”非常相似。為圖像加入鏈接，首先應該在網頁中插入“圖像”，有關插入“圖像”或“導航條”按鈕的內容，接下來以我的網站“追夢人“為例，講解如何建立“圖像鏈接”。操作步驟步驟1首先仍然要準備好已經制作完成的首頁和各個欄目的頁面（假設除了“鏈接”，其他內容都已經制作完成了），該網站包含6個欄目，下面我們就動手為這6個欄目分別制作它們的鏈接。步驟2在Dreamweaver中打開網站的首頁，之后選取要制作“鏈接”的圖像。實例中先為第3個欄目“動畫制作”設置鏈接，因此選中包含“動畫制作”4個字的圖像。步驟3觀察“屬性面板”，在“鏈接”文本框中輸入鏈接的文字地址。可以使用之前講過的“指向文件”和“選擇文件”的方法。步驟4如果有需要，可以在“目標”下拉列表中選擇“鏈接”網頁顯示的窗口方式，分別為-blank、-parent、-self或top。實例中使用了默認出的保留空白選項的方式。步驟5另外，讀者還可以為圖像增加“替代”文本。實例中為第1個欄目增加欄目名稱的“替代”文本。步驟6至此，第1個欄目的圖像鏈接就制作完畢了，按下Ctrl+S保存網頁，再按下F12預覽，測試一下，將鼠標放在“動畫制作”4個文字上時將變成手形，同時瀏覽器窗口下面的狀態欄中會顯示出鏈接到的網頁的地址，并且會顯示出“替代”文本“動畫制作”，單擊文字，頁面會立即跳轉到第3個欄目中，這表示鏈接已經制作成功了。步驟7同理，按照以上步驟，再為其它幾幅圖像制作指向對應欄目的鏈接。步驟8在欄目頁面中制作“返回首頁”的鏈接，使得單擊后可以跳轉回首頁，其制作方法不變。至此，整個“圖像鏈像”的實例就全部完成了。3.3E3.3E3.3E3.3E––––MailMailMailMail的鏈接的鏈接的鏈接的鏈接E-Mail鏈接，是指當瀏覽者單擊該鏈接之后，不是打開一個網頁文件，而是啟動用戶的E-Mail客戶端軟件（如OutlookExpress）,并打開一個空白的新郵件，供瀏覽者撰寫內容來與網站聯系人聯系，這是一種最方便的互動方式。結合“個人說明”網頁，建立E-Mail鏈接的步驟如下所述。操作步驟步驟1將光標停留在頁面右下角要插入E-mail鏈接的位置。步驟2選擇“插入快捷欄”中的“常用”分類，單擊左側第2個“電子郵件鏈接”按鈕。步驟3在彈出的“電子郵件鏈接”對話框中有兩個輸入項，分別是“文本”和“E-Mail”。在“文本”項中輸入鏈接的文字，中文、英文均可，在E-Mail項中輸入網站聯系有的電子郵件地址，如實例中的ding_zhuimeng123@163.net。步驟4單擊“確定”按鈕，具有“E-Mail鏈接”屬性的文本就ding_zhuimeng123@163.net。插入到光標所在位置了，按下Ctrl+S保存網頁，再按下F12預覽查看實際效果。上面的方法只適用于文本的“E-Mail鏈接”，如果想在其它的對象（如圖像）上也加入這種鏈接，該怎辦呢？下面介紹第2種建立“E-Mail鏈接”的方法。其實很簡單，與前面講過的圖像加入鏈接的方法基本一樣。先在頁面中需要的地方插入圖像，之后選中圖像，并在“屬性面板”的“鏈接”文本框中輸入如下語句即可----mailto:ding_zhuimeng123@163.net?subject=網站的建議與第1種方法不同的是，E-Mail地址前面增加了mailto:字樣。用這種方法就可以給圖像等其他對象建立“E-Mail鏈接”了。3.4文件下載鏈接文件下載鏈接文件下載鏈接文件下載鏈接“文件下載鏈接”的原理很簡單，只要鏈接文件屬于瀏覽無法識別的關型，便都會使用IE瀏覽器直接進行下載，并保存到本地計算機中。瀏覽器無法識別的文件類型有很多，這里就介紹一個最常用的，以zip或rar為后綴名的壓縮格式文件，這種文件可以使用主流的壓縮軟件（如winzip、winrar）來制作。下面我們就業以實例來說明。在前面“插入多媒體”一章中，我們曾經講過直接鏈接文件的方式來插入“視頻”，即直接在“鏈接”文本框中輸入“文件名+名后綴名”，如olympus.wmv。單日擊這個鏈接，經過數據下載后，Windows系統將啟動自帶的媒體播放器WindowsMediaPlayer來播放該視頻。操作步驟步驟1先將視頻文件olympus.wmv通壓縮成olympus.rar文件，放入站點的media文件夾下。步驟2將文件路徑輸入至“鏈接”文本框中。步驟3保存網頁，按下F12預覽，在瀏覽器中單擊“下載精彩廣告視頻”鏈接文本，會彈出“文本下載”選擇框，單擊其中的“保存”按鈕。步驟4在“另存為”對框中選擇保存到本地計算機中的位置，實例中為“經典回顧”文件夾。之后單擊“保存”按鈕，壓縮文件即保存到該位置中。至此，“文件下載鏈接”便制作完成了。讀者可以打開“我的文檔”文件夾，解壓縮olympus.rar文件，隨時欣賞下載影片。本設計中未用到此鏈接，在此只作簡單介紹。3.5在在在在HTMLHTMLHTMLHTML語言中建立網頁鏈接語言中建立網頁鏈接語言中建立網頁鏈接語言中建立網頁鏈接..1文字鏈接文字鏈接文字鏈接文字鏈接在HTML語言中用超鏈接標記指向一個目標。其基本格式為：<ahref=”URL”文本內容</a>舉個簡單的“文本鏈接”的實例，該實例相對應的HTML代碼如下所示。<html><head><title>文字鏈接</title></head><body><p>ahref-“index2.html”target=”-blank”>平面設計</a>（新開窗口，-blank)</p><p><ahref=”index3.html>動畫制作</a>（原窗口，默認為空）</p><p><ahref=”index4.html>網文精品</a></p></body></html>解釋?href:是<a>標記的一種屬性，該屬性中的URL等于鏈接目標文件的地址。?Target:也是<a>標記的一種屬性，相當于Dreamweaver“屬性面板”中的“目標”，它的值等于-blank,效果是在新窗口中打開。除此之外還包括其他3種：-parent,-self和-top。這和Dreamweaver中“目標”下拉列表中的內容是一模一樣的。?文本內容：如代碼實例中的“平面設計”。這些文本將放在使用了鏈接屬性href和目標屬性target的<a>與</a>標記之間，產生了鏈接的效果。提示再提醒讀者一下，<p>為段落標記，在Dreamweaver中是由Enter（回車）鍵產生的。..2圖像鏈接圖像鏈接圖像鏈接圖像鏈接舉個簡單的“圖像鏈接”的實例。該實例相對應的ＨＴＭＬ代碼所示。<html><head><title>圖像鏈接</title></head><body><p><ahref=”web/web-001.htm”target=”-blank”><imgsrc=”images/btn-001-out.gif”alt“平面設計”=width=”85”height=”18”border=”0”></a>（新開窗口，-blank）</p><p><ahref=wallpaper/wallpaper-001.htm”><imgsrc=”images/btn-002-out.gif”alt=“原創壁紙”width=”85”height=”18”border=”0”></a>（原窗口，默認為空）</p><p>ahref=”3d/3d-001.htm”><imgsrc=”images/btn-003-out.gif”alt“三維作品”=width=”85”height=”18”border=”0”></a></p></body></html>解釋仔細觀察代碼可以發現，“圖像鏈接”與“文本鏈接”惟一的差別就在于<a>與<a/>之間的內容。“文本鏈接”中<a>與</a>之間的內容是文字內容，而“圖像鏈接”中就肯定是圖片內容了。之前講過，插入圖片使用“<imgsrc=”圖像的ＵＲＬ“<”的標記，這里當然也不會例外。而是還可以使用”<img的屬性，如alt（替換文本）、width（寬）、height（高）、及border（邊框）等..3Ｅ－ＭＥ－ＭＥ－ＭＥ－Ｍailailailail鏈接鏈接鏈接鏈接該實例相對應的“ＨＴＭＬ”代碼如下所述。<html><head><title>Email鏈接</title></head><body><p><ahref=”mailto:jiangnan@?subject=網站的意見建議“>給我寫信</a></p></body><html>解釋只需使href等于“mailto：郵件地址？subject=主題＂即可，其中subject為可選項，“？subject=主題”也可以不加。..5文件下載鏈接文件下載鏈接文件下載鏈接文件下載鏈接“文件下載鏈接”實例的代碼如下所述。<html><head><title>文件下載鏈接</title></head></body><ahref=”media/Olympus.rar”>下載精彩廣告視頻</a>解釋只需使href等于“文件的路徑”即可。本章講解的是網站的鏈接的方法和技巧。能讓瀏覽者很輕松的地觀看是很重要的，這其中的關鍵就再于“鏈接“了。第四章第四章第四章第四章結論結論結論結論經過幾周的工作，個人網站的設計與實現終于完成，本次設計基本完成任務書要求的功能。查找信息、文件共享等。由于是個人網站，在設計上就沒有什么拘束和限制，完全發揮自己的想象力和創造力，展現自己的興趣和個性。本次設計用Macromedia公司開發的專業HTML編輯器Dreamweaver,對Wed站點、Web頁和Web應用程序進行設計、編碼和開發。利用Dreamweaver中的可視化編輯功能，用戶可以快速創建頁面而無須編寫任何代碼。并且。借助Dreamweaver，還可以使用服務器語言（例如：ASP,ASP.NET,ColdFusion標記語言（CFML），JSP，PHP）。本設計的頁面不是很精美，這寫些不足之處還待后期的開發和改進。致謝繁忙的設計終于完成了，在設計期間我受到了來自四面八方的幫助和支持。首先要感謝指導老師，感謝在百忙中抽空對我們的設計和論文提出建議。特別要感謝的是程老師對我們嚴格的要求，嚴謹的治學態度。接下來要感謝我的同學給我的大力支持，是他們在設計之初協助我掌握了Dreamweaver的使用方法。在設計中他們給我提了不少的意見，還幫助我解決了很多技術上的問題。最后還要感謝這些年來給予我淳淳教導的各位老師，他們給予了我的知識讓我收益一生，謝謝！參考文獻[1]姜楠完美網頁設計與制作中國青年出版社2004年5月[2]歐陽峰，陳朝榮電子商務技術中國財政經濟出版社2001年8月[3]中國IT培訓工程編委會FlashMx實例教程珠海出版社2003年1月[4]趙子江多媒體技術應用教程（4）版機械工業出版社2004年8月第4版[5]李東博杜學智李增輝精彩網頁制作三劍客西安電子科技大學出版社2003年10月[6]賀凱焦超FlashMx2004動畫制作典型范例中國出版社2005年2月基于C8051F單片機直流電動機反饋控制系統的設計與研究基于單片機的嵌入式Web服務器的研究MOTOROLA單片機MC68HC（8）05PV8/A內嵌EEPROM的工藝和制程方法及對良率的影響研究基于模糊控制的電阻釬焊單片機溫度控制系統的研制基于MCS-51系列單片機的通用控制模塊的研究基于單片機實現的供暖系統最佳啟停自校正（STR）調節器單片機控制的二級倒立擺系統的研究基于增強型51系列單片機的TCP/IP協議棧的實現基于單片機的蓄電池自動監測系統基于32位嵌入式單片機系統的圖像采集與處理技術的研究基于單片機的作物營養診斷專家系統的研究基于單片機的交流伺服電機運動控制系統研究與開發基于單片機的泵管內壁硬度測試儀的研制基于單片機的自動找平控制系統研究基于C8051F040單片機的嵌入式系統開發基于單片機的液壓動力系統狀態監測儀開發模糊Smith智能控制方法的研究及其單片機實現一種基于單片機的軸快流CO〈,2〉激光器的手持控制面板的研制基于雙單片機沖床數控系統的研究基于CYGNAL單片機的在線間歇式濁度儀的研制基于單片機的噴油泵試驗臺控制器的研制基于單片機的軟起動器的研究和設計基于單片機控制的高速快走絲電火花線切割機床短循環走絲方式研究基于單片機的機電產品控制系統開發基于PIC單片機的智能手機充電器基于單片機的實時內核設計及其應用研究基于單片機的遠程抄表系統的設計與研究基于單片機的煙氣二氧化硫濃度檢測儀的研制基于微型光譜儀的單片機系統單片機系統軟件構件開發的技術研究基于單片機的液體點滴速度自動檢測儀的研制基于單片機系統的多功能溫度測量儀的研制基于PIC單片機的電能采集終端的設計和應用基于單片機的光纖光柵解調儀的研制氣壓式線性摩擦焊機單片機控制系統的研制基于單片機的數字磁通門傳感器基于單片機的旋轉變壓器-數字轉換器的研究基于單片機的光纖Bragg光柵解調系統的研究單片機控制的便攜式多功能乳腺治療儀的研制基于C8051F020單片機的多生理信號檢測儀基于單片機的電機運動控制系統設計Pico專用單片機核的可測性設計研究基于MCS-51單片機的熱量計基于雙單片機的智能遙測微型氣象站MCS-51單片機構建機器人的實踐研究基于單片機的輪軌力檢測基于單片機的GPS定位儀的研究與實現基于單片機的電液伺服控制系統用于單片機系統的MMC卡文件系統研制基于單片機的時控和計數系統性能優化的研究基于單片機和CPLD的粗光柵位移測量系統研究單片機控制的后備式方波UPS提升高職學生單片機應用能力的探究基于單片機控制的自動低頻減載裝置研究基于單片機控制的水下焊接電源的研究基于單片機的多通道數據采集系統基于uPSD3234單片機的氚表面污染測量儀的研制基于單片機的紅外測油儀的研究96系列單片機仿真器研究與設計基于單片機的單晶金剛石刀具刃磨設備的數控改造基于單片機的溫度智能控制系統的設計與實現基于MSP430單片機的電梯門機控制器的研制基于單片機的氣體測漏儀的研究基于三菱M16C/6N系列單片機的CAN/USB協議轉換器基于單片機和DSP的變壓器油色譜在線監測技術研究基于單片機的膛壁溫度報警系統設計基于AVR單片機的低壓無功補償控制器的設計基于單片機船舶電力推進電機監測系統基于單片機網絡的振動信號的采集系統基于單片機的大容量數據存儲技術的應用研究基于單片機的疊圖機研究與教學方法實踐基于單片機嵌入式Web服務器技術的研究及實現基于AT89S52單片機的通用數據采集系統基于單片機的多道脈沖幅度分析儀研究機器人旋轉電弧傳感角焊縫跟蹤單片機控制系統基于單片機的控制系統在PLC虛擬教學實驗中的應用研究基于單片機系統的網絡通信研究與應用基于PIC16F877單片機的莫爾斯碼自動譯碼系統設計與研究基于單片機的模糊控制器在工業電阻爐上的應用研究基于雙單片機沖床數控系統的研究與開發基于Cygnal單片機的μC/OS-Ⅱ的研究HYPERLINK"/detail.htm?36658