第一篇:淺析數字圖書館網站設計與實現的論文
1系統需求分析
1.1后臺功能需求
1)系統設置模塊。對系統的的基本設置進行設置。例如網站版權信息、網站備案號、網站的域名、網站管理員信息等等。2)欄目管理模塊。對網站的欄目進行設置管理。主要包括添加欄目、刪除欄目、查看欄目基本信息、修改欄目信息(例如欄目分組、欄目的類型、欄目模版、是否在菜單顯示、欄目的狀態等等)、添加欄目分組、刪除欄目分組等等。3)網站公告模塊。超級管理員可以對網站的固定公告、彈窗公告等進行管理。主要包括添加刪除彈出公告,修改公告內容等功能。4)投票模塊。用戶可以添加網站調查,啟動網站投票。包括添加調查主題、添加刪除調查選項、設置選項的票數、設置投票多選還是單選、設置投票狀態等等。5)訪問者安全管理模塊。網站管理員可以添加、修改、刪除訪問IP地址段,用于屏蔽、授權訪問的IP地址的功能。6)專題管理模塊。網站管理員可以添加、修改、刪除網站的專題,并綁定專題所屬欄目等等功能。7)內容管理模塊。有權限的管理員可以管理網站的內容,例如添加文章、刪除文章、修改文章、審核文章、修改文章作者來源等信息。
1.2前臺功能需求
前臺主要向最終用戶顯示信息,將信息顯示到最終用戶的瀏覽器。前臺包括8個主要的功能需求模塊:1)模版管理模塊。建站人員可以在不修改系統源代碼的情況下修改網站的模版、風格以及前臺界面。2)內容展示模塊。系統根據建站人員設置的模版以及欄目設置等向最終用戶展示文章新聞等內容。3)訪問控制模塊。對系統的欄目文章等頁面進行訪問控制,不在允許列表中的IP不能訪問。4)訪問記錄模塊。記錄每一個IP訪問某一篇文章的次數,按照一定次序進行排序。5)投稿模塊。超級管理員創建的投稿用戶擁有權限向可以投稿的欄目投稿,投稿用戶可以選擇投稿的欄目,引用欄目,投稿文章標題、內容等信息。6)友情鏈接模塊。管理員可以添加有錢鏈接,使用標簽可以在首頁以及其他頁面顯示文字或者圖片形式的友情鏈接。7)日志模塊。記錄系統的操作日志,以及訪問異常等日志信息。8)搜索模塊。用戶可以使用搜索功能搜索到本系統中的信息。
2系統設計
2.1系統總體設計
1)總體架構本系統作為一種通用型的軟件系統,其架構必須適應用戶需求的不斷變化,而且應該層次清晰,各模塊應該獨立不互相依賴,方便二次開發。數據訪問層、邏輯層、界面層完全獨立。2)設計思想本系統采用了多層結構的設計思想,即網站架構常用的三層架構模式,使界面層,邏輯層,數據訪問層全部獨立,當某一層代碼需要改變時,不會影響到其他層。如新建一個站點時,只需要添加欄目以及更改界面,設置網站基本信息,就可以快速搭建一個WEB站點,這樣使系統具有很好的靈活性和擴展性。
2.2系統的主要類設計
系統充分的利用了面向對象語言多態的特性,對系統中的主要功能函數都采用接口的方式進行了封裝,數據庫訪問層使用了單獨的動態鏈接庫進行封裝,使系統二次開發或者更新時,減少人力和物力資源的浪費。
3系統實現
3.1系統核心模塊實現
針對網站系統最常用類,分別設計并實現了相應的核心接口函數。主要包括數據庫操作函數、讀取配置文件函數、文件操作函數、加解密函數、網站即時信息操作函數等等。
3.2緩存類的實現
系統廣泛使用了緩存的方式保存了網站訪問比較頻繁的數據,減小了數據庫服務器的壓力,使頁面加載速度更快,分別實現了基本緩存類(BasicCache.cs)、欄目緩存類(CategoryCache.cs)、IP緩存類(IpFilterCache.cs),角色緩存類(RoleCache.cs)。
3.3動態模版實現
內容管理系統中最核心以及最復雜的就是動態模版的實現,本系統采用asp.net的一個模版庫NVelocity實現了動態模版。NVelocity是開源包Velocity重寫的.NET版本,代碼簡單易懂,標簽可讀性很高。
4結束語
本系統根據內容管理系統通用快捷特點,把實現靈活和可擴展的軟件系統為目標,設計并實現了本系統。使用Asp.net2.0和NVelocity實現了簡單靈活的一個快速建站系統,系統采用多層分離的方式,使方便開發人員二次開發,以及方便更新。經實踐,該系統相對市面上的其他內容管理系統,具有更簡潔,更容易擴展等優點,目前已經在網站領域得到了很好的應用。
第二篇:論文:個人網站的設計與實現
個人網站的設計與實現
前 言
隨著國際互聯網的普及,很多人已經不滿足僅僅在Internet上的瀏覽信息,而是希望更深入的參與其中,擁有自己的Web網站,這似乎已經成為一種潮流。如果說個人建立網站是為了追求時尚,那么企業建立網站就是必然的選擇了。
無論是專業的,還是業余的,很多人對網頁制作頗感興趣。事實上制作一個簡單的網頁并不困難,會使用Word的人都可以勝任。但想做出超凡脫俗的網頁就不那么容易了,而Dreamweaver卻可以滿足你的愿望,它是Macromedia公司開發的集網頁制作和網站管理于一身的所見即所得的網頁編輯器。
同樣出自Macromedia公司的Flash,Fireworks在制作網站的過程中起到了錦上添花的作用,是個人網站實現的好幫手,在制作網站的時候經常會用到這些軟件。
本文有五章,我來由淺到深介紹個人網站的設計與實現。
摘 要
在互聯網走進我們的生活之前,沒有人敢夢想擁有自己的報紙、雜志、電臺、電視臺。除了政策上的制約外,一個人也根本沒有操作一份傳播媒體的能力。現在不同了,互聯網給我們提供了一個“表達自我”的自由天地,你可以擁有自己的新聞郵件,你可以建立自己的個人網站。只要你辦得成功也可以吸引成千上萬的訂戶、讀者,并建立自己在眾多參與者中的權威地位。建立個人網站的基本過程可以分為以下七個環節 : 1 了解中國網絡個人主頁研究背景與發展現狀 2 系統需求分析與總體設計 3 熟悉網站開發模式、工具及環境 把自己的作品和想要展示的內容制作成網頁。5 使用動態網頁技術(ASP),實現動態內容更新。6 認真地選取測試用例,進行交叉測試 7 網站的后期完善、宣傳及發展方向
其中 ,網頁制作和使用動態網頁技術(ASP)實現動態內容更新是網站開發的核心內容。
關鍵詞:網頁、制作、訪問、鏈接 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 Internet的中文名為“國際互聯網”,又稱“因特網”。
Internet是由眾多的計算機網絡互聯而成的互聯網,它覆蓋了全世界各地,它是采用開放系統協議的計算機通訊網絡。然而,Internet不僅僅是計算機的互聯網,它還是全球最大的信息資源寶庫,它提供了包括科研、教育、文化娛樂、商業和信息交流等各種各樣的服務,使得世界范圍內的人與人之間的交流在時間和空間上變的更小了。
要了解Internet,就必須先了解局域網。我們可以將同一地點的許多計算機使用網線連接在一起,構成一個高效率的計算機網絡,所有處于網絡內的終端機或電腦都能享受網絡內所有的資源,比如程序,圖文資料等。這種計算機網絡因為一般都局限在一定區域中,我們稱之為“局域網”(Local Area Network,簡稱LAN),它是在日常工作中用得最多的一種小型計算機網絡。局域網所覆蓋的地理范圍比較小,通常不超過幾十公里,甚至只在同一座建筑物內或者鄰近的幾座建筑內。像常見的校園網,一座寫字樓內部的網絡等都屬于局域網。
而Internet則不是指單個區域范圍內的網絡,而是指將全世界的各中不同類型的計算機網絡連接起來的一個全球性的網絡。Internet上有取之不盡,用之不竭的信息資源。對于Internet中各種各樣的信息,所有的人都可以通過網絡的連接來共享和使用。
1.2 Internet有那些功能
Web頁瀏覽:這是目前利用最廣泛、最直接的互聯網服務,通過瀏覽WWW(萬維網)中的網頁,可以了解世界各地的新聞,查看最新的股市行情,最新的娛樂動態、科技發明,找到眾多的就業信息??幾乎想找到什么樣的信息,就有什么信息。正是有了WWW、Internet才會變得如此豐富多彩,才能走進千家萬戶。信息發布:通過Internet,不僅可以瀏覽別人發布在Web頁上的信息,也可以將自己要發布的信息制作成Web頁,也即網頁,然后發布到Internet上,供全世界的人瀏覽。
電子郵件:不同于傳統郵件,電子郵件(E-mail)通過Internet傳輸,寫信,發信,收信都在計算機上完成,一封電子郵件最短在一秒之內就可以發送出去,其效率是傳統郵件無法比擬的。而且發送與接收電子郵件幾乎是免費的,所以比傳統郵件既節省時間又經濟的多。
網上聊天:通過聊天軟件(如QQ、ICQ等)或不同網站的聊天室,可以和世界各地的網友聊天。網友可能是遠在天邊的異國朋友,也可能是與你一起工作的餓同事,或者是一起生活的家人,在這里沒有年齡、性別、身份、職業、國籍、膚色的限制,完全突破了交友的傳統方式,人們可通過Internet互相了解對方,進行各種各樣的交流。
電子商務:現在網上交易已經成為現實,網上購物、網上商品銷售、網上拍賣、企業級電子商務、網上貨幣支付等電子商務活動已經搞的有聲有色,幾乎所有的專家都預測,在未來的幾年內,電子商務會飛速發展。在不久的將來,您可以做在電腦前進行各種各樣的商務活動。
網絡游戲:通過Internet,可以與全世界的玩家一起進行游戲對戰,也可以協同作戰。網絡游戲已經成為信息產業全新的經濟增長點,每年都為開發商帶來巨額的利潤。通過網絡游戲,可以充分享受Internet給我們帶來的樂趣。
網絡電話:網絡電話也稱IP電話。它采用Internet技術,利用專門的網絡電話軟件,只需支付非常低廉的話費就可通話。Internet在電信市場上的應用將越來越廣泛。
1.3 WWW的簡介
WWW的全稱為World Wide Web,含義是“環球網”,又稱“萬維網”、3W、Web。WWW是一個基于超文本(Hypertext)方式的信息檢索服務工具。我們上網瀏覽到的網頁就是這樣的超文本,也就是HTML(Hypertext Mark-up Language,超文本標記語言)文件,這些網頁文件被放置到WWW服務器上,并且都有一定的地址。當我們想瀏覽某個網站時,首先要在電腦上安裝瀏覽器,如Internet Explorer或Netscape,然后在瀏覽器中輸入網站的地址(網址),就可以進入網站進行瀏覽。在這些網頁中,都有超連接,當將鼠標指針移動到某個地方(如文本或圖象)時,鼠標指針就會變成一個小手形形狀,單擊它就可以連接到另個網頁中,從而使得瀏覽者能在不同的信息之間跳轉,我們之所以能在Internet的海洋中穿梭自如,正是超連接的功勞。
WWW 為我們帶來的是世界范圍的超級文本服務:只須操縱鼠標,就可以通過Internet從世界各地調來你所希望的文本、圖像、動畫和聲音等信息。通過使用WWW,一個不熟悉網絡使用的人也可以成為Internet的行家。
1.4網頁基本構成元素
要學會制作網頁,首先需要了解網頁都是由什么元素構成的。
文字:文本是構成網頁的基本元素。一個最簡單的網頁可以只有幾行文本。
圖片:正是有個各種美麗的圖片,網頁才變得多姿多彩。
動畫:如今,網頁上的動畫越來越多,最常用的有GIF動畫、Flash動畫等。
超連接:如上所述,超連接幾乎是必不可少的。一個沒有超連接的網頁,就如同汪洋大海中的一座孤島,失去了與外界的一切聯系。
其它元素:還可以在網頁中添加聲音、視頻等元素。
1.5軟件的安裝與啟動 要使用網站設計軟件,自然先要將這些軟件安裝到自己的電腦中。安裝完畢,還需要如何啟動,如何創建快捷方式。下面就讓我們來詳細地看一看具體的操作步驟。
1.5.1軟件的安裝
安裝之前,需要先了解軟件對系統的要求。以Windows為例,系統要求如下: Intel Pentium II處理器或等效處理器,主頻300MHz或更高。
Windows 98Windows 2000Windows NT(具有Service Pack 3 或更高版本)、Windows Me或Windows XP.Netscape Navigator 4.0版或更高版本或Microsoft Internet Explorer.96MB的可用內存(RAM),建議采用128MB內存。
分辨率可達 800×600像素的256色顯示器(建議顏色為百萬顏色,分辨率達到1024×768像素)。CD-ROM 驅動器。
檢查一下您的計算機,看是否具備了以上條件。如果具備,將“Macromedia Studio MX”程序會自動運行。如果不能自動運行,可以找到光盤放入光驅,安裝程序會自動運行。可以找到光盤中的“Install Macromedia Studio MX”程序或“Autorun”程序并雙擊運行。
Dreamweaver的安裝比較容易,幾乎可以自動完成。下面簡要說明一下安裝步驟。
操作步驟:
1、將安裝光盤放入光驅,安裝程序自動運行,并出現安裝界面。如果單擊安裝界面上的“Macromedia STUDIO MX安裝”,那么將會安裝其下方所列出的軟件。所有的安裝會自動完成。
2、單擊Dreamweaver MX,開始安裝過裝過程.先是出現解壓縮文件窗口,等待一會兒,便會出現安裝向導對話框。單擊“下一步”按鈕,繼續安裝過程。
3、出現“選擇目的地位置”對話框,默認的盤是C盤,如果想安裝到不同的位置,可以單擊目的文件夾右邊的“瀏覽”按鈕,并在彈出的“選擇文件夾”對話框選擇不同的文件,如要安裝在D盤則可直接將路徑中的“C:”改為“D:”。也可以在下面的“目錄”中選擇其它的文件夾,設置完后,單擊“確定”,回到“選擇目的地址”對話框,單擊“下一步”繼續。
4、而后會出現“默認編輯器”的對話框,默認為全選。如果希望讓Dreamweaver MX成為下面所列文件類型的默認編輯器,那么可以在這里做選擇。選擇完畢,單擊“下一步”按鈕。
5、出現“開始復制文件”對話框,單擊“下一步”安裝程序開始復制文件,過幾分鐘后,安裝結束,單擊“結束”按鈕,結束安裝。
1.5.2 軟件啟動
軟件安裝完畢后,我們就可以使用它了。安裝程序已經自動在“開始”菜單中加入了快捷方式。
單擊“開始”菜單,將鼠標指針依次指向“程序”|“Macromedia”|“Macromedia MX”,并在上面單擊鼠標左鍵。
1.5.3 創建快捷方式 使用“開始”菜單啟動程序的過程比較煩瑣。可以在Windows桌面或快速啟動欄上創建快捷方式,這樣可以快速的啟動程序。
具體實現方法是:在“開始”菜單中找到相應程序的快捷方式,不過這是不要用鼠標左鍵單擊,而是用右鍵按住向桌面拖動,然后松開右鍵,會出現一個快捷菜單,在其中可以選擇不同的命令,比如選擇“在當前位置創建快捷方式”或“復制到當前位置”。
這樣以后在運行程序時,就方便快捷的多了。
1.6 制作網頁前的準備
電腦必備:
電腦速度夠快,最好能夠上網。操作系統:Windows 98/NT/Me/2000/XP.軟件可選:
其它軟件:看圖軟件ACDSee、圖像處理軟件Photoshop、上傳工具CuteFTP、Fireworks、動畫軟件Flash等。
1.7 Dreamweaver MX的操作環境
我們將工作界面分成了“標題欄”、“菜單欄”、“快捷工具欄”、“屬性面板”、“浮動控制面板”5個部分來分別介紹。
1.7.1 標題欄 Dreamweaver MX的“標題欄”中將顯示文字“Macromedia Dreamweaver MX”如果打開網頁的話,在后面還會顯示該網頁的一些信息,如網頁標題、所在位置及網頁名稱,右邊有三個鈕,分別對應Dreamweaver MX的最大化最小化和關閉的操作。
1.7.2 菜單欄
“標題欄”下面就是“菜單欄”,欄中提供了“文件”、“編輯”、“查看”、“插入”、“修改”、“文本”、“站點”、“窗口”、“幫助”10項菜單。單擊其中任意一項菜單,隨即就會出現一個下拉式指令菜單。有些指令的右邊會有鍵盤的代碼,這是該指令的快捷鍵,熟練使用快捷鍵將會有助于提高工作效率。有些指令的右邊會有一個小黑三角的標記,它代表該指令還包含下一級的指令,鼠標停留片刻即可顯示。
1.7.3 快捷工具欄
“快捷工具欄”指的是“菜單欄”下邊的3排按鈕,選擇菜單“查看/工具欄”,勾選里面的“插入”、“文檔”和“標準”3項,完整的快捷工具欄就顯現出來了。
1.7.4 屬性面板
在網頁編輯窗口的下面還有一個面板,它是有名的“屬性面板”,它在這個軟件中起到舉足輕重的作用。
屬性面板顧名思義,就是顯示,調整屬性的面板,根據鼠標所選中對象的不同,“屬性面板”在界面上也會有所差異,用戶可以分別對不同的對象進行調整。
第二章 網站制作實戰
2.1 站點
2.1.1 創建站點
要制作一個網站,第一步操作都是一樣的,就是要創造一個“站點”,這樣可以使整個網站的脈絡結構清晰地展現在面前,避免了以后再進行紛雜的管理。
從菜單中選擇“站點/管理站點”在彈出的對話框中選擇“新建”,之后再選擇其中的“站點”,再次彈出一個對話框,在文本框中輸入自己已經企化好的網站名稱“追夢人”。
填好后,單擊“下一步”,進入下一個步驟。由于我要做的是一個靜態的網頁,所以選擇上面的一項“否,我不想使用服務器技術。” 單擊“下一步”,進入下一個步驟。
在此選項中有兩個選擇,選擇推薦的“編輯我的計算機上的本地副本,完成后再上傳到服務器”。底下的文本框允許在本地磁盤上指定一個文件夾,Dreamweaver將在其中儲存站點文件的本地副本。單擊該文本框后面的文件夾圖標,新建并指定一個空的文件夾“E:/ding”。之后單擊“下一步“,進入下一個步驟。
這一步是如何設置連接到遠程服務器,彈出式菜單中有6中選擇,這里選擇“無”。而后“下一步”再“完成”,即可。
2.1.2 創建站點內容
站點創建完成后,就可以創建Web頁來填充站點了。在“右側浮動面板組”中選擇“文件/文件”面板,此時整個網站中沒有任何內容。用鼠標右擊面板中的本地根目錄文件夾。在彈出的菜單中選擇“新建文件”,新建一個文件后將其命名為“index.htm(或index.html),它就是未來的首頁。
由于“追夢人”網站分為“平面設計”、“動畫制作”、“網文精品”、“經典回顧”、“個人說明“這五個大欄目,所以繼續用鼠標右擊右側,在彈出的菜單中選擇第二項“New Folder(新建文件夾)”。執行五次操作,新建五個文件夾,并把它們重命名為graph、anim、books、music、letter,分別對應上面的五個大欄目。存放它們各自的內容。之后再次新建1個文件夾,命名為images,用來存放“所有的圖象文件”的內容。
之后在個欄目的文件夾里還要建立想相應的欄目網頁。
2.2 首頁
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插入多媒體
在Dreamweaver MX2004中,除了之前講到的可以插入“圖像”外,還可插入動畫、聲音、視頻等媒體元素,如Flash,Shockwave,Applets,ActieX及格Midi聲音文件等,并且還可以在Dreamweaver自身內插入Macromedia Flash MX2004按鈕和文本對象,以及進行相關的后期處理和添加設計備注等操作。
在Dreamweaver MX 2004文檔中,可以插入媒體文件包括Flash Shockwave影片、QuickTime、AVI java、applet Active X控件以及各種格式的音頻文件。要在瀏覽器中播放放Flash 動畫,必須在瀏覽器中集成“Flash 播放器(Flash Player)”。其中,Internet Explorer通過ActiveX控制來實現,Netscape Navigator則是通過相應的插件來實現的。在最新的Netscape Navigator和Internet Explorer瀏覽器中,均已集成了 Flash動畫播放功能。操場作步驟:
步驟1 將光標停留在要插入Flash的位置,然后單擊菜單欄下面“插入快捷欄”的下拉列表,選擇其中的“常用”分類,右側將會顯示該類中可以插入的對象快捷按鈕。左起第6個即為“媒體”按鈕,單擊它右側的下拉列表,選擇第1項Flash圖標。
步驟2 在彈出的對話框中選擇擴展名為swf 的Flash文件,即可將其插入到Dreamwe aver的“網頁編輯窗口”中,可以看到,在這個窗口中Flash文件的大小。在這里我的主頁插入的一個動畫,如圖所示:
2.2.6插入文本 文字是人類語言最基本的表達方式,在網頁中,文本內容也可以說是重要的組成部分,一個網站成功與否,它是最關鍵的因素。在這最關鍵的因素。可豐富網站的文字內容,并以最最美觀、最整齊的方式放入到網頁中。插入文本的兩種方式
網頁中需要大量的文本,我們或以通過以下兩種方式插入它們。
一種是在網頁編輯窗口中直接用鍵盤敲入文本。這可以算是最基本的輸入方式了,和一些文本編輯軟件(如Microsoft Word)的使用方法一樣,選擇好習慣的輸入法,就可以運指如飛了。
另一種是復制文本的方式。有些讀者可能不喜歡使用Dreamweaver MX2004來進行打字的工作,而更習慣在專門的文本編輯軟件中快速打字,如Microsoft Word和 Windows自帶的記事本等,又或者讀者已經準備好了要放入網頁的文本的電子版本,那么我們就可以直接使用Dreamweaver的文本復制功能,將大段的文本內容拷貝到網頁的編輯窗口來進行排版的工作,具體步驟如下。
打開文本編輯軟件(如Microsoft Word),選中要復制的文本,它們將反白顯示,執行菜單“編輯/復制”命令或直接用快捷鍵Ctrl+C,之后切換回Dreamweaver,將光標停留在插入文本的位置,執行主菜單“編輯/粘貼”命令或直接使用快捷鍵Ctrl+v,即可將大段的文本快速粘貼到網頁中。
這在我的“網文精品”中用到很多,全部是在word軟件中排好ctrl+c,然后點擊要粘貼的位置,crtl+v到Dreamweaver即可。
2.3創建其它網頁
還有其它的幾個網站與主頁的制作相同,一個網頁是圖象和文字的組合。“平面設計”中的圖象插入和前面的介紹相似,并可以在屬性攔中調節圖象的大小。在Dreamwerver中常常會用到Firework、Flash,它們是相輔相成,在主頁中的主體部分就是用Firework,如圖所示:
在“個人說明”中也用到這點,首先定好需要尺寸,在屬性中設好背景,顏色等等,插入圖象,輸入文字,也word里的操作雷同。
第三章 建立網頁鏈接
網站實際上是由很多網頁組成的,那么網頁之間是如何聯系的呢?這就是本章要講的內容----網頁的“鏈接”。
“鏈接”,又稱“超鏈接"(Hyperlink),它作為網頁的橋梁,起著相當重要的作用。網頁中的很多對象都可以加入“鏈接”屬性。在Dreamweaver MX2004中,如果以“鏈接”的媒介來劃分的話,則“鏈接”可以分為“文字鏈接”、“圖像鏈接”、“圖像地圖鏈接”、“內部鏈接和外部鏈接”、“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.3E –Mail的鏈接
E-Mail鏈接,是指當瀏覽者單擊該鏈接之后,不是打開一個網頁文件,而是啟動用戶的E-Mail客戶端軟件(如Outlook Express),并打開一個空白的新郵件,供瀏覽者撰寫內容來與網站聯系人聯系,這是一種最方便的互動方式。結合“個人說明”網頁,建立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系統將啟動自帶的媒體播放器Windows Media Player 來播放該視頻。操作步驟
步驟1 先將視頻文件olympus.wmv通壓縮成olympus.rar文件,放入站點的media文件夾下。
步驟2 將文件路徑輸入至“鏈接”文本框中。
步驟3 保存網頁,按下F12預覽,在瀏覽器中單擊“下載精彩廣告視頻”鏈接文本,會彈出“文本下載”選擇框,單擊其中的“保存”按鈕。
步驟4 在“另存為”對框中選擇保存到本地計算機中的位置,實例中為“經典回顧”文件夾。之后單擊“保存”按鈕,壓縮文件即保存到該位置中。至此,“文件下載鏈接”便制作完成了。讀者可以打開“我的文檔”文件夾,解壓縮olympus.rar文件,隨時欣賞下載影片。
本設計中未用到此鏈接,在此只作簡單介紹。
3.5在HTML語言中建立網頁鏈接
3.5.1文字鏈接
在HTML語言中用超鏈接標記指向一個目標。其基本格式為: 舉個簡單的“文本鏈接”的實例,該實例相對應的HTML代碼如下所示。 a href-“index2.html”target=”-blank”>平面設計
動畫制作(原窗口,默認為空)
第三篇:個人網站的設計與實現 畢業設計(論文)
隨著國際互聯網的普及,很多人已經不滿足僅僅在Internet上的瀏覽信息,而
是希望更深入的參與其中,擁有自己的Web網站,這似乎已經成為一種潮流。如果說個
人建立網站是為了追求時尚,那么企業建立網站就是必然的選擇了。
無論是專業的,還是業余的,很多人對網頁制作頗感興趣。事實上制作一個簡單的
網頁并不困難,會使用Word的人都可以勝任。但想做出超凡脫俗的網頁就不那么容易
了,而Dreamweaver卻可以滿足你的愿望,它是Macromedia公司開發的集網頁制作和
網站管理于一身的所見即所得的網頁編輯器。
同樣出自Macromedia公司的Flash,Fireworks在制作網站的過程中起到了錦上添
花的作用,是個人網站實現的好幫手,在制作網站的時候經常會用到這些軟件。
本文有五章,我來由淺到深介紹個人網站的設計與實現。
摘
摘摘
摘
要
要要 要
在互聯網走進我們的生活之前,沒有人敢夢想擁有自己的報紙、雜志、電臺、電
視臺。除了政策上的制約外,一個人也根本沒有操作一份傳播媒體的能力。現在不同了,互聯網給我們提供了一個“表達自我”的自由天地,你可以擁有自己的新聞郵件,你可
以建立自己的個人網站。只要你辦得成功也可以吸引成千上萬的訂戶、讀者,并建立自
己在眾多參與者中的權威地位。建立個人網站的基本過程可以分為以下七個環節 : 1 了解中國網絡個人主頁研究背景與發展現狀 系統需求分析與總體設計 熟悉網站開發模式、工具及環境 把自己的作品和想要展示的內容制作成網頁。使用動態網頁技術(ASP),實現動態內容更新。認真地選取測試用例,進行交叉測試 網站的后期完善、宣傳及發展方向
其中 ,網頁制作和使用動態網頁技術(ASP)實現動態內容更新是網站開發的核心內容。
關鍵詞:網頁、制作、訪問、鏈接
Abstract
目 錄
第一章 引言
1.1 什么是Internet
1.2 Internet有哪些功能 1.3 www簡介
1.4 網頁基本構成元素
1.5 軟件的安裝與啟動
1.5.1 軟件的安裝
1.5.2 軟件的啟動
1.5.3 創建快捷方式
1.6 制作網頁前的準備
1.7 Dreamweaver的操作環境
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.3 E-Mail鏈接
3.4 文件下載鏈接
3.5 在HTML語言中建立網頁鏈接
3.5.1 文字鏈接
3.5.2 圖像鏈接
3.5.3 E-Mail鏈接
3.6.4 文件下載鏈接
第四章 結論
致 謝
參考文獻
第一章
第一章第一章
第一章
預備知識
預備知識預備知識
預備知識
1.1
InternetInternet
Internet
Internet的中文名為“國際互聯網”,又稱“因特網”。
Internet是由眾多的計算機網絡互聯而成的互聯網,它覆蓋了全世界各地,它是采
用開放系統協議的計算機通訊網絡。然而,Internet不僅僅是計算機的互聯網,它還是
全球最大的信息資源寶庫,它提供了包括科研、教育、文化娛樂、商業和信息交流等各
種各樣的服務,使得世界范圍內的人與人之間的交流在時間和空間上變的更小了。
要了解Internet,就必須先了解局域網。我們可以將同一地點的許多計算機使用網
線連接在一起,構成一個高效率的計算機網絡,所有處于網絡內的終端機或電腦都能享
受網絡內所有的資源,比如程序,圖文資料等。這種計算機網絡因為一般都局限在一定
區域中,我們稱之為“局域網”(Local Area Network,簡稱LAN),它是在日常工作中
用得最多的一種小型計算機網絡。局域網所覆蓋的地理范圍比較小,通常不超過幾十公
里,甚至只在同一座建筑物內或者鄰近的幾座建筑內。像常見的校園網,一座寫字樓內
部的網絡等都屬于局域網。
而Internet則不是指單個區域范圍內的網絡,而是指將全世界的各中不同類型的
計算機網絡連接起來的一個全球性的網絡。Internet上有取之不盡,用之不竭的信息資
源。對于Internet中各種各樣的信息,所有的人都可以通過網絡的連接來共享和使用。1.2
1.2 Internet有那些功能
Web頁瀏覽:這是目前利用最廣泛、最直接的互聯網服務,通過瀏覽WWW(萬維網)
中的網頁,可以了解世界各地的新聞,查看最新的股市行情,最新的娛樂動態、科技發
明,找到眾多的就業信息??幾乎想找到什么樣的信息,就有什么信息。正是有了WWW、Internet才會變得如此豐富多彩,才能走進千家萬戶。信息發布:通過Internet,不僅可以瀏覽別人發布在Web頁上的信息,也可以將
自己要發布的信息制作成Web頁,也即網頁,然后發布到Internet上,供全世界的人
瀏覽。
電子郵件:不同于傳統郵件,電子郵件(E-mail)通過Internet傳輸,寫信,發信,收信都在計算機上完成,一封電子郵件最短在一秒之內就可以發送出去,其效率是傳統
郵件無法比擬的。而且發送與接收電子郵件幾乎是免費的,所以比傳統郵件既節省時間
又經濟的多。
網上聊天:通過聊天軟件(如QQ、ICQ等)或不同網站的聊天室,可以和世界各
地的網友聊天。網友可能是遠在天邊的異國朋友,也可能是與你一起工作的餓同事,或
者是一起生活的家人,在這里沒有年齡、性別、身份、職業、國籍、膚色的限制,完全
突破了交友的傳統方式,人們可通過Internet互相了解對方,進行各種各樣的交流。
電子商務:現在網上交易已經成為現實,網上購物、網上商品銷售、網上拍賣、企業級電子商務、網上貨幣支付等電子商務活動已經搞的有聲有色,幾乎所有的專家都
預測,在未來的幾年內,電子商務會飛速發展。在不久的將來,您可以做在電腦前進行
各種各樣的商務活動。
網絡游戲:通過Internet,可以與全世界的玩家一起進行游戲對戰,也可以協同
作戰。網絡游戲已經成為信息產業全新的經濟增長點,每年都為開發商帶來巨額的利潤。
通過網絡游戲,可以充分享受Internet給我們帶來的樂趣。
網絡電話:網絡電話也稱IP電話。它采用Internet技術,利用專門的網絡電話
軟件,只需支付非常低廉的話費就可通話。Internet在電信市場上的應用將越來越廣泛。
1.3 WWW的簡介
WWW的全稱為World Wide Web,含義是“環球網”,又稱“萬維網”、3W、Web。
WWW是一個基于超文本(Hypertext)方式的信息檢索服務工具。我們上網瀏覽到的網頁就是這樣的超文本,也就是HTML(Hypertext Mark-up Language,超文本標記語言)文件,這些網頁文件被放置到WWW服務器上,并且都有一定的地址。當我們想瀏覽某個網站時,首先要在電腦上安裝瀏覽器,如Internet Explorer或Netscape,然后在瀏覽器中輸
入網站的地址(網址),就可以進入網站進行瀏覽。在這些網頁中,都有超連接,當將
鼠標指針移動到某個地方(如文本或圖象)時,鼠標指針就會變成一個小手形形狀,單
擊它就可以連接到另個網頁中,從而使得瀏覽者能在不同的信息之間跳轉,我們之所以
能在Internet的海洋中穿梭自如,正是超連接的功勞。
WWW 為我們帶來的是世界范圍的超級文本服務:只須操縱鼠標,就可以通過Inter net從世界各地調來你所希望的文本、圖像、動畫和聲音等信息。通過使用WWW,一個
不熟悉網絡使用的人也可以成為Internet的行家。
1.4網頁基本構成元素
要學會制作網頁,首先需要了解網頁都是由什么元素構成的。
文字:文本是構成網頁的基本元素。一個最簡單的網頁可以只有幾行文本。
圖片:正是有個各種美麗的圖片,網頁才變得多姿多彩。
動畫:如今,網頁上的動畫越來越多,最常用的有GIF動畫、Flash動畫等。
超連接:如上所述,超連接幾乎是必不可少的。一個沒有超連接的網頁,就如同汪
洋大海中的一座孤島,失去了與外界的一切聯系。
其它元素:還可以在網頁中添加聲音、視頻等元素。
1.5軟件的安裝與啟動
要使用網站設計軟件,自然先要將這些軟件安裝到自己的電腦中。安裝完畢,還需
要如何啟動,如何創建快捷方式。下面就讓我們來詳細地看一看具體的操作步驟。
1.5.1軟件的安裝
安裝之前,需要先了解軟件對系統的要求。以Windows為例,系統要求如下:
Intel Pentium II處理器或等效處理器,主頻300MHz或更高。
Windows 98Windows 2000Windows NT(具有Service Pack 3 或更高版本)、Windo
ws Me或Windows XP.Netscape Navigator 4.0版或更高版本或Microsoft Internet Explorer.96MB的可用內存(RAM),建議采用128MB內存。
分辨率可達 800×600像素的256色顯示器(建議顏色為百萬顏色,分辨率達到102
4×768像素)。
CD-ROM 驅動器。
檢查一下您的計算機,看是否具備了以上條件。如果具備,將“Macromedia Stud
io MX”程序會自動運行。如果不能自動運行,可以找到光盤放入光驅,安裝程序會自
動運行。可以找到光盤中的“Install Macromedia Studio MX”程序或“Autorun”程
序并雙擊運行。
Dreamweaver的安裝比較容易,幾乎可以自動完成。下面簡要說明一下安裝步驟。
操作步驟:
1、將安裝光盤放入光驅,安裝程序自動運行,并出現安裝界面。如果單擊安裝界面
上的“Macromedia STUDIO MX安裝”,那么將會安裝其下方所列出的軟件。所有的安裝
會自動完成。
2、單擊Dreamweaver MX,開始安裝過裝過程.先是出現解壓縮文件窗口,等待一會兒,便會出現安裝向導對話框。單擊“下一步”按鈕,繼續安裝過程。
3、出現“選擇目的地位置”對話框,默認的盤是C盤,如果想安裝到不同的位置,可以單擊目的文件夾右邊的“瀏覽”按鈕,并在彈出的“選擇文件夾”對話框選擇不同 的文件,如要安裝在D盤則可直接將路徑中的“C:”改為“D:”。也可以在下面的“目
錄”中選擇其它的文件夾,設置完后,單擊“確定”,回到“選擇目的地址”對話框,單擊“下一步”繼續。
4、而后會出現“默認編輯器”的對話框,默認為全選。如果希望讓Dreamweaver M
X成為下面所列文件類型的默認編輯器,那么可以在這里做選擇。選擇完畢,單擊“下
一步”按鈕。
5、出現“開始復制文件”對話框,單擊“下一步”安裝程序開始復制文件,過幾
分鐘后,安裝結束,單擊“結束”按鈕,結束安裝。
1.5.2 軟件啟動
軟件安裝完畢后,我們就可以使用它了。安裝程序已經自動在“開始”菜單中加入
了快捷方式。
單擊“開始”菜單,將鼠標指針依次指向“程序”|“Macromedia”|“MacromediaMX”,并在上面單擊鼠標左鍵。
1.5.3 創建快捷方式
使用“開始”菜單啟動程序的過程比較煩瑣。可以在Windows桌面或快速啟動欄上
創建快捷方式,這樣可以快速的啟動程序。
具體實現方法是:在“開始”菜單中找到相應程序的快捷方式,不過這是不要用
鼠標左鍵單擊,而是用右鍵按住向桌面拖動,然后松開右鍵,會出現一個快捷菜單,在
其中可以選擇不同的命令,比如選擇“在當前位置創建快捷方式”或“復制到當前位置”。
這樣以后在運行程序時,就方便快捷的多了。
1.6 制作網頁前的準備
電腦必備:
電腦速度夠快,最好能夠上網。
操作系統:Windows XP.軟件可選: 其它軟件:看圖軟件美圖秀秀 圖像處理軟件Photoshop、上傳工具CuteFTP
1.7 Dreamweaver MX的操作環境
我們將工作界面分成了“標題欄”、“菜單欄”、“快捷工具欄”、“屬性面板”、“浮動控制面板”5個部分來分別介紹。
1.7.1 標題欄
Dreamweaver MX的“標題欄”中將顯示文字“Macromedia Dreamweaver MX”如果
打開網頁的話,在后面還會顯示該網頁的一些信息,如網頁標題、所在位置及網頁名稱,右邊有三個鈕,分別對應Dreamweaver MX的最大化最小化和關閉的操作。
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(或i
ndex.html),它就是未來的首頁。
由于“追夢人”網站分為“平面設計”、“動畫制作”、“網文精品”、“經典回
顧”、“個人說明“這五個大欄目,所以繼續用鼠標右擊右側,在彈出的菜單中選擇第
二項“New Folder(新建文件夾)”。執行五次操作,新建五個文件夾,并把它們重命
名為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)是文檔的主要部分,也是包含文本和圖像等的可見部分。頭內容(he
ad)是除文檔標題外的不可見部分,包含有文檔類型、語言編碼、搜索引擎的關鍵的關鍵字和內容指示器以及樣式定義等重要信息,這些元器并不是每個頁面都需要的,例如,可以僅為主頁提供關鍵字。
下面就以首頁為例,說明怎樣插入較常用的頭(head)內容。
單擊“菜單攔”下面“插入快捷”的下拉列表,選擇其中的HTML類,此時右側將
會顯示該類中可以插入的對象快捷按鈕,再次單擊第2個按鈕“文件頭”旁邊的下拉箭
頭,會彈出菜單,該項列出的便是即將插入的頭內容。
2.2.4 插入圖像
圖像是網頁中不可或缺的組成成份,恰當地使用圖像,可以使網站充滿生活生命力
與說服力,吸引更多的瀏覽者,加深他們欣賞你網站的意愿。
另一方面,網頁的容量大小是網站成功與否的一大關鍵因素。由于網絡在傳輸上 的限制,導致了下載的速度不可能太快,因此,網頁的大小就不能太大,其中關鍵就在
于圖像的大小了,否則瀏覽者會失去等待的耐心,無論你的網站多么精彩也無濟于事了。所以,在網面容量大小的問題上一定要重視。下面就來詳細介紹對網頁圖像進行處理的
操作步驟,以使得它們在保持圖形美麗與網站風格搭配的基礎上,圖片文件能夠變的更
小。
1、首先將光標停留在要插入圖像的位置,然后單擊“菜單欄”下面“插入快健欄” 的下拉表,選擇其中的“常用”類,則右側將會顯示該類中可以插入的對象快鍵按鈕。
左起第5個即為“圖像:圖像”按鈕,單擊它右側的下拉列表,選擇第1項“圖像”。
2、隨即彈出“選擇圖像源文件”對話框。從計算機磁盤中選擇想要插入的圖像文件,或在URL編輯框中輸入圖像的路徑和名稱。下面的“相對于”下拉表框中,可選擇文件
URL地址的類型,如果選擇“文檔”選項,表示圖像地址相對于當前文檔;如果選擇“站
點根目錄”選項,表示地址相對于根目錄。在這里我要插入的是網站標志logo,插入l
ogo圖象,如圖所示:
最后單擊“確定”按鈕,即可完成插入圖像的操作。2.2.5插入多媒體
在Dreamweaver MX2004中,除了之前講到的可以插入“圖像”外,還可插入動畫、聲音、視頻等媒體元素,如Flash,Shockwave,Applets,ActieX及格Midi聲音文件等,并且還可以在Dreamweaver自身內插入Macromedia Flash MX2004按鈕和文本對象,以
及進行相關的后期處理和添加設計備注等操作。
在Dreamweaver MX 2004文檔中,可以插入媒體文件包括Flash Shockwave影片、QuickTime、AVI java、applet Active X控件以及各種格式的音頻文件。
要在瀏覽器中播放放Flash 動畫,必須在瀏覽器中集成“Flash 播放器(Flash Play er)”。其中,Internet Explorer通過ActiveX控制來實現,Netscape Navigator則
是通過相應的插件來實現的。在最新的Netscape Navigator和Internet Explorer瀏
覽器中,均已集成了 Flash動畫播放功能。操場作步驟:
步驟1 將光標停留在要插入Flash的位置,然后單擊菜單欄下面“插入快捷欄”的下
拉列表,選擇其中的“常用”分類,右側將會顯示該類中可以插入的對象快捷
按鈕。左起第6個即為“媒體”按鈕,單擊它右側的下拉列表,選擇第1項Fl
ash圖標。
步驟2 在彈出的對話框中選擇擴展名為swf 的Flash文件,即可將其插入到Dreamwe
aver的“網頁編輯窗口”中,可以看到,在這個窗口中Flash文件的大小。在
這里我的主頁插入的一個動畫,如圖所示:
2.2.6插入文本
文字是人類語言最基本的表達方式,在網頁中,文本內容也可以說是重要的組成
部分,一個網站成功與否,它是最關鍵的因素。在這最關鍵的因素。可豐富網站的文字
內容,并以最最美觀、最整齊的方式放入到網頁中。
插入文本的兩種方式
網頁中需要大量的文本,我們或以通過以下兩種方式插入它們。
一種是在網頁編輯窗口中直接用鍵盤敲入文本。這可以算是最基本的輸入方式了,和一些文本編輯軟件(如Microsoft Word)的使用方法一樣,選擇好習慣的輸入法,就
可以運指如飛了。
另一種是復制文本的方式。有些讀者可能不喜歡使用Dreamweaver MX2004來進行
打字的工作,而更習慣在專門的文本編輯軟件中快速打字,如Microsoft Word和 Wind
ows自帶的記事本等,又或者讀者已經準備好了要放入網頁的文本的電子版本,那么我
們就可以直接使用Dreamweaver的文本復制功能,將大段的文本內容拷貝到網頁的編輯
窗口來進行排版的工作,具體步驟如下。
打開文本編輯軟件(如Microsoft Word),選中要復制的文本,它們將反白顯示,執行菜單“編輯/復制”命令或直接用快捷鍵Ctrl+C,之后切換回Dreamweaver,將光標
停留在插入文本的位置,執行主菜單“編輯/粘貼”命令或直接使用快捷鍵Ctrl+v,即可
將大段的文本快速粘貼到網頁中。
這在我的“網文精品”中用到很多,全部是在word軟件中排好ctrl+c,然后點擊要
粘貼的位置,crtl+v到Dreamweaver即可。
2.3創建其它網頁
還有其它的幾個網站與主頁的制作相同,一個網頁是圖象和文字的組合。“平面設計”中的圖象插入和前面的介紹相似,并可以在屬性攔中調節圖象的大小。
在Dreamwerver中常常會用到Firework、Flash,它們是相輔相成,在主頁中的主體部
分就是用Firework,如圖所示:
在“個人說明”中也用到這點,首先定好需要尺寸,在屬性中設好背景,顏色等
等,插入圖象,輸入文字,也word里的操作雷同。
3.建立網頁鏈接
網站實際上是由很多網頁組成的,那么網頁之間是如何聯系的呢?這就是本章要講 的內容----網頁的“鏈接”。“鏈接”,又稱“超鏈接"(Hyperlink),它作為網頁的橋梁,起著相當重要的作用。網頁中的很多對象都可以加入“鏈接”屬性。在Dreamweaver MX2004中,如果以“鏈
接”的媒介來劃分的話,則“鏈接”可以分為“文字鏈接”、“圖像鏈接”、“圖像地圖鏈接”、“內部鏈接和外部鏈接”、“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
3.23.2
3.2圖像鏈接
圖像鏈接圖像鏈接
圖像鏈接
“圖像”也是常被使用的鏈接媒體,它和“文字鏈接”非常相似。為圖像加入鏈接,首
先應該在網頁中插入“圖像”,有關插入“圖像”或“導航條”按鈕的內容,接下來以
我的網站“追夢人“為例,講解如何建立“圖像鏈接”。
操作步驟
步驟1 首先仍然要準備好已經制作完成的首頁和各個欄目的頁面(假設除了“鏈接”,其他內容都已經制作完成了),該網站包含6個欄目,下面我們就動手為這6個欄目分
別制作它們的鏈接。
步驟2 在Dreamweaver中打開網站的首頁,之后選取要制作“鏈接”的圖像。實例中先
為第3個欄目“動畫制作”設置鏈接,因此選中包含“動畫制作”4個字的圖像。步驟3 觀察“屬性面板”,在“鏈接”文本框中輸入鏈接的文字地址。可以使用之前講
過的“指向文件”和“選擇文件”的方法。
步驟4 如果有需要,可以在“目標”下拉列表中選擇“鏈接”網頁顯示的窗口方式,分
別為-blank、-parent、-self或 top。實例中使用了默認出的保留空白選項的方式。
步驟5 另外,讀者還可以為圖像增加“替代”文本。實例中為第1個欄目增加欄目名稱 的“替代”文本。
步驟6 至此,第1個欄目的圖像鏈接就制作完畢了,按下Ctrl+S保存網頁,再按下F1 2預覽,測試一下,將鼠標放在“動畫制作”4個文字上時將變成手形,同時瀏覽器窗
口下面的狀態欄中會顯示出鏈接到的網頁的地址,并且會顯示出“替代”文本“動畫制
作”,單擊文字,頁面會立即跳轉到第3個欄目中,這表示鏈接已經制作成功了。
步驟7 同理,按照以上步驟,再為其它幾幅圖像制作指向對應欄目的鏈接。
步驟8 在欄目頁面中制作“返回首頁”的鏈接,使得單擊后可以跳轉回首頁,其制作方
法不變。
至此,整個“圖像鏈像”的實例就全部完成了。
3.3E
3.3E 3.3E
3.3E –
––
MailMail
Mail的鏈接 的鏈接的鏈接 的鏈接
E-Mail鏈接,是指當瀏覽者單擊該鏈接之后,不是打開一個網頁文件,而是啟動用戶的
E-Mail客戶端軟件(如Outlook Express),并打開一個空白的新郵件,供瀏覽者撰寫
內容來與網站聯系人聯系,這是一種最方便的互動方式。
結合“個人說明”網頁,建立E-Mail鏈接的步驟如下所述。
操作步驟 步驟1 將光標停留在頁面右下角要插入E-mail鏈接的位置。步驟2 選擇“插入快捷欄”中的“常用”分類,單擊左側第2個“電子郵件鏈接”按鈕。
步驟3 在彈出的“電子郵件鏈接”對話框中有兩個輸入項,分別是“文本”和“E-Mai
l”。在“文本”項中輸入鏈接的文字,中文、英文均可,在E-Mail項中輸入網站聯
系有的電子郵件地址,如實例中的 ding_zhuimeng123@163.net。
步驟4 單擊“確定”按鈕,具有“E-Mail鏈接”屬性的文本就ding_zhuimeng123@163.net。插入到光標所在位置了,按下 Ctrl+S保存網頁,再按下F12預覽查看實際效果。
上面的方法只適用于文本的“E-Mail鏈接”,如果想在其它的對象(如圖像)上也加入
這種鏈接,該怎辦呢?下面介紹第2種建立“E-Mail鏈接”的方法。
其實很簡單,與前面講過的圖像加入鏈接的方法基本一樣。先在頁面中需要的地方插入
圖像,之后選中圖像,并在“屬性面板”的“鏈接”文本框中輸入如下語句即可----ma
ilto: ding_zhuimeng123@163.net ?subject=網站的建議與第1種方法不同的是,E-Ma
il 地址前面增加了mailto:字樣。用這種方法就可以給圖像等其他對象建立“E-Mail
鏈接”了。
3.4
3.43.4
3.4文件下載鏈接
文件下載鏈接文件下載鏈接
文件下載鏈接
“文件下載鏈接”的原理很簡單,只要鏈接文件屬于瀏覽無法識別的關型,便都會使用 IE瀏覽器直接進行下載,并保存到本地計算機中。
瀏覽器無法識別的文件類型有很多,這里就介紹一個最常用的,以zip或rar為后綴名 的壓縮格式文件,這種文件可以使用主流的壓縮軟件(如winzip、winrar)來制作。下
面我們就業以實例來說明。在前面“插入多媒體”一章中,我們曾經講過直接鏈接文件的方式來插入“視頻”,即
直接在“鏈接”文本框中輸入“文件名+名后綴名”,如olympus.wmv。單日擊這個鏈接,經過數據下載后,Windows系統將啟動自帶的媒體播放器Windows Media Player 來播
放該視頻。
操作步驟
步驟1 先將視頻文件olympus.wmv通壓縮成olympus.rar文件,放入站點的media文件
夾下。
步驟2 將文件路徑輸入至“鏈接”文本框中。
步驟3 保存網頁,按下F12預覽,在瀏覽器中單擊“下載精彩廣告視頻”鏈接文本,會
彈出“文本下載”選擇框,單擊其中的“保存”按鈕。
步驟4 在“另存為”對框中選擇保存到本地計算機中的位置,實例中為“經典回顧”文
件夾。之后單擊“保存”按鈕,壓縮文件即保存到該位置中。至此,“文件下載鏈接”
便制作完成了。讀者可以打開“我的文檔”文件夾,解壓縮olympus.rar文件,隨時欣
賞下載影片。
本設計中未用到此鏈接,在此只作簡單介紹。
3.5
3.53.5
3.5在在在
在HTML
HTMLHTML
HTML語言中建立網頁鏈接
語言中建立網頁鏈接語言中建立網頁鏈接
語言中建立網頁鏈接
3.5.1
3.5.13.5.1
3.5.1文字鏈接
文字鏈接文字鏈接
文字鏈接
在HTML語言中用超鏈接標記指向一個目標。其基本格式為: 舉個簡單的“文本鏈接”的實例,該實例相對應的HTML代碼如下所示。
a href-“index2.html”target=”-blank”>平面設計(新開窗口,-blank)< /p>
動畫制作(原窗口,默認為空)
第四篇:畢業設計(論文)個人網站的設計與實現
題目:個人網站實現技術
個人網站實現技術
個人網站的設計與實現
前 言
隨著國際互聯網的普及,很多人已經不滿足僅僅在Internet上的瀏覽信息,而是希望更深入的參與其中,擁有自己的Web網站,這似乎已經成為一種潮流。如果說個人建立網站是為了追求時尚,那么企業建立網站就是必然的選擇了。
無論是專業的,還是業余的,很多人對網頁制作頗感興趣。事實上制作一個簡單的網頁并不困難,會使用Word的人都可以勝任。但想做出超凡脫俗的網頁就不那么容易了,而Dreamweaver卻可以滿足你的愿望,它是Macromedia公司開發的集網頁制作和網站管理于一身的所見即所得的網頁編輯器。
同樣出自Macromedia公司的Flash,Fireworks在制作網站的過程中起到了錦上添花的作用,是個人網站實現的好幫手,在制作網站的時候經常會用到這些軟件。
本文有五章,我來由淺到深介紹個人網站的設計與實現。
摘 要
在互聯網走進我們的生活之前,沒有人敢夢想擁有自己的報紙、雜志、電臺、電視臺。除了政策上的制約外,一個人也根本沒有操作一份傳播媒體的能力。現在不同了,互聯網給我們提供了一個“表達自我”的自由天地,你可以擁有自己的新聞郵件,你可以建立自己的個人網站。只要你辦得成功也可以吸引成千上萬的訂戶、讀者,并建立自己在眾多參與者中的權威地位。建立個人網站的基本過程可以分為以下七個環節 : 1 了解中國網絡個人主頁研究背景與發展現狀 2 系統需求分析與總體設計 3 熟悉網站開發模式、工具及環境 把自己的作品和想要展示的內容制作成網頁。5 使用動態網頁技術(ASP),實現動態內容更新。6 認真地選取測試用例,進行交叉測試 7 網站的后期完善、宣傳及發展方向
其中 ,網頁制作和使用動態網頁技術(ASP)實現動態內容更新是網站開發的核心內容。
關鍵詞:網頁、制作、訪問、鏈接 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簡介
1.4 網頁基本構成元素 1.5 軟件的安裝與啟動 1.5.1 軟件的安裝 1.5.2 軟件的啟動 1.5.3 創建快捷方式 1.6 制作網頁前的準備 1.7 Dreamweaver的操作環境 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.3 E-Mail鏈接 3.4 文件下載鏈接
3.5 在HTML語言中建立網頁鏈接 3.5.1 文字鏈接 3.5.2 圖像鏈接 3.5.3 E-Mail鏈接 3.6.4 文件下載鏈接 第四章 結論 致 謝 參考文獻
第一章 預備知識
1.1 什么是Internet Internet的中文名為“國際互聯網”,又稱“因特網”。
Internet是由眾多的計算機網絡互聯而成的互聯網,它覆蓋了全世界各地,它是采用開放系統協議的計算機通訊網絡。然而,Internet不僅僅是計算機的互聯網,它還是全球最大的信息資源寶庫,它提供了包括科研、教育、文化娛樂、商業和信息交流等各種各樣的服務,使得世界范圍內的人與人之間的交流在時間和空間上變的更小了。
要了解Internet,就必須先了解局域網。我們可以將同一地點的許多計算機使用網線連接在一起,構成一個高效率的計算機網絡,所有處于網絡內的終端機或電腦都能享受網絡內所有的資源,比如程序,圖文資料等。這種計算機網絡因為一般都局限在一定區域中,我們稱之為“局域網”(Local Area Network,簡稱LAN),它是在日常工作中用得最多的一種小型計算機網絡。局域網所覆蓋的地理范圍比較小,通常不超過幾十公里,甚至只在同一座建筑物內或者鄰近的幾座建筑內。像常見的校園網,一座寫字樓內部的網絡等都屬于局域網。
而Internet則不是指單個區域范圍內的網絡,而是指將全世界的各中不同類型的計算機網絡連接起來的一個全球性的網絡。Internet上有取之不盡,用之不竭的信息資源。對于Internet中各種各樣的信息,所有的人都可以通過網絡的連接來共享和使用。
1.2 Internet有那些功能
Web頁瀏覽:這是目前利用最廣泛、最直接的互聯網服務,通過瀏覽WWW(萬維網)中的網頁,可以了解世界各地的新聞,查看最新的股市行情,最新的娛樂動態、科技發明,找到眾多的就業信息??幾乎想找到什么樣的信息,就有什么信息。正是有了WWW、Internet才會變得如此豐富多彩,才能走進千家萬戶。信息發布:通過Internet,不僅可以瀏覽別人發布在Web頁上的信息,也可以將自己要發布的信息制作成Web頁,也即網頁,然后發布到Internet上,供全世界的人瀏覽。
電子郵件:不同于傳統郵件,電子郵件(E-mail)通過Internet傳輸,寫信,發信,收信都在計算機上完成,一封電子郵件最短在一秒之內就可以發送出去,其效率是傳統郵件無法比擬的。而且發送與接收電子郵件幾乎是免費的,所以比傳統郵件既節省時間又經濟的多。
網上聊天:通過聊天軟件(如QQ、ICQ等)或不同網站的聊天室,可以和世界各地的網友聊天。網友可能是遠在天邊的異國朋友,也可能是與你一起工作的餓同事,或者是一起生活的家人,在這里沒有年齡、性別、身份、職業、國籍、膚色的限制,完全突破了交友的傳統方式,人們可通過Internet互相了解對方,進行各種各樣的交流。
電子商務:現在網上交易已經成為現實,網上購物、網上商品銷售、網上拍賣、企業級電子商務、網上貨幣支付等電子商務活動已經搞的有聲有色,幾乎所有的專家都預測,在未來的幾年內,電子商務會飛速發展。在不久的將來,您可以做在電腦前進行各種各樣的商務活動。
網絡游戲:通過Internet,可以與全世界的玩家一起進行游戲對戰,也可以協同作戰。網絡游戲已經成為信息產業全新的經濟增長點,每年都為開發商帶來巨額的利潤。通過網絡游戲,可以充分享受Internet給我們帶來的樂趣。
網絡電話:網絡電話也稱IP電話。它采用Internet技術,利用專門的網絡電話軟件,只需支付非常低廉的話費就可通話。Internet在電信市場上的應用將越來越廣泛。
1.3 WWW的簡介
WWW的全稱為World Wide Web,含義是“環球網”,又稱“萬維網”、3W、Web。WWW是一個基于超文本(Hypertext)方式的信息檢索服務工具。我們上網瀏覽到的網頁就是這樣的超文本,也就是HTML(Hypertext Mark-up Language,超文本標記語言)文件,這些網頁文件被放置到WWW服務器上,并且都有一定的地址。當我們想瀏覽某個網站時,首先要在電腦上安裝瀏覽器,如Internet Explorer或Netscape,然后在瀏覽器中輸入網站的地址(網址),就可以進入網站進行瀏覽。在這些網頁中,都有超連接,當將鼠標指針移動到某個地方(如文本或圖象)時,鼠標指針就會變成一個小手形形狀,單擊它就可以連接到另個網頁中,從而使得瀏覽者能在不同的信息之間跳轉,我們之所以能在Internet的海洋中穿梭自如,正是超連接的功勞。
WWW 為我們帶來的是世界范圍的超級文本服務:只須操縱鼠標,就可以通過Internet從世界各地調來你所希望的文本、圖像、動畫和聲音等信息。通過使用WWW,一個不熟悉網絡使用的人也可以成為Internet的行家。
1.4網頁基本構成元素
要學會制作網頁,首先需要了解網頁都是由什么元素構成的。
文字:文本是構成網頁的基本元素。一個最簡單的網頁可以只有幾行文本。
圖片:正是有個各種美麗的圖片,網頁才變得多姿多彩。
動畫:如今,網頁上的動畫越來越多,最常用的有GIF動畫、Flash動畫等。
超連接:如上所述,超連接幾乎是必不可少的。一個沒有超連接的網頁,就如同汪洋大海中的一座孤島,失去了與外界的一切聯系。
其它元素:還可以在網頁中添加聲音、視頻等元素。
1.5軟件的安裝與啟動 要使用網站設計軟件,自然先要將這些軟件安裝到自己的電腦中。安裝完畢,還需要如何啟動,如何創建快捷方式。下面就讓我們來詳細地看一看具體的操作步驟。
1.5.1軟件的安裝
安裝之前,需要先了解軟件對系統的要求。以Windows為例,系統要求如下: Intel Pentium II處理器或等效處理器,主頻300MHz或更高。
Windows 98Windows 2000Windows NT(具有Service Pack 3 或更高版本)、Windows Me或Windows XP.Netscape Navigator 4.0版或更高版本或Microsoft Internet Explorer.96MB的可用內存(RAM),建議采用128MB內存。
分辨率可達 800×600像素的256色顯示器(建議顏色為百萬顏色,分辨率達到1024×768像素)。CD-ROM 驅動器。
檢查一下您的計算機,看是否具備了以上條件。如果具備,將“Macromedia Studio MX”程序會自動運行。如果不能自動運行,可以找到光盤放入光驅,安裝程序會自動運行。可以找到光盤中的“Install Macromedia Studio MX”程序或“Autorun”程序并雙擊運行。
Dreamweaver的安裝比較容易,幾乎可以自動完成。下面簡要說明一下安裝步驟。
操作步驟:
1、將安裝光盤放入光驅,安裝程序自動運行,并出現安裝界面。如果單擊安裝界面上的“Macromedia STUDIO MX安裝”,那么將會安裝其下方所列出的軟件。所有的安裝會自動完成。
2、單擊Dreamweaver MX,開始安裝過裝過程.先是出現解壓縮文件窗口,等待一會兒,便會出現安裝向導對話框。單擊“下一步”按鈕,繼續安裝過程。
3、出現“選擇目的地位置”對話框,默認的盤是C盤,如果想安裝到不同的位置,可以單擊目的文件夾右邊的“瀏覽”按鈕,并在彈出的“選擇文件夾”對話框選擇不同的文件,如要安裝在D盤則可直接將路徑中的“C:”改為“D:”。也可以在下面的“目錄”中選擇其它的文件夾,設置完后,單擊“確定”,回到“選擇目的地址”對話框,單擊“下一步”繼續。
4、而后會出現“默認編輯器”的對話框,默認為全選。如果希望讓Dreamweaver MX成為下面所列文件類型的默認編輯器,那么可以在這里做選擇。選擇完畢,單擊“下一步”按鈕。
5、出現“開始復制文件”對話框,單擊“下一步”安裝程序開始復制文件,過幾分鐘后,安裝結束,單擊“結束”按鈕,結束安裝。
1.5.2 軟件啟動
軟件安裝完畢后,我們就可以使用它了。安裝程序已經自動在“開始”菜單中加入了快捷方式。
單擊“開始”菜單,將鼠標指針依次指向“程序”|“Macromedia”|“Macromedia MX”,并在上面單擊鼠標左鍵。
1.5.3 創建快捷方式 使用“開始”菜單啟動程序的過程比較煩瑣。可以在Windows桌面或快速啟動欄上創建快捷方式,這樣可以快速的啟動程序。
具體實現方法是:在“開始”菜單中找到相應程序的快捷方式,不過這是不要用鼠標左鍵單擊,而是用右鍵按住向桌面拖動,然后松開右鍵,會出現一個快捷菜單,在其中可以選擇不同的命令,比如選擇“在當前位置創建快捷方式”或“復制到當前位置”。
這樣以后在運行程序時,就方便快捷的多了。
1.6 制作網頁前的準備
電腦必備:
電腦速度夠快,最好能夠上網。操作系統:Windows 98/NT/Me/2000/XP.軟件可選:
其它軟件:看圖軟件ACDSee、圖像處理軟件Photoshop、上傳工具CuteFTP、Fireworks、動畫軟件Flash等。
1.7 Dreamweaver MX的操作環境
我們將工作界面分成了“標題欄”、“菜單欄”、“快捷工具欄”、“屬性面板”、“浮動控制面板”5個部分來分別介紹。
1.7.1 標題欄 Dreamweaver MX的“標題欄”中將顯示文字“Macromedia Dreamweaver MX”如果打開網頁的話,在后面還會顯示該網頁的一些信息,如網頁標題、所在位置及網頁名稱,右邊有三個鈕,分別對應Dreamweaver MX的最大化最小化和關閉的操作。
1.7.2 菜單欄
“標題欄”下面就是“菜單欄”,欄中提供了“文件”、“編輯”、“查看”、“插入”、“修改”、“文本”、“站點”、“窗口”、“幫助”10項菜單。單擊其中任意一項菜單,隨即就會出現一個下拉式指令菜單。有些指令的右邊會有鍵盤的代碼,這是該指令的快捷鍵,熟練使用快捷鍵將會有助于提高工作效率。有些指令的右邊會有一個小黑三角的標記,它代表該指令還包含下一級的指令,鼠標停留片刻即可顯示。
1.7.3 快捷工具欄
“快捷工具欄”指的是“菜單欄”下邊的3排按鈕,選擇菜單“查看/工具欄”,勾選里面的“插入”、“文檔”和“標準”3項,完整的快捷工具欄就顯現出來了。
1.7.4 屬性面板
在網頁編輯窗口的下面還有一個面板,它是有名的“屬性面板”,它在這個軟件中起到舉足輕重的作用。
屬性面板顧名思義,就是顯示,調整屬性的面板,根據鼠標所選中對象的不同,“屬性面板”在界面上也會有所差異,用戶可以分別對不同的對象進行調整。
第二章 網站制作實戰
2.1 站點
2.1.1 創建站點
要制作一個網站,第一步操作都是一樣的,就是要創造一個“站點”,這樣可以使整個網站的脈絡結構清晰地展現在面前,避免了以后再進行紛雜的管理。
從菜單中選擇“站點/管理站點”在彈出的對話框中選擇“新建”,之后再選擇其中的“站點”,再次彈出一個對話框,在文本框中輸入自己已經企化好的網站名稱“追夢人”。
填好后,單擊“下一步”,進入下一個步驟。由于我要做的是一個靜態的網頁,所以選擇上面的一項“否,我不想使用服務器技術。” 單擊“下一步”,進入下一個步驟。
在此選項中有兩個選擇,選擇推薦的“編輯我的計算機上的本地副本,完成后再上傳到服務器”。底下的文本框允許在本地磁盤上指定一個文件夾,Dreamweaver將在其中儲存站點文件的本地副本。單擊該文本框后面的文件夾圖標,新建并指定一個空的文件夾“E:/ding”。之后單擊“下一步“,進入下一個步驟。
這一步是如何設置連接到遠程服務器,彈出式菜單中有6中選擇,這里選擇“無”。而后“下一步”再“完成”,即可。
2.1.2 創建站點內容
站點創建完成后,就可以創建Web頁來填充站點了。在“右側浮動面板組”中選擇“文件/文件”面板,此時整個網站中沒有任何內容。用鼠標右擊面板中的本地根目錄文件夾。在彈出的菜單中選擇“新建文件”,新建一個文件后將其命名為“index.htm(或index.html),它就是未來的首頁。
由于“追夢人”網站分為“平面設計”、“動畫制作”、“網文精品”、“經典回顧”、“個人說明“這五個大欄目,所以繼續用鼠標右擊右側,在彈出的菜單中選擇第二項“New Folder(新建文件夾)”。執行五次操作,新建五個文件夾,并把它們重命名為graph、anim、books、music、letter,分別對應上面的五個大欄目。存放它們各自的內容。之后再次新建1個文件夾,命名為images,用來存放“所有的圖象文件”的內容。
之后在個欄目的文件夾里還要建立想相應的欄目網頁。
2.2 首頁
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插入多媒體
在Dreamweaver MX2004中,除了之前講到的可以插入“圖像”外,還可插入動畫、聲音、視頻等媒體元素,如Flash,Shockwave,Applets,ActieX及格Midi聲音文件等,并且還可以在Dreamweaver自身內插入Macromedia Flash MX2004按鈕和文本對象,以及進行相關的后期處理和添加設計備注等操作。
在Dreamweaver MX 2004文檔中,可以插入媒體文件包括Flash Shockwave影片、QuickTime、AVI java、applet Active X控件以及各種格式的音頻文件。要在瀏覽器中播放放Flash 動畫,必須在瀏覽器中集成“Flash 播放器(Flash Player)”。其中,Internet Explorer通過ActiveX控制來實現,Netscape Navigator則是通過相應的插件來實現的。在最新的Netscape Navigator和Internet Explorer瀏覽器中,均已集成了 Flash動畫播放功能。操場作步驟:
步驟1 將光標停留在要插入Flash的位置,然后單擊菜單欄下面“插入快捷欄”的下拉列表,選擇其中的“常用”分類,右側將會顯示該類中可以插入的對象快捷按鈕。左起第6個即為“媒體”按鈕,單擊它右側的下拉列表,選擇第1項Flash圖標。
步驟2 在彈出的對話框中選擇擴展名為swf 的Flash文件,即可將其插入到Dreamwe aver的“網頁編輯窗口”中,可以看到,在這個窗口中Flash文件的大小。在這里我的主頁插入的一個動畫,如圖所示:
2.2.6插入文本 文字是人類語言最基本的表達方式,在網頁中,文本內容也可以說是重要的組成部分,一個網站成功與否,它是最關鍵的因素。在這最關鍵的因素。可豐富網站的文字內容,并以最最美觀、最整齊的方式放入到網頁中。插入文本的兩種方式
網頁中需要大量的文本,我們或以通過以下兩種方式插入它們。
一種是在網頁編輯窗口中直接用鍵盤敲入文本。這可以算是最基本的輸入方式了,和一些文本編輯軟件(如Microsoft Word)的使用方法一樣,選擇好習慣的輸入法,就可以運指如飛了。
另一種是復制文本的方式。有些讀者可能不喜歡使用Dreamweaver MX2004來進行打字的工作,而更習慣在專門的文本編輯軟件中快速打字,如Microsoft Word和 Windows自帶的記事本等,又或者讀者已經準備好了要放入網頁的文本的電子版本,那么我們就可以直接使用Dreamweaver的文本復制功能,將大段的文本內容拷貝到網頁的編輯窗口來進行排版的工作,具體步驟如下。
打開文本編輯軟件(如Microsoft Word),選中要復制的文本,它們將反白顯示,執行菜單“編輯/復制”命令或直接用快捷鍵Ctrl+C,之后切換回Dreamweaver,將光標停留在插入文本的位置,執行主菜單“編輯/粘貼”命令或直接使用快捷鍵Ctrl+v,即可將大段的文本快速粘貼到網頁中。
這在我的“網文精品”中用到很多,全部是在word軟件中排好ctrl+c,然后點擊要粘貼的位置,crtl+v到Dreamweaver即可。
2.3創建其它網頁
還有其它的幾個網站與主頁的制作相同,一個網頁是圖象和文字的組合。“平面設計”中的圖象插入和前面的介紹相似,并可以在屬性攔中調節圖象的大小。在Dreamwerver中常常會用到Firework、Flash,它們是相輔相成,在主頁中的主體部分就是用Firework,如圖所示:
在“個人說明”中也用到這點,首先定好需要尺寸,在屬性中設好背景,顏色等等,插入圖象,輸入文字,也word里的操作雷同。
第三章 建立網頁鏈接
網站實際上是由很多網頁組成的,那么網頁之間是如何聯系的呢?這就是本章要講的內容----網頁的“鏈接”。
“鏈接”,又稱“超鏈接"(Hyperlink),它作為網頁的橋梁,起著相當重要的作用。網頁中的很多對象都可以加入“鏈接”屬性。在Dreamweaver MX2004中,如果以“鏈接”的媒介來劃分的話,則“鏈接”可以分為“文字鏈接”、“圖像鏈接”、“圖像地圖鏈接”、“內部鏈接和外部鏈接”、“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.3E –Mail的鏈接
E-Mail鏈接,是指當瀏覽者單擊該鏈接之后,不是打開一個網頁文件,而是啟動用戶的E-Mail客戶端軟件(如Outlook Express),并打開一個空白的新郵件,供瀏覽者撰寫內容來與網站聯系人聯系,這是一種最方便的互動方式。結合“個人說明”網頁,建立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系統將啟動自帶的媒體播放器Windows Media Player 來播放該視頻。操作步驟
步驟1 先將視頻文件olympus.wmv通壓縮成olympus.rar文件,放入站點的media文件夾下。
步驟2 將文件路徑輸入至“鏈接”文本框中。
步驟3 保存網頁,按下F12預覽,在瀏覽器中單擊“下載精彩廣告視頻”鏈接文本,會彈出“文本下載”選擇框,單擊其中的“保存”按鈕。
步驟4 在“另存為”對框中選擇保存到本地計算機中的位置,實例中為“經典回顧”文件夾。之后單擊“保存”按鈕,壓縮文件即保存到該位置中。至此,“文件下載鏈接”便制作完成了。讀者可以打開“我的文檔”文件夾,解壓縮olympus.rar文件,隨時欣賞下載影片。
本設計中未用到此鏈接,在此只作簡單介紹。
3.5在HTML語言中建立網頁鏈接
3.5.1文字鏈接
在HTML語言中用超鏈接標記指向一個目標。其基本格式為: 舉個簡單的“文本鏈接”的實例,該實例相對應的HTML代碼如下所示。 a href-“index2.html”target=”-blank”>平面設計
動畫制作(原窗口,默認為空)
第五篇:班級網站設計與實現
沈陽化工學院
本科畢業論文
題 目: 班級網站設計與實現 院 系: 計算機科學與技術學院 專 業: 計算機科學與技術 班 級: 計算機0802 學生姓名: 金智宇 指導教師: 張 麗
論文提交日期:2012年06月20日 論文答辯日期:2012年06月26日
I
內容摘要
隨著人類的進步,網絡技術不斷發展和計算機的普及,越來越多的人擁有自己電腦,讓人們的生活更快捷和豐富,并且豐富人類的精神世界和物質世界,讓人類最便捷地獲取信息,找到所求,讓人類的生活更快樂。
網絡的普及越來越多的學校和班級通過計算機網來管理各項事務。同時,學生與學生之間通過網絡來交流的方式也日趨頻繁。在這種潮流的趨勢下,應該采用什么樣的方式來更好的管理學生各項信息和班級各項日常事務,以及怎么是學生之間能更好的交流,成為一個問題。
班級網站設計是為了合理的利用網絡資源,提供班級與交流、有管理班級事務的網絡平臺。本網站基于B/S模式,在ASP.NET集成開發的環境下采用C#語言開發完成。本網站有班級介紹、班級相冊、同學登陸、班級留言、學習空間、休閑等模塊。網站的設計體現個性化要求。其中同學登陸模塊實現了用戶注冊、登陸與修改個人資料等功能;班級相冊實現圖片上傳和在線瀏覽功能;班級留言實現網上留言功能;提供交流平臺。本網站 促進班級學生的學習交流,實現用戶自由訪問,增加同學們的相互了解,增強班級凝聚力。
關鍵詞: 網站建設、網站運營、ASP.NET|、SQL server 2005
II
Abstract With the progress of mankind, the continuous development of network technology and the proliferation of computers, more and more people have their own computer to make people's lives more efficient and rich, and enrich our spiritual world and physical world, human access to the most convenientinformation, find what we seek to make human life happier.More and more schools and classes of the popularity of the network through the computer network to manage the affairs.At the same time, the way to communicate through the network between the students and the students become more frequent.In this fashion trends, what way should be used with good management students all the information and classes the daily affairs, and how better communication between students, become a problem.The class website is designed to use the network resources to provide classes and exchanges, to manage class affairs network platform.This site is based on B / S mode, ASP.NET integrated development environment using C # language developed.This site have a class, class album, the students landing, message classes, learning space, leisure and other modules.The site design reflects the individual requirements.Students landing module user registration, login and modify personal information;class album image upload and
III
online feature;class message Message function;provide an exchange platform.This site to promote the exchange of classes students learn to achieve the users the freedom to access, increase mutual understanding of the students, and enhance class cohesion.Key words: Website building、website operators、ASP.NET|、server 2005
IV
SQL
目錄
班級網站設計與實現.........................................................................1 一.緒論..........................................................................................1 1.1 課題背景來源和發展意義..........................................................1 1.1.1 課題背景.............................................................................1 1.1.2 課題來源.............................................................................1
二.開發工具與開發技術..................................................................3 2.1 開發技術...................................................................................3 2.1.1 ASP.NET技術....................................................................3
2.2 開發工具...................................................................................4 2.2.1 SQL server 2005數據庫.....................................................4
2.3 開發環境...................................................................................5 2.3.1 Visual Studio.NET2010開發環境.....................................5 2.3.2 CSS樣式表在HTML中的實現............................................7
三.方案設計與論證........................................................................9 3.1 項目概述與需求分析.................................................................9 3.1.1 目標....................................................................................9 3.1.2 用戶的特點..........................................................................9
V
3.1.3 假定和約束..........................................................................9
3.2 設計中的圖表..........................................................................10 3.2.1 對功能的規定....................................................................10 3.2.2 網站結構圖:....................................................................11 3.2.3 類圖..................................................................................12
3.3 測試........................................................................................12 3.3.1 軟件測試...........................................................................12
四.設計與實現..............................................................................14 4.1 網站框架和代碼......................................................................14 4.1.1 添加用戶...........................................................................14 4.1.2 管理用戶...........................................................................15
4.2 網站首頁.................................................................................15 4.2.1 班級首頁...........................................................................15 圖4.2.1班級首頁.........................................................................16 4.2.2 網站首頁部分代碼.............................................................16
4.3 網站介紹.................................................................................18 4.3.1 班級介紹...........................................................................18 4.3.2 班級介紹部分代碼.............................................................19
4.4 資源共享.................................................................................22 4.4.1 資源共享介紹....................................................................22 4.4.2 連接代碼...........................................................................22
VI
4.5 專業課程.................................................................................23 4.5.1 課程信息...........................................................................23 4.5.2 專業課程部分代碼.............................................................23
4.6 班級通訊.................................................................................24 4.6.1 通訊界面...........................................................................24 4.6.2 班級通訊部分代碼.............................................................25
4.7 留言飛語.................................................................................27 4.7.1 留言界面...........................................................................27 4.7.2 同學留言部分代碼.............................................................27
4.8 聯系方式.................................................................................29 4.8.1 管理員聯系界面.................................................................29 4.8.2 聯系方式部分代碼.............................................................29
五.結果與評價..............................................................................31 六.結論.........................................................................................32
VII 沈陽化工學院學士學位論文
第一章 緒
論
班級網站設計與實現
一.緒論
1.1 課題背景來源和發展意義
1.1.1 課題背景
隨著互聯網的進一步發展與成熟,網絡的帶寬進一步加闊,網絡應用也越來越廣泛。網頁制作更是日新月異,層出不窮。涌現了很多琳瑯滿目的網站,使得整個互聯網多姿多彩。網頁功能分析就是以系統的觀點,對已選定的對象與開發范圍進行有目的、有步驟的實際調查和科學分析。分析的目的就是要弄清楚網頁要做什么,最終為后面的設計工作打下基礎。需求分析是制作一個網站的第一步。在制作網站之前,首先要了解客戶的需要和要求。這些必要的信息包括客戶所要表達的理念、界面顯示的內容和欄目的要求、網站功能方面的要求等。根據客戶的具體情況,需求也會有所差別。本網站是針對班級同學而設計的網站,主要是便于同學聯系例如聚會、發布班級信息等系列的通知,同時本網站還針對同學們的需求建立個人信息空間,可以建立個人影集,彰顯每個同學的個性與風采,相當于一個“便攜式”的聊天平臺,無論同學們以后身在那里我們都可以在茶余飯后對我們現在也或是過去進行討論,彼此交換心得體會,更加了解班級的概況,增強同學之間交流。
1.1.2 課題來源
大學時代的同學之情是最真摯的一份感情。沒有任何一個時代的學生比現在的學生們更加渴望言論自由,渴望情感交流。但在學分制條件下,快節奏的學習生活、越來越少的集體活動時間使同班同學之間的交流也日益困難。大學班級網站的建立為現實世界中的班級提供了一個非正式交往的虛擬平臺,它為班級每一個成員都提供了平等、自由的發言機會,使相互的交流跨越了時間和空間的樊籬,也打破了男女間、寢室間的障礙。沈陽化工學院學士學位論文
第一章 緒
論
為了滿足班級網站的交流目的。本網站包括:班級簡介、班級相冊、班級登陸、班級留言、學習交流、論壇等模塊。班級簡介模塊,作為班級總體介紹平臺,極少班級的建設,班級成員,班級成績等;班級相冊模塊,包括用戶上傳圖片以及圖片的瀏覽功能,實現與數據庫的銜接;班級登陸模塊,包括注冊和登陸兩個子模塊,通過注冊可以成為班級成員,在通過登錄擁有訪問網站各項功能的權限;班級留言模塊,實現用戶的在線留言;班級論壇模塊,論壇模塊主要實現注冊用戶能在此網站平臺之上交流,一般用戶可以回復別人的發言,亦可提出自己的言論,一伙的其他人的建議和意見;
本系統使用ASP。Net技術的動態網頁與SQL server2000數據庫結合設計建立的一個班級網站。用戶首先通過內部網絡訪問本站進行簡單的注冊并經營管理員審核通過后,即擁有了使用本網站上所提供的出管理模塊的各項功能的權利。功能模塊包括班級留言、班級相冊、學習交流等,論壇社區提供用戶之間的主要交流平臺,用戶可以發起自己的帖子,來引起班級其他同學的對本帖的討論或回復,同時用戶也可以對自己或別人的帖子提出自己的見解,從而很好地促進了班級內同學的交流。班級留言提供網上留言功能。留言可以使班級的老師班長或其他同學的留言,通過網絡的迅捷的傳輸率達到快速的了解及處理班級各項事務的目的。班級相冊可以將班級內同學的相冊傳到網站上自由瀏覽,增加班級的親和力。以及以上功能很好的解決上面所提出的問題 沈陽化工學院學士學位論文
第二章 開發工具與開發技術
二.開發工具與開發技術
2.1 開發技術
2.1.1 ASP.NET技術
AS.PNET是一種建立在通用語言上的程序結構,能被用于一臺Web服務器來建立強大的Web應用程序。ASP.NET是在服務器上運行的編譯好的公共語言運行庫,利用早期的綁定、實時編譯、本機優化和盒外緩存服務,著相當于在編寫代碼行之前便顯著提高了性能。另外,由于ASP.NET框架補充了Visual Studio 集成開發環境,想必ASP,使程序設計相對簡化,結構更為清晰
ASP.NET的前身ASP技術,是在IIS 2.0上首次推出(Windows NT 3.51),當時與 ADO 1.0 一起推出,在IIS 3.0(Windows NT 4.0)發揚光大,成為服務器端應用程序的熱門開發工具,微軟還 特別為它量身打造了Visual InterDev開發工具,在1994年到2000年之間,ASP技術已經成為微軟推展Windows NT 4.0平臺的關鍵技術之一,數以萬計的ASP網站也是這個時候開始如雨后春筍般的出現在網絡上。它的簡單以及高度可定制化的能力,也是它能迅速崛起的原因 之一。不過ASP的缺點也逐漸的浮現出來:
意大利面型的程序開發方法,讓維護的難度提高很多,尤其是大型的ASP應用程序。直譯式的VBScript或JScript語言,讓效能有些許的受限。延展性因為其基礎架構擴充性不足而受限,雖然有COM元件可用,但開發一些特殊功能(像文件上傳)時,沒有來自內置的支持,需要尋求第三方軟件商開發的元件。1997年時,微軟開始針對ASP的缺點(尤其是意大利面型的程序開發方法)準備開始一個新項目來開發,當時ASP.NET的主要領導人Scott Guthrie剛從杜克大學畢業,他和IIS團隊的Mark Anders經理一起合作兩個月,開發出了下一代ASP技術的原型,這個原型在1997年的圣誕節時被發展出來,并給予一個名稱:XSP,這個原型產品使用的是Java語言。不過它馬上就被納入當時還在開發中的CLR平臺,Scott Guthrie事后也認為將這個技術移植到當時的CLR平臺,確實有很大的風險(huge risk),但當時的XSP團 沈陽化工學院學士學位論文
第二章 開發工具與開發技術
隊卻是以CLR開發應用的第一個團隊。
為了將XSP移植到CLR中,XSP團隊將XSP的內核程序全部以C#語言重新撰寫(在內部的項目代號是 “Project Cool”,但是當時對公開場合是保密的),并且改名為ASP+,作為ASP技術的后繼者,并且也會提供一個簡單的移轉方法給ASP開發人員。ASP+首次的Beta版本以及應用在PDC 2000中亮相,由Bill Gates主講Keynote(即關鍵技術的概覽),由富士通公司展示使用COBOL語言撰寫ASP+應用程序,并且宣布它可以使用Visual Basic.NET、C#、Perl與Python語言(后兩者由ActiveState公司開發的互通工具支持)來開發。
在2000年第二季時,微軟正式推動.NET策略,ASP+也順理成章的改名為ASP.NET,經過四年的開發,第一個版本的ASP.NET在2002年1月5日亮相(和.NET Framework 1.0),Scott Guthrie也成為ASP.NET的產品經理(到現在已經開發了數個微軟產品,像ASP.NET AJAX和Microsoft Silverlight)。目前最新版本的 ASP.NET 4.0 以及.NET Framework 4.0 已經在VS2010平臺內應用。
2.2 開發工具
2.2.1 SQL server 2005數據庫
數據庫是信息的集合,是指長期存儲在計算機內的、有組織的、可共享的數據集合。數據庫中的數據按一定的數據模型組織、描述和儲存,具有較小的冗余度、較高的數據獨立性和易擴展性,并可為各種用戶共享。例如,記錄客戶信息、網絡通訊錄等。以往會將這些數據記錄到紙上或是計算機某個文件中,如果要修改或查詢則要消費大量時間。現在人們借助計算機和數據庫技術科學地保存和管理大量的復雜的數據,以便能方便而充分的利用這些寶貴的信息資源。數據被規整地存儲起來,修改和查詢只需幾條SQL語句就完成了。
Internet集成。SQL Server 2005 數據庫引擎提供完整的XML 支持。它還具有構成最大的Web 站點的數據存儲組件所需的可伸縮性、可用性和安全功能。SQL Server 2000 程序設計模型與 Windows DNA 構架集成,用以開發 Web 應用程序,并且SQL Server 2005 支持 English Query 和 Microsoft 搜索服務等功能,在Web 應用程序中包含了用戶友好的查詢和強大的搜索功能。沈陽化工學院學士學位論文
第二章 開發工具與開發技術
2.可伸縮性和可用性。同一個數據庫引擎可以在不同的平臺上使用,從運行 Microsoft Windowsreg;98 的便攜式電腦,到運行 Microsoft Windows 2000 數據中心版的大型多處理器服務器。SQL Server 2005 企業版支持聯合服務器、索引視圖和大型內存支持等功能,使其得以升級到最大 Web 站點所需的性能級別。
3.企業級數據庫功能。SQL Server 2005 關系數據庫引擎支持當今苛刻的數據處理環境所需的功能。數據庫引擎充分保護數據完整性,同時將管理上千個并發修改數據庫的用戶的開銷減到最小。SQL Server 2005 分布式查詢使您得以引用來自不同數據源的數據,就好像這些數據是 SQL Server 2005 數據庫的一部分,同時分布式事務支持充分保護任何分布式數據更新的完整性。復制同樣使您得以維護多個數據復本,同時確保單獨的數據復本保持同步。可將一組數據復制到多個移動的脫接用戶,使這些用戶自主地工作,然后將他們所做的修改合并會發布服務器。
4.易于安裝、部署和使用。SQL Server 2005 中包括一系列管理和開發工具,這些工具可改進在多個站點上安裝、部署、管理和使用 SQL Server 的過程。SQL Server 2005 還支持基于標準的、與 Windows DNA 集成的程序設計模型,使 SQL Server 數據庫和數據倉庫的使用成為生成強大的可伸縮系統的無縫部分。這些功能使您得以快速交付 SQL Server 應用程序,使客戶只需最少的安裝和管理開銷即可實現這些應用程序。
2.3 開發環境
2.3.1 Visual Studio.NET2010開發環境
1998 年,微軟公司發布了 Visual Studio 6.0。所有開發語言的開發環境版本均升至 6.0。這也是 Visual Basic 最后一次發布,從下一個版本(7.0)開始,Microsoft Basic 進化成了一種新的面向對象的語言:Microsoft Basic NET。由于微軟公司對于 Sun 公司 Java 語言擴充導致與 Java 虛擬機不 兼容被 Sun 告上法庭,微軟在后續的 Visual Studio 中不再包括面向 Java 虛擬機的開發環境。Visual Studio 97 是最早的 Visual Studio 版本。包含有面向 Windows 開發使用的 Visual Basic 5.0、Visual C++5.0,面向 Java開發的 Visual J++和 面向數據庫開發的 Visual FoxPro,還包含有創建 DHTML(Dynamic HTML)所需要的 Visual InterDev。其中,Visual Basic 和 沈陽化工學院學士學位論文
第二章 開發工具與開發技術
Visual FoxPro 使用單獨的開發環境,其他的開發語言使用統一的開發環境。
2002 年,隨著.NET 口號的提出與 Windows XP / Office XP 的發布,微軟發布了 Visual Studio.NET(內部版本號為 7.0)。在這個版本的 Visual Studio 中,微軟剝離了 Visual FoxPro 作為一個單獨的開發環境以 Visual FoxPro 7.0 單獨銷售,同時取消了 Visual InterDev。與此同時,微軟引入了建立在.NET 框架上(版本1.0)的托管代碼機制以及一門新的語言 C#(讀作 C Sharp,意為 C#)。C# 是一門建立在 C++和 Java 基礎上的現代語言,是編寫.NET 框架的語言。
.NET 的通用語言框架機制(Common Language Runtime, CLR),其目的是在同一個項目中支持不同的語言所開發的組件。所有 CLR 支持的代碼都會被解釋成為 CLR 可執行的機器代碼然后運行。
Visual Basic、Visual C++ 都被擴展為支持托管代碼機制的開發環境,且 Visual Basic.NET更是從 Visual Basic 脫胎換骨,徹底支持面向對象的編程機制。而 Visual J++ 也變為 Visual J#。后者僅語法同 Java 相同,但是面向的不是 Java 虛擬機,而是.NET Framework。
2003 年,微軟對 Visual Studio 2002 進行了部分修訂,以 Visual Studio 2003 的名義發布(內部版本號為 7.1)。Visio 作為使用統一建模語言(UML)架構應用程序框架的程序被引入,同時被引入的還包括移動設備支持和企業模版。.NET 框架也升級到了 1.1。
2005 年,微軟發布了 Visual Studio 2005。.NET 字眼從各種語言的名字中被抹去,但是這個版本的 Visual Studio 仍然還是面向.NET 框架的(版本2.0)。
這個版本的 Visual Studio 包含有眾多版本,分別面向不同的開發角色。同時還永久提供免費的 Visual Studio Express 版本。
隨著即將發布的 Windows Vista和 Office 2007,Visual Studio 9 也漸漸浮出水面。Visual Studio 9 目前可以確定的是支持建立于 DHTML 基礎上的 Ajax 技術,這種微軟在 Visual InterDev 時代提出的基于異步的客戶端動 態網頁技術在當年并沒有像微軟預期中的那么流行起來,反而隨著 Gmail 等應用而東山再起,漸漸成為主流網絡應用之一。同時 Visual Studio 9 會強化對于數據庫的支持以及微軟新的基于工作流(Workflow)的編程模型。預計為了保持與 Office 系列的統一,Visual Studio 9 的名稱為 Visual Studio 2007。沈陽化工學院學士學位論文
第二章 開發工具與開發技術
2007年11月,微軟發布了 Visual Studio 2008 英文版,2008年2月14日發布了簡體中文專業版。
2010年4月12微軟發布Visual Studio 2010以及.NET Framework 4.0,并于2010年5月26發布了中文版
Visual Studio.NET2010是Microsoft推出.NET應用程序開發工具。Visual Studio,我們一般都簡稱為VS,Visual Studio其實是微軟開發的一套工具集,它由各種各樣的工具組成,這就好像Office 2007時由Word 2007、Excel 2007、Access 2007等等組成的一個道理。其中Visual C++就是Visual Studio的一個重要的組成部分。Visual Studio可以用于生成Web應用程序,也可以生成桌面應用程序,在Visual Studio下面,除了VC,還有Visual C#,Visual Basec,過去還有Visual J#,現在還有Visual F#等等組件工具,使用這些工具你可以使用C++語言C#語言或者Basic語言進行開發。這就好比桌上放著刀、叉、筷子,你可以用它來吃飯,無論它們都是餐具的一種
2.3.2 CSS樣式表在HTML中的實現
在HTML網頁中加入CSS并不是只有一種方法,在不同的情況下,可以采用不同的方法,比較常用的有下面幾中。
1.嵌入式樣式表
嵌入式樣式表的實現很簡單,只需在每個要應用樣式的HTML標簽后寫上CSS屬性即可。例如要設置指定表格中的文字的樣式為紅色,字號為10pt,可在當前表格的