第一篇：網頁制作論文--個人網站設計

網頁制作課程論文

（個人網站設計論文）

姓名：薛金鴿 學號：105031040025 班級：103212 專業：市場營銷（電子商務方向）學期：2011-2012學年第2學期 任課教師：劉新飛

個人網站策劃書

1.組織機構描述

1.1個人網站的應用背景

網絡發展到今天，建立網站已經成為一個很普遍的問題了，對于個人來說，建設好時間的個性化網站可以更加方便的收集信息，開展更加直接的網絡交流，使用自己構筑的友善平臺，我們可以為自己畢業后找工作做好充分的準備，通過自己建設的網站，用人單位可以更好的去了解你，從而給自己增加了一份很重的砝碼。在我的這個個人網站的制作過程中，我選擇了我比較熟悉的大學生活中的許多內容做為我的網站的重要組成部分，這樣相對于其他包括種類齊全的網站，我就有了一定的材料基礎。這是我這個網站選擇大學生主題的原因之一。

其次，做為在校大學生，我知道大學生現在對什么事物，內容，活動等等感興趣，所以，我做起來的時候相對來說是比較隨手的，我不用像其他的網站那樣去刻意的收集信息，資料，我只要在校園里稍微留意，我就會捕捉到大學生的興趣點。所以，在整個網站的設計過程中，我廣泛的聽取同學的意見和建議，不斷的改進和提高我的網站的內容和質量，這些都取得了比較好的效果。

在整個網站的設計過程中，我根據自己以往的設計經驗和自己找來的資料，又經過老師的指點，經過了近一個月的努力，幾經易稿，最終做成了我的這個個人主頁。.2 個人網站建設的目的

在我們的工作、日常生活中，能夠擁有一個自己的網站，一個已經成為不少人的希望和驕傲。一個網站項目的確立是建立在各種各樣的需求上面的，這是個人網站，所以這種需求往往來自于個人的實際需求，其中每個人的實際需求占了絕大部分[6]。因此如何更好地的了解、分析、明確需求，并且能夠準確、清晰以文檔的形式表達出來，保證開發過程按照個人需求為目的正確項目開發方向進行。不同的網站目的要求通過不同的方式來實現。一個展示個人能力的網站與一個以花卉種植為主題的網站，以及一個大型門戶網站和一個小型企業網站，其出發點和建站目的都有所不同，在整個網站的建設規劃方面的要求也是肯定是大不一樣的。因此在規劃我的這個網站時，我選擇了和大學生的生活和學習相關聯的主題。

1.3 相關應用軟件選用、技術采用

在網頁的設計過程中，我選用的軟件包括Dreamweavercs5、Fireworks cs5和Photoshopcs5，其中，Dreamweaver 是網頁編輯軟件，Fireworks cs5是圖形/圖像處理軟件，photoshopcs5是圖片處理軟件。它們是Macromedia公司專門為網頁設計、制作開發的系列軟件套件，三者之間可以無縫集成，能夠有效地解決網絡帶寬問題，是設計動畫網頁的最佳工具。

Dreamweaver cs5采用“所見即所得”的直觀設計模式，充分尊重設計人員的原始意識和想象力。她成功地將網頁設計功能中的技術實現部分和設計部分分離開來，使用戶只需專注于設計，而其余的工作由Dreamweavercs5自動完成。另外，還有一點值得說明的是，Dreamweaver cs5可以控制和刪除冗余代碼，減小網頁文件的大小。從而能夠快速上傳和下載。

Fireworkscs4的獨特之處在于它能夠優化、切分圖片映射圖，并提供了功能強大的翻滾圖工具。它是基于WEB應用的圖形/圖象處理軟件，提供了一種革命性的新方法來創建WEB圖形，并且具有所有其他圖形處理工具的諸多優點。Fireworks cs4的最大優勢就在于它在任何時候可以從任何階段開始設計工作，這樣既可以節約時間又可以對產品進行擴展。另外，Fireworks cs4中的諸多功能都是面向WEB應用的，因此對于WEB設計新手來說也很容易學習的。

在我設計我的個人網站的過程中，我選擇了Dreamwearcs5和 Photoshopcs5 Fireworks cs4三種軟件。因為自己向對于其它的軟件來說，這三個還算是比較熟悉的。

2．網站的技術參數部分

2.1我的導航系統

我所制作的個人網站的導航系統包括：

1.個人簡介2.個人專題4.我的相冊5.網站說明6.給我留言 8.發送郵件9.鏈接百度10.女生花園

2.2功能模塊的劃分

1．搜索引擎：

根據瀏覽者的要求，使用主頁上的搜索引擎鏈接到百度，在整個Internet上進行搜索，完成信息的優化與提取。

2．論壇：

主要功能是網友和網站之間的交流平臺，也是網友給版主提出意見的主要渠道。在論壇中用戶可以發表意見，這些意見可以讓所有人看到，也可以只讓版主看到，版主和其他人可以針對留言的內容進行回復，只留給版主的留言只有版主能夠回復，并且版主可以登錄后臺對留言進行管理，是否發表或刪除。

3．發送電子郵件：

網友可以通過“聯系我”利用outlook 向版主或其他人發送電子郵件。4．精品收藏：

在其中展示我喜愛的東西，包括電影、歌曲和一些優美的文章。奇文共欣賞，疑義相與析。我只想起到拋磚引玉的作用，讓大家從中認識我和了解我，讓一些美好的東西我們大家共同來欣賞。但我增加了管理權限，我以管理員的身份可以對加入的新內容進行管理，即允許加入和對其進行刪除。

5．留言板：

是一個我與大家談心交流的地方，在留言板中，我們可以暢所欲言，和大家進行交流。就我們感興趣的話題展開討論。和大家進行溝通。

2.3 首頁的設計 我的網站首頁主要采用簡單大方的設計方法，用的是色調一致的一組圖片做的LOGO和相關的背景圖片，主要頁面布局如下：

2.4主要欄目的介紹

1．個人簡介：

介紹版主的一些基本信息，希望各位訪客能夠認識版主。2.我的論壇：

此版塊又分為主頁、發表意見、回復意見、顯示論壇內容、版主后臺管理以及版主的回復界面。其中發表意見界面是所有訪客都可以在論壇里面發表自己的意見，這些意見可以是發表給所有的訪客，也可以是只發表給版主，如果只發表給版主，只有版主可以看到和回復；回復意見是所有訪客針對自己感興趣的話題進行回復；這些發表的意見和回復可以在顯示論壇內容的界面都顯示出來，供大家討論；那些只有版主才能看到的信息在版主的管理界面，這個界面需要登錄，設有用戶名和密碼，在這里版主可以對所有評論進行發表或刪除的管理。3.個人專題：

這里收錄了我平時搜集的一些文章和音樂，各位訪客可以根據自己的喜好進行閱覽。4.我的相冊：

在這個板塊可以看到我的照片，班級照片和搜集的校園照片，如果大家喜歡可以收藏。更改照片的時候只要更新數據庫就可以了。5.網站說明：

里面是我對整個網站的介紹，不太清楚網站構架的訪客可以先到這里。6.給我留言：

這是每位訪客針對我的網站情況給我留言，這些留言會直接保存到數據庫里面，并且能夠輕松的讀取。7.發送郵件：

各位訪客可以通過outlook向版主或者其他人發送電子郵件。8.鏈接百度：

如果訪客想在互聯網上查找東西，可以直接點擊這里。9.女生花園：

收集了一些女生喜歡的東西，如果你是女生，可以進來看看。

2.5二級頁面的設計

我的網站主頁內容簡單所以主要內容再二級頁面里要有詳細的說明，具體說明如下：

2.5.1個人簡介

本模塊是個人簡介部分，每個個人網站都會有作者介紹。在這個模塊訪客會了解到作者的一些基本信息.2.5.2文學欣賞

這個版塊主要介紹我自己喜歡的相關文學作品。此版塊的界面如圖所示：

圖3.6 文學欣賞界面

2.5.3快樂音樂

進入此版塊，界面如圖所示：

通過在數據庫中存放音樂路徑，達到在網頁上播放的效果。在音樂的首頁上放置了歌曲的名字，網友無需登錄，即可收聽自己喜歡的歌曲。

音樂界面

2.5.4我的相冊版塊

個人網站中又一亮點就是個人相冊的設置，在我的相冊里，放置了我自己的照片、班級照片和校園照片。

相冊里面的這三個版塊具有相同的版面設計，如下圖所示：

相冊界面

2.5.5網站說明版塊

此版塊是我根據自己的網站結構對整個網站以及每個版塊所做的網站結構和功能的說明，以及網站和作者版權說明。如下圖所示：

網站說明界面

如果網友不清楚網站的構架，可以查看此版塊。2.5.6給我留言版塊

留言板是目前最為流行的網絡應用之一，使用留言板，可以為留言者提供發言的機會，讓他們能夠及時、準確地交換自己的觀點。

2.5.7留言板主界面

完整的留言板具有發表留言和察看別人留言的功能，如圖所示的留言板主界面index1.ASP，可由此進入留言界面和察看留言界面。

留言主界面

在主界面中存有全部留言的作者和主題，點擊你想察看的主題就會進入察看留言界面，點擊 “發表帖子”進入留言界面。

3．網站的維護方案

3.1域名的申請

域名（Domain Name），是由一串用點分隔的名字組成的,Internet上提供用戶訪問某網站或網頁的路徑，用于在數據傳輸時標識計算機的電子方位（有時也指地理位置）。

域名申請的含義

“域名申請”：為保證每個網站的域名或訪問地址是獨一無二的，需要向統一管理域名的機構或組織注冊或備檔的一種行為。也就是說，為了保證網絡安全和有序性，網站建立后為其綁定一個全球獨一無二的域名或訪問地址，必須向全球統一管理域名的機構或組織去注冊或者備檔方可使用的一種行為。由于域名是網站必不可少的“門牌號”，域名可用于：網站地址訪問、電子郵箱、品牌保護等用途，所以很多企業或個人均會進行域名申請。

3.2空間或者主機的租用

有了自己的域名這個門牌號后，就需要一個空間來存放自己的網站，也就是虛擬主機。一般虛擬主機提供商都向用戶提供100MB、500MB、3GB等虛擬主機空間。我的個人網站選擇100-300MB的虛擬主機空間。購買虛擬主機主要考慮幾個方面：售后服務、穩定性、訪問速度等。首先我選擇在萬網上注冊一個域名然后申請租用空間建立個人網站。

3.3網站鏈接穩定性測試

超級鏈接對于網站用戶而言意味著能不能流暢的使用整個網站提供的服務，因而鏈接將作為一個獨立的項目進行測試。網站能夠正確運行首先要保證鏈接能夠連貫運行。

網站的運行中整個系統是否運行正常，我主要采用將測試網站長時間運轉進行測試，派生出執行程序所有功能需求的輸入條件，從而導出測試用例，進行測試，網站中的每個版塊的每個頁面都出現了很多的鏈接，所以每個版塊要先進行單獨測試，單獨測試完成后，根據個版塊之間的連接結構再進行總體測試，從而達到網站的整體的運營能夠順利地進行。在測試這個環節時，沒有特定的測試方法，就要做到細心，做到網站的順利運行。

總結：

通過這次個人網站設計的制作，我學會了很多東西，也了解了很多關于個人網站的資料。不知不覺網頁設計的課程將要結束了，這門課程所包含內容的豐富是讓我從沒有想到的。在整個的學習過程中，我學習了Dreamwave、Firework、Html語言、網站建設的基本思想等重要內容。到現在為止，我還是很慶幸能夠學到這么多的內容。

雖然整個網頁的結構還有很多不足，還有一些板塊沒有開通，但是我的確能夠感到在我們制作過程中技能的提高。整個網站的不足我想是沒有使用到一些動態網頁的知識，使得日后網站的維護較為繁雜。希望以后可以自學動態網站的課程，從而彌補自己在動態網絡語言方面的不足。這樣以后可以利用業余的時間為自己或者公司，根據自己的愛好建立一個個人網站。

[參考文獻] [1] 袁曉紅.《網頁設計與制作》[M].高等教育出版社 2006 385頁~389頁 [2] 甘登岱.《我也能掌握Flash編程》[M].航空工業出版社 2000 [3] 趙更生.《Flash動畫制作培訓實錄》[M].人民郵電出版社 2004 [4] 鮑嘉.盧堅.陳丁法《Dreamweaver CS5網頁設計從入門到精髓》[M].中國電力出版社2010 [5] 張成龍.《網頁制作一點通》.延邊人民出版社

[6] 劉瑞新，《ASP動態網站開發、畢業設計指導及實例》[M].機械工業出版社 2000 [7] 石曉燕、蘇萍《網頁設計基礎》[M].清華大學、交通出版社 20 04 [8] 王玉芬.《網站規劃與設計》[M].西北工業出版社 2003 [9] 謝希仁.計算機網絡(第5版)[M].北京：電子工業出版社,2008

第二篇：個人網站網頁制作論文

個人網站網頁

制 作 論 文

學院： 專業： 姓名： 學號：

摘要

本文就個人網站的規劃與建設，以軟件工程的方法對全過程進行了分析與研究。本文的主要工作集中在：

1.對Web頁進行概述，主要是對Internet的歷史和發展作了回顧，并對Web頁的定義和特性進行闡述。并對網站開發過程中使用的開發工具和技術作了簡要的介紹。

2.對網站建設中提及到的術語進行了解釋，并對個人網站的由來和發展進行了討論。

3.對自己的個人網站從規劃到建設進行了詳細的分析。

4.使用ASP＋IIS＋Access技術實現了我的網站的各種功能，其中和數據庫的連接使用到了ODBC技術。

5.就網站建設提出了自己的觀點與建議。

【關鍵詞】 網站 ASP SQL Server 風格 創意

一、引言

在已跨入21世紀的今天，人類使用和學習信息的方式以及信息的包裝方式正在進行著不可阻擋的革命，這次革命將比印刷術的出現所產生的影響以及對社會發展的推動遠為復雜而巨大。目前，我國上網的人口已近一個億，成立世界上網民最多的國家，許多人在需要查詢信息，首先想到的就是上網。網站的迷人之處在于綜合使用文本、圖象、聲音、動畫和視頻的信息和內容，具有豐富的多媒體表現與互動特點，無可置疑，網站已成為最吸引人的也最有效的信息傳遞手段和方式。隨著網絡技術的發展，各類網站紛紛出現。個人網站也成為了一種時尚。越來越多的人希望擁有自己的網站，開辟網絡世界的一片天地，展示自己的才華和風格。

（一）Web頁概述

1、認識Web

Web(World Wide Web，簡稱，其意思就是采用http超文本傳輸協議訪問新浪網的首頁，由于網頁均是通過http超文本傳輸協議進行訪問，默認下，“http://”可以省略不輸。

5、IP地址

為了使互聯網上的電腦主機在通信時能夠相互識別，每臺主機都分配一個能表示其位置的IP（Internet Protocol）地址，這如同公用電話網中電話的號碼一樣。IP地址是由專門的互聯網機構來分配。IP地址具有惟一性，是由32位二進制數組成，分為四組，每組8位，每組之間用小數點分隔，在實際之中常轉換成十進制數表示。

（二）個人網站的由來和發展

互聯網在中國的出現只有短短七年時間，1994年中國科學院高能物理研究所設立了國內第一個Web服務器，推出一個叫做“中國之窗”的網頁，這可能是國內Internet上出現的第一個Web網頁，1995年開始，中國教育科研網，中國科技網，中國公用計算機互聯網以及中國金橋網這構成中國數字神經系統的四大互聯網絡相繼建成，使互聯網在中國開始真正進入社會生活之中。

這時期，個人網站出現的條件還很不成熟，國內上網的人數很少，也缺乏支持個人建站的環境，用戶很難找到理想的個人主頁存放地。

個人網站發展的第二階段是從1997年初到1998年，這段時間，中國網民數量飛速增長，個人網站日漸繁榮，個人主頁的數量急劇增加。同時，越來越多的商業網站開始免費提供個人主頁空間，這些良好的外部極大地促進了個人網站的發展，涌現了一批很著名的個人網頁，從1998年下半年開始，隨著互聯網應用的深入的普及，隨著眾多主頁制作工具的出現，使得建站成為一件非常容易的事，創建一個能充分體現自我風格和特色的個人網站已經成為互聯網用戶的新追求。

（三）我的個人網站的設計與規劃

1、明確架設網站的目的及客戶要求

通常情況下，架設個人網站主要是為了通過互聯網表達個人在商業、科技、交際、生活等方面的信息需求或者進行信息的交流，具有較強的目的性，我的個人網站一般體現在：為了展示自己的風采，讓大家和我一起分享我的心得與經驗，讓和我有共同愛好的朋友有一個傾訴的地方。

2、我的個人網站概貌

因為是個人網站，所以只是選擇了自己擅長和喜愛的內容，在突出自己的風格和特點的同時，還應用了現在流行的網站設計技術和數據庫技術。因此將網站設計分為前臺頁面展示平臺和后臺在線管理平臺。

3、功能劃分

網站設計有新聞更新，瀏覽者可以在首頁瀏覽自己喜歡的新聞，并且可以在留言板和大家交流，在后臺管理頁面中，通過身份認證，管理員——我，可以對網站信息進行管理。站內的其它頁面均是我自己的精心收藏，與大家一起分享。

4、功能描述(1)新聞

嵌入百度新聞每日更新代碼，使用在本站首頁顯示今日國內國際新聞和體育新聞，供瀏覽者瀏覽。

(2)留言板

是一個我與大家談心交流的地方，在留言板中，我們可以暢所欲言，和大家進行交流。就我們感興趣的話題展開討論。和大家進行溝通。

(3)后臺管理頁面 是我管理和添加到新內容的地方，為了方便實現信息的經常更新，我設計了這個管理頁面，經過身份認證后我可以進入網站對其中的信息進行管理。

(4)日記

在其中展示我喜愛的東西，包括我的日記、精品文章、社會文化和一些雜七雜八的文章。奇文共欣賞，疑義相與析。我只想起到拋磚引玉的作用，讓大家從中認識我和了解我，讓一些美好的東西我們大家共同來欣賞。

(5)相冊

在其中展示漂亮的圖片，包括我的照片、我的同學、風景照片、妹眉帥哥欄目。讓大家一起來欣賞人物、風景風采。

(6)音樂

在其中展示個人喜歡的歌曲，朋友們可以在里面點播自己喜歡的歌。(7)頁面組織和數據庫設計

在明確了我的個人網站的風格和定位后，就是網站的材料組織以及網站的頁面設計和數據庫設計。

建立一個網站好比寫一篇文章，首先要擬好提綱，文章才能主題明確，層次清晰。如果網站結構不清晰，目錄龐雜，內容東一塊西一塊。結果不但瀏覽者看得糊涂，自己擴充和維護網站也相當困難。網站的題材確定后，并且收集和組織了許多相關的資料內容，但如何組織內容才能吸引網友們來瀏覽網站呢？欄目的實質是一個網站的大綱索引，索引應該將網站的主體明確顯示出來。因此我將自己的個人網站分為五個欄目，分別是關于我、相冊、日記、音樂、留言。

三、詳細設計

1、界面設計（1）相冊

是一個個人相片和精彩圖片展示的地方，在相冊中，我們可以了解到站長的個人風采和自己喜歡的圖片。a、功能

利用ASP對象語句顯示圖片，讓大家可以看見所有圖片的縮略圖，同時每個圖片都有快照功能，可以瀏覽圖片的全圖。

b、組成構造

相冊結果顯示頁面 photo.asp：用來顯示所有圖片，同時還具備圖片的分類功能和圖片單個瀏覽功能。

站長基本信息顯示頁面 include.asp： 數據庫連接頁面 conn.asp(2)日記

是一個記錄個人日記和精品收藏文章的地方，供給大家一起分享。a、功能

利用ASP對象語句分類顯示日記或文章記錄，讓大家瀏覽到最新的日記或文章

b、組成結構

日記或文章顯示頁面 diary.asp：顯示所有日記或文章，同時還具備顯示不同子類日記或文章

站長基本信息顯示頁面 include.asp 數據庫連接頁面 conn.asp c、日記頁面瀏覽效果圖，如圖12。(3)、音樂

是一個音樂收藏和音樂欣賞的地方。a、功能

利用ASP對象語句來顯示歌曲曲目、演唱人和在線播放功能。b、組成結構

歌曲顯示播放頁面 media.asp：完成曲目的顯示和播放功能的頁面。站長基本信息顯示頁面 include.asp 數據庫連接頁面 conn.asp(4)、留言本

是一個我與大家談心交流的地方，在留言板中，我們可以暢所欲言，和大家進行交流。就我們感興趣的話題展開討論。和大家進行溝通。

a、功能

利用SQL語法過濾特定的用戶留言意見，讓站長可以針對某位特定用戶所發表的意見作出獨立的回答，同時，用戶在發表個人意見時，若認為意見內容涉及敏感的話題或是意見內容涉及私人隱私，都可用“悄悄話”的方式發言，這些“悄悄話”將不會被顯示出來讓大家看到，當然，站長擁有管理的能力，只要以密碼登錄管理模式，就可以進行各個用戶的單獨意見回復，而且還能看到用戶所留下的“悄悄話

b、組成構造

意見留言結果網頁gbook.asp：用來顯示用戶發言與站長回復內容，同時還具備查看留言和發表留言兩個功能。

站長基本信息顯示頁面 include.asp 數據庫連接頁面 conn.asp

(三)、關鍵代碼設計

1、分頁功能模塊代碼

<% if not rs.eof then rs.MoveFirst '注意放到前面來,否則到任何頁總是在第一個記錄上

end if rs.pagesize=MaxPerPage '設置每頁最多顯示多少條記錄

If trim(Request(“Page”))<>“" then '如果請求的頁次不為空

CurrentPage= CLng(request(”Page“))'clng是轉換成長整型數據類型,并賦值到當前頁次上

If CurrentPage> rs.PageCount then '如果當前頁次大于總頁數,則將最大頁次賦值到當前頁次上

CurrentPage = rs.PageCount

End If Else

CurrentPage= 1 '一切條件不成立,將當前頁設為第一頁 End If totalPut=rs.recordcount '將總記錄賦值于TOTALPUT

if CurrentPage<>1 then '如果當前頁數不等于第一頁

if(currentPage-1)*MaxPerPage

rs.move(currentPage-1)*MaxPerPage '相對當前記錄數向后移動

dim bookmark '定義書簽變量

bookmark=rs.bookmark '將當前記錄的標簽賦于變量BOOKMARK上

end if

end if

dim n,k

if(totalPut mod MaxPerPage)=0 then '總記錄數與每頁最大記錄數求余的結果為零時,則N返回整數頁次,否則再加一.n= totalPut MaxPerPage

else

n= totalPut MaxPerPage + 1

end if %>

2、圖片顯示功能模塊代碼

<% cid=request(”id“)if cid=”“ then sql=”select * from HN_pro order by id desc“ else sql=”select * from HN_pro where cstr(class)='“&cid&”' order by id desc“ end if

else

rsnews.AbsolutePage=ToPage

intCurPage=ToPage

end if

else

rsnews.AbsolutePage=1

intCurPage=1

end if intCurPage=CInt(intCurPage)k=1 do while Not rsnews.eof and k<6 %>

<%for n=1 to 6%>

<% rsnews.MoveNext if rsnews.eof then exit for if rsnews.eof then exit do next %>

“ rel=”lightbox[plants]“> “ width=”49“ height=”49“ border=”0“>

3、發表留言提交內容判斷模塊代碼 <% if request(”action“)=”“ then response.redirect”gbook.asp?action=show“ if request(”action“)=”post“ then dim bookname dim bookwhere dim bookpic bookname=request(”name“)bookwhere=request(”where“)bookpic=request(”pic“)bookface=request(”face“)bookip=request.ServerVariables(”REMOTE_ADDR“)if bookname=”“ then Response.Write ”“

Response.End %>

（四）、網站管理系統

1、完成站長對網站信息管理及更新的系統，包括以下幾部分：（1）管理登陸頁面Index.asp（2）相冊管理頁面Admin_pro.asp（3）日記管理頁面Admin_new.asp（4）音樂管理頁面Admin_down.asp（5）留言管理頁面GuestBook.asp

2、管理登陸

管理系統的登陸頁面，主要用于管理登陸和判斷用戶是否已注冊。（1）其中判斷是否是非法登陸的代碼為： <% admin_pass=md5(admin_pass)set rs=server.createobject(”adodb.recordset“)sql=”select * from admin where admin_name='“&admin_name&”' and admin_pass='“&admin_pass&”'“

rs.open sql,conn,1,3

if rs.eof then response.write”“

else

session(”admin_name“)=request(”admin_name“)

session(”loc“)=1

response.redirect ”admin.asp“ end if rs.close %>（2）其中驗證碼驗證代碼：

<% dim verifycode,verifycode2 if verifycode<>verifycode2 then response.write”“ founderr=true else session(”verifycode“)=”“ %>

3、主要功能程序段（1）打開數據庫 <% set conn = Server.CreateObject(”ADODB.Connection“)conn.open ”YourDSNName“,”username“,”password“ %>（2）數據庫查詢操作 大類查訊

setrs=server.CreateObject(adodb.recordset)小類查詢 dimrs2 setrs2=server.CreateObject(adodb.recordset)rs2.openselectnclass,nclassidfromnclasswhereanclassid=&rs(anclassid)&orderbynclassidorder,conn,1,1 dowhilenotrs2.eof response.writeAhref=class.aspaid=&rs(anclassid)&&nid=&rs2(nclassid)&&trim(rs2(nclass))&A rs2.movenext loop（3）添加記錄操作

setrs=server.CreateObject(adodb.recordset)可寫方式

rs.openselectbookid,username,zhuangtai,zongerfromactions,conn,1,3 rs.addnew 添加一條新記錄 rs(bookid)=bookid 添加相應的記錄 rs(username)=username ???? rs(zhuangtai)=6 rs(zonger)=0 rs.update 更新數據庫（4）刪除記錄操作

從表actions中刪除actionid匹配的記錄 conn.executedeletefromactionswhereactionid= &request.QueryString(actionid)

四、編碼、測試與維護

（一）測試與維護

1、IIS(Internet 信息服務)安裝配置

可以在”添加或刪除程序 >>添加/刪除Windows組件“對話框中把”Internet 信息服務(IIS)“前的勾選中，點”下一步“進行安裝就行了(注：在這之前應把系統安裝盤放到光驅)。IIS 裝好之后再作一下簡單的配置。定位到”開始>>管理工具>>Internet 信息服務(IIS)管理器“，打開IIS管理器。在”本地計算機>>網站>>默認網站“上右鍵單擊，在快捷菜單里選”屬性“(或者直接在操作菜單下選”屬性“)，彈出如下對話框圖16: 圖16 切換到”主目錄“標簽(圖2)，重新選擇網站根目錄(我選擇的是E盤下的my web目錄)，默認是”系統盤:Inetpubwwwroot“,因為系統盤不宜放太多的非系統文件，所以在這里重設默認網站要目錄，如果嫌麻煩可以跳過這步。再切換到”文檔“標簽，通過”添加“、”刪除“、”上移“、”下移 “，把站點的默認文檔設置如圖17：

圖17 可能有些朋友會疑惑，設置默認內容文檔有什么作用？細心的朋友應該會發現，在瀏覽一些大網站的首頁時用它的一級域名就行了，并不需要指定請求頁的文件名，這就是設置了默認內容文檔的緣故，它的作用就是在瀏覽器請求沒有指定文檔的名稱時，將默認文檔提供給瀏覽器。要得到更詳盡的解釋說明，可以點擊圖3中的“幫助”。之所以有這步，是因為網站的默認內容頁中沒有index.asp，不大符合國人習慣。

2、Dream weaver測試站點和用IIS測試本地站點

Dream weaver MX提供了全面檢測站點的功能，它比檢測鏈接更全面。全面地檢測內部、外部鏈接、去除錯標簽、空標簽、多余的標簽等，它的使用相當簡單，使用全面檢測站點功能如下：

（1）、選擇菜單中【站點】的【報告】命令，打開一個窗口。

（2）、選擇檢測范圍，在【報告】選項中有四個內容供選擇：Current Document、Entire Local Site、Select Files in site、Folder。

（3）、對工作流方面的信息進行檢測。

（4）、對HTML文件的信息做出檢查。

把編好的網站文件復制到D:/my web文件夾中，可以打開瀏覽器，在地址欄中輸入http://localhost/my web/index.asp ,就會看見網站了。

3、維護

網站建成后并不意味著網站建設的結束，網站內容需要不斷更新，這樣才會不斷的吸引更多的瀏覽者訪問，才能成為一個優秀的網站。通過FTP軟件將更新過的網頁上傳到服務器或通過Dream weaver MX來遠程管理站點，同時還要認真回復瀏覽者的電子郵件和留言，做到有問比答。平時多收集資料，多聽聽別人建議，定期更新版面，還有推廣站點。

（二）設計技巧和解決方法

用服務器端包含技術實現對文件的引用

系統中有許多頁面都會引用相同的代碼文件，所以使用include語句將已完成代碼的文件包含進來，就可以簡化代碼的縮寫。如首頁面indes.asp中第二行和第三行代碼。

結束語

經過老師耐心細致的指導，及同學之間的相互交流，同時翻閱了大量的資料(包括網上資料，書本及學校的一些相關資料)經過近一段時間的努力，個人網站的設計制作告一段落。總結這次“文武屋-個人網站”開發制作過程，我們綜合使用了目前因特網上比較流行的各種靜態制作方法及交互式動態網站的制作設計手段，并對初步利用后臺程序完成了網站的動態響應與生成網頁的技術。同時也從中學習了對靜態頁面的處理風格，色彩搭配，頁面導航方面有了一定經驗。對用Javascript語言制作動態效果也有了更進一步的認識。在交互式網頁設計學會了如何使用Access建立數據庫，以及對數據庫瀏覽，修改，添加，查詢。如何用ASP編寫程序來方便用戶在網上查看網站各方面的信息和交流。本次設計由于設計時間較緊，且相關模塊比較多，加之設計經驗的不足，在網站的整體設計及各模塊功能可能設計的不完全，有待于進一步的完善和改進。

參考文獻

[1]吳濤主編，網站全程設計技術（修訂本），北京：清華大學出版社；北京交通大學出版社，2006.7 [2]龍馬工作室編，ASP+SQL Server組建動態網站實例精講，北京：人民郵電出版社，2004.8 [3] 趙增敏編，ASP動態網頁設計，電子工業出版社，2003.8 [4] 任學文、范嚴編, 網頁設計與制作，中國科學技術出版社，2006.8 [5] 武創、王惠,網頁設計探索之旅 ,電子工業出版社，2006.9 [6] 杜巧玲等編, 網頁設計超級夢幻組合,清華大學出版社, 2003.3 [7] 吳黎兵、羅云芳編，網頁設計教程，武漢大學出版社，2006.2 [8] 莊王健編，網頁設計三劍客白金教程，電子工業出版社，2006.01

第三篇：簡單的網頁制作教程-設計一個個人網站

題目：設計一個個人網站

一、要求：

1．使用Dreamweave網頁工具制作一個個人網站；

2．包含至少四個網頁: 包括首頁、個人簡介、個人相冊等（可隨意設計），網頁之間用超鏈接相連。

3．網頁中要有圖片和文字內容，用表格進行頁面布局； 4．添加至少兩種行為，并為首頁添加背景音樂。

5.在網站中設計一個表單頁面。

6.首頁必須包含頁面標題，動態按鈕導航欄。

首先新建一個文件夾，文件夾的名字不能為漢字，做網站所有的路徑都必須用字母或者數字，不能用漢字，我們就用名字吧，譬如說名字張三，那文件夾名字就是zs，如圖打開Dreamweaver軟件，得到圖

做網頁要新建站點，關于站點配置服務器什么的，這里不講了，只講建立站點。

選擇站點——新建站點。

我們建的文件夾就是站點根文件夾。新建站點后得到這樣一個界面

點選高級，得到界面

站點名稱與我們建文件夾得名字相同，zs填進去就可以了 本地根文件夾就是我們新建的那個文件夾zs，http地址為http://localhost/zs

接下來選擇左側欄里遠程信息

點擊無后面的那個三角，選擇本地網絡，遠端文件夾同樣選擇我們新建的那個文件夾

接下來點選左面菜單里的測試服務器，點選訪問后面那個三角，選擇本地網絡，測試服務器文件夾也為我們建好的文件夾zs，在url前綴后面加上zs

然后點擊確定就可以了得到這樣一個界面。

下面看老師的第一條要求，是要至少四個網頁，那我們就做四個

單擊新建，然后單擊

接下來，選擇

然后單擊創建，接下單擊文件——保存，保存這個文件，保存在我們一開始建好的文件夾里面，保存名字不能是漢字，只能是字母或者數字，因為我們只坐四個網頁，可以簡單一點，把這四個網頁命名為a、b、c、d，或者1、2、3、4，當然一個網站默認的索引首頁名為index，這里也用index，單擊保存，這樣得到第一個頁面，以同樣的方式建剩下的三個頁面，這里我的首頁默認為index.html，其他三個網頁的名字分別為a.html、b.html、c.html，我們這四個網頁文件已經保存在我們建的文件夾里。

站點中已經有了四個文件。

接下來，我們開始編輯index.html。

單擊index.html，顯示為當前頁面。

單擊拆分，然后我們看這個個網頁就叫張三之家了，同樣的方法給其他三個網頁改名字。A網頁標題，這個就是網頁名字，我們以張三為例，這，這樣老師的第六條我們就完成一半

B網頁標題

C網頁標題

改好名字之后，一一保存，這個不多說了，接下來操作index.html。

顯示首頁為當前編輯頁面。

首先為index.html頁面添加背景音樂。

大家在代碼視圖里找到，這個是什么意思就不解釋了，我也不知道，就是這個了，在后面輸入代碼，然看見這張圖片上，我光標指在哪里了吧，單擊空格鍵，這個時候注意輸入法要為美式鍵盤字母格式，只要不是漢字就行，得到一個菜單，單擊src選中，然后單擊enter建，這個時候緊跟著src會出現一個瀏覽，單擊瀏覽，然后出現對話框，選擇一首音樂，然后單擊確定，會繼續彈出一個對話框點擊是，保存到自己建好的文件夾里面，注意這里不能用漢字做音樂名字，必須改成字母或者數字

我是以beyond的歌為例，名字改為by，點擊保存背景音樂就添加好了。大家可以看一下，在站點目錄下，已經有了這首歌曲。

接下來開始設計頁面布局 這里用表格布局，這個欄叫設計欄，由于大家都不會代碼，所以我們主要在這個欄里操作，下面大家點擊常用里面的表格，就是下面這張圖片

中的這個圖標

得到對話框如圖所示數據： 單擊確定，得到如下界面

這個插入的表格式可以自動調整大小的，大家可以自己試一下，接下來用這些表格布局，給大家看兩個圖標，這個圖標就像是excel中那個合并和拆分單元格是一個意思，左邊那個代表合并單元格，右面那個代表拆分單元格，excel大家都會把，就和那個布局差不錯，我做一個簡單的布局，為了方便，我把這個表格縮小，這個布局很簡單，第二行全部合并，第三行第二三列合并，大家可以根據自己的需要進行拆分合并，還可以在表格里面再次插入表格。

寬度和高度的設置時在代碼里找到

height=””>，其中align表示表格位置，height表示表格高度，大家可以根據自己的需要來填數字，默認是以像素為單位的。

接下來制作導航，這是老師第六條中的第二個要求，注意我在這里給了兩種方法，大家可以先看一下，再決定選擇哪種

我沒看懂什么叫動態按鈕導航條，不知道是讓這個字動呢，還是讓這個字動呢？如果大家嫌麻煩，就直接輸入漢字，結果就是下面這樣的

如果要文字居中顯示可以將這四個框同時選中，然后居中

在水平欄里面選擇

以后所有的文字格式都可以在這里面選，但是首先要選中自己所要操作的文字。

創建鏈接，選中首頁兩個字，然后單擊右鍵——創建鏈接，選擇index.html，然后以同樣的方法，給其他三個欄里的文字做鏈接，創建鏈接的文字會有下劃線，同時改變顏色

如果大家不嫌麻煩，教大家用flash做一個動態的按鈕導航，把光標放在第一行第一個欄里，然后

這個常用欄里的flash按鈕，單擊后面那個小三角，選擇flash按鈕。得到對話框

我們可以看到這個按鈕的樣式是可以自己選擇的，大家隨意選擇一款自己喜歡的按鈕，然后在按鈕文本欄里，填入首頁兩個字，字體設置隨意，然后鏈接

這個欄里填入index.html，注意這里的鏈接就是超級鏈接，當你點擊這個按鈕的時候，它就會顯示主頁，我們設置后面三個按鈕的時候，一定要記得，當你文本欄里填入個人簡介字的時候，那你的鏈接就要指向簡介那個頁面，我們這里就是a.html。其他像什么背景色之類的隨意，然后單擊確定。這樣第一個按鈕就做好了，接下來我們自己做剩下的三個按鈕，注意鏈接問題，大家做好后，可以看到自己站點內多了四個swf格式的文件，這四個就是按鈕，保存的時候，有一個文件問是否要保存，一定要點擊是，不然flash不運行了。

大家可以回到自己的文件夾里，打開首頁，測試一下，是不是單擊這四個按鈕會指向自己所設置的網頁，然后我們給第二行設置背景顏色，以有彈出顏色選框，大家隨意選擇自己喜歡的顏色

單擊背景顏色后面那個方框，可

接下來，完成老師的第五個要求，制作表單，這個把光標指向第三行第一個欄

選在表單選項中的。也就是第一個按鈕，這時得到界面

我們把光標指向紅線里面，輸入“用戶名：”然后點擊表單選項中的第二個按鈕彈出對話框，選擇確定，得到界面

同樣方法換行輸入密碼

再次換行，單擊表單選項中的按鈕項輸入兩個按鈕，然后選中第一個按鈕，得到以下屬性

將值后面欄里的文字改為登錄，同樣方法，把第二個按鈕的值改為注冊。

接下來插入文字和圖片，在現在的第二行第二列里操作

把光標指向第三行第二列，選擇常用欄

選擇這個欄里的圖像按鈕，彈出對話框，這時大家選擇自己電腦里的一張圖片，單擊確定后彈出對話框，問是否保存在站點根目錄下，單擊確定，這時候需要注意的是，圖片名字不能有漢字，圖像標簽和輔助屬性那一欄不用管，單擊確定即可。

接下來就是輸入漢字了，我們在圖片的后面先輸入漢字，可以看到這樣的顯示，上面還空了很大一塊地方，似乎不太好，不符合圖文混排的規矩，大家單擊圖片選中，在屬性欄里找到找到到對齊那一欄，在后面點選左對齊，得到最終圖文效果是這樣的。

第四行還有四個欄，大家可以在里面表明作者時間、以及自己的郵箱、QQ等內容，這里我就不寫了。

實際上做到這里，我們幾乎完成了老師的所有要求了就差添加兩種行為了后面還有三個網頁沒做呢，怎么辦啊，后面三個網頁大家還沒做，教大家一個簡單的方法，大家把鼠標指向了。

這個欄的左邊，在表格和邊框之間，我們可以發現，鼠標斜向右首先單擊鼠標左鍵，選中這個表格然后不要移動鼠標，同時單擊右鍵，單擊拷貝，然后這個表格就拷貝好了，打開其他三個頁面，分別粘貼過去，圖像屬性描述不用管，取消，這樣做的好處是它的好處非常多。

大家打開a.html，這個是個人簡介，就是一個圖文混排了，圖文混排我們已經講過了，更何況我們這個頁面里已經有了圖文混排了，大家可以換一張圖片，換一些文字，做一些自我介紹什么的，都可以。，但是我們最好把那個表單刪掉，哪個是表單就不用我說了吧，就是這個了。刪掉之后，選中第三行三個欄，合并就好了，第二個頁面就做好了，接下來我們看第三個頁面，b.html，這個頁面是個人相冊

這里我同樣分兩種方法給大家講，第一種方法很簡單。就是插入幾張圖片，現在第三行剩下三個空欄，每個欄里插入一張圖片，景色也好，其他也罷，然后加上圖片說明，一切搞定，這個我就不寫了，第二種方法還是用flash做相冊，首先大家合并第三行三個欄。

并將光標指向第三行，然后單擊這個圖片中的插入記錄——媒體——圖像查看器，之后得到這樣的界面

注意這個是可以調節大小的，看你想要多大的相冊了。單擊選中，我們會發現右面多出這樣一個界面flash元素

在其中找到

然后單擊后面的img1那里，會發現后面多出一支筆，單擊那個筆，彈出對話框

單擊減號，將img1三個刪掉，然后再單擊加號，會多出一個文件夾標志，單擊文件夾標志，然后彈出對話框

在自己電腦里選擇一張圖片，將圖片保存到站點根文件夾下，還是那個問題，名字中不能有漢字，添加好第一張圖片之后界面如圖

大家可以多添加幾張圖片，這樣一個相冊就做好了，單擊確定。接下來就剩下第四頁了，就是寫幾行文字的事情了，把表單和圖文混排都刪除，然后合并三個欄，然后添加一些文字，搞定了。這四個頁面都做好了，我們還有一項任務沒有完成，那就是給頁面添加兩個行為

下面我們講添加行為，打開首頁，單擊圖像選中，然后找到一下命令，看到行為面板下那個醒目的加號了嗎 單擊加號——交換圖像，彈出對話框

單擊瀏覽，在自己電腦中找出一張圖片，單擊確定，存放到站點根目錄下，這樣第一個行為就完成了，當我們鼠標滑過這張圖片的時候，就會變為另一張圖片。下面添加第二個行為，我們將光標指向第二行藍色背景哪一行，然后單擊行為面板下的加號——彈出信息，得到對話框

寫上你好，單擊確定。這樣在我們單擊藍色地帶的時候，就會彈出你好信息框。

第四篇：網頁設計與制作-論文（本站推薦）

第一章

緒論

摘 要

本論文將對個人網頁設計與制作的方法、工具等展開研究和探討。在介紹網頁設計與制作語言的基礎上，著重使用JavaScript作為工具語言進行網頁設計與制作的實際操作，分別對基于對象的JavaScript語言、內部對象系統的使用及WEB頁面信息交互——窗口和框架進行詳細描述，并利用具體的實例進行驗證。

本論文主要章節如下，第一章：緒論，本章主要介紹網頁設計的相關知識。第二章：網頁設計語言概述，本章主要介紹網頁設計的語言——HTML，以及用于編輯HTML語言的軟件，為后續工作奠定基礎。第三章：基于對象的JavaScript語言，本章介紹了基于對象的JavaScript中常用內部對象屬性、方法的使用。第四章：內部對象系統的使用，本章主要介紹使用瀏覽器的內部對象系統，可實現與HTML文檔進行交互。第五章：WEB頁面信息的交互——窗體與框架，本章主要介紹實現網頁的動態交互，必須掌握有關窗體對象（Form）和框架對象（Frames）更為復雜的知識。

關鍵詞： 網頁制作；網頁設計；HTML；ASP

第一章

緒論

第一章 緒論

隨著21世紀的到來，人們更深切地感受到計算機在生活和工作中的作用越來越重要，越來越來的職業需要具有計算機的應用技能。掌握計算機是職業的需要，更是事業發展的需要。網頁設計與制作是計算機能力的具體表現，本章主要介紹網頁設計的相關知識。

1.1 網頁設計概述

網站是企業向用戶和網民提供信息(包括產品和服務)的一種方式,是企業開展電子商務的基礎設施和信息平臺，離開網站（或者只是利用第三方網站）去談電子商務是不可能的。企業的網址被稱為“網絡商標”，也是企業無形資產的組成部分，而網站是INTERNET上宣傳和反映企業形象和文化的重要窗口。

1.2 網頁設計的要素

網頁設計的兩大要素是：整體風格和色彩搭配。

一、確定網站的整體風格

在這里，我提供給大家一些參考經驗：

1．將你的標志logo，盡可能的放在每個頁面上最突出的位置。2．突出你的標準色彩。

3．總結一句能反映貴站精髓的宣傳標語！

4．相同類型的圖像采用相同效果，比如說標題字都采用陰影效果，那么在網站中出現的所有標題字的陰影效果的設置應該是完全一致的！

二、網頁色彩的搭配

1．用一種色彩。這里是指先選定一種色彩，然后調整透明度或者飽和度，這樣的頁面看起來色彩統一，有層次感。

2．用兩種色彩。先選定一種色彩，然后選擇它的對比色。

3．用一個色系。簡單的說就是用一個感覺的色彩，例如淡藍，淡黃，淡綠；或者土黃，土灰，土藍。

1.3 大作業目的和意義

本大作業主要是對網頁設計與制作的語言基礎上進行探討，主要內容如下：通過已經做好的網頁，分析html網頁設計技術、XML技術、Java Applet技術和Javascript技術在網頁設計中的應用。

第一章

緒論

1.4 要分析的網頁

第一章

緒論

第一章

緒論

第二章

HTML網頁設計技術的應用

第二章 HTML網頁設計技術的應用

2.1 HTML語言介紹

HTML（HyperText Mark-up Language）即超文本標記語言或超文本鏈接標示語言，是目前網絡上應用最為廣泛的語言，也是構成網頁文檔的主要語言。

HTML文本是由HTML命令組成的描述性文本，HTML命令可以說明文字、圖形、動畫、聲音、表格、鏈接等。HTML的結構包括頭部（Head）、主體（Body）兩大部分，其中頭部描述瀏覽器所需的信息，而主體則包含所要說明的具體內容。

2.1.1 HTML語言的特點

HTML文檔制作不是很復雜，且功能強大，支持不同數據格式的文件鑲入，這也是WWW盛行的原因之一，HTML語言的特點如下：

1、簡易性，HTML版本升級采用超集方式，從而更加靈活方便。

2、可擴展性，HTML語言的廣泛應用帶來了加強功能，增加標識符等要求，HTML采取子類元素的方式，為系統擴展帶來保證。

3、平臺無關性。雖然PC機大行其道，但使用MAC等其他機器的大有人在，HTML可以使用在廣泛的平臺上，這也是WWW盛行的另一個原因。

2.1.2 HTML語言的編輯軟件

HTML的本質是文本，需要瀏覽器的解釋，HTML的編輯器大體可以分為三種：

1、基本編輯軟件，使用WINDOWS自帶的記事本或寫字版都可以編寫，當然，如果你用WPS來編寫，也可以。不過存盤時請使用.htm或.html作為擴展名，這樣瀏覽器就可以解釋執行了。

2、半所見即所得軟件，這種軟件能大大提高開發效率，它可以使你在很短的時間內做出Homepage，且可以學習HTML，這種類型的軟件主要有HOTDOG，還有國產的軟件網頁作坊。

3、所見即所得軟件，使用最廣泛的編輯器，完全可以一點不懂HTML的知識就可以做出網頁，這類軟件主要有Frontpage，DREAMWEAVER、Delphi、Eclipse、UltraEdit。

2.1.4 html語言在網頁設計中的應用

第二章

HTML網頁設計技術的應用

2.2.3JavaScript技術在網頁設計中應用

一、JavaScript概述

JavaScript是一種基于對象(Object)和事件驅動(Event Driven)并具有安全性能的腳本語言。使用它的目的是與HTML超文本標記語言、Java 腳本語言（Java小程序）一起實現在一個Web頁面中鏈接多個對象，與Web客戶交互作用。從而可以開發客戶端的應用程序等。它是通過嵌入或調入在標準的HTML語言中實現的。它的出現彌補了HTML語言的缺陷，它是Java與HTML折衷的選擇，具有以下幾個基本特點：

1、是一種腳本編寫語言

JavaScript是一種腳本語言，它采用小程序段的方式實現編程。像其它腳本語言一樣,JavaScript同樣已是一種解釋性語言,它提供了一個易的開發過程。

它的基本結構形式與C、C++、VB、Delphi十分類似。但它不像這些語言一樣，需要先編譯，而是在程序運行過程中被逐行地解釋。它與HTML標識結合在一起，從而方便用戶的使用操作。

2、基于對象的語言。

JavaScript是一種基于對象的語言，同時以可以看作一種面向對象的。這意味著它能運用自己已經創建的對象。因此，許多功能可以來自于腳本環境中對象的方法與腳本的相互作用。

3、簡單性

JavaScript的簡單性主要體現在：首先它是一種基于Java基本語句和控制流之上的簡單而緊湊的設計, 從而對于學習Java是一種非常好的過渡。其次它的變量類型是采用弱類型，并未使用嚴格的數據類型。

4、安全性

JavaScript是一種安全性語言，它不允許訪問本地的硬盤，并不能將數據存入到服務器上，不允許對網絡文檔進行修改和刪除，只能通過瀏覽器實現信息瀏覽或動態交互。從而有效地防止數據的丟失。

5、動態性的

JavaScript是動態的，它可以直接對用戶或客戶輸入做出響應，無須經過Web服務程序。它對用戶的反映響應，是采用以事件驅動的方式進行的。所謂事件驅動，就是指在主頁(Home Page)中執行了某種操作所產生的動作，就稱為“事件”(Event)。比如按下鼠標、移動窗口、選擇菜單等都可以視為事件。當事件發生后，可能會引起相應的事件響應。

6、跨平臺性

JavaScript是依賴于瀏覽器本身，與操作環境無關，只要能運行瀏覽器的計算機，并支持JavaScript的瀏覽器就可正確執行。從而實現了“編寫一次,走遍天下”的夢想。

實際上JavaScript最杰出之處在于可以用很小的程序做大量的事。無須有高性能的電腦，軟件僅需一個字處理軟件及一瀏覽器，無須WEB服務器通道，通過自己的電腦即可完成所有的事情。

總之，JavaScript 是一種新的描述語言，它可以被箝入到 HTML 的文件之中。JavaScript語言可以做到回應使用者的需求事件(如：form的輸入)，而不用任何的網路來回傳輸資料，所以當一位使用者輸入一項資料時，它不用經過傳給伺服端(server)處理，再傳回來的過程，而直接可以被客戶端(client)的應用程式所處理。

第二章

HTML網頁設計技術的應用

第五章

色彩在網頁中的應用

第五章 色彩在網頁中的應用

5.1色彩在網頁中的應用

色彩是藝術表現的要素之一。在網頁設計中，我們的設計師根據和諧、均衡和重點突出的原則，將不同的色彩進行組合．搭配來構成美麗的頁面。根據色彩對人們心理的影響，合理地加以運用。

先選定一種色彩，然后調整透明度或者飽和度，這樣的頁面看起來色彩統一，有層次感。簡單的說就是用一個感覺的色彩，例如淡藍，淡黃，淡綠；或者土黃，土灰，土藍。

在網頁配色中不要將所有顏色都用到，盡量控制在三至五種色彩以內。背景和前文的對比盡量要大以便突出主要文字內容。

5.2主頁色彩的處理

色彩是人的視覺最敏感的東西。主頁的色彩處理得好，可以錦上添花，達到事半功倍的效果。色彩總的應用原則應該是“總體協調，局部對比”，也就是：主頁的整體色彩效果應該是和諧的，只有局部的、小范圍的地方可以有一些強烈色彩的對比。在色彩的運用上，可以根據主頁內容的需要，分別采用不同的主色調。因為色彩具有象征性，例如：嫩綠色、翠綠色、金黃色、灰褐色就可以分別象征著春、夏、秋、冬。其次還有職業的標志色，例如：軍警的橄欖綠，醫療衛生的白色等。色彩還具有明顯的心理感覺，例如冷、暖的感覺，進、退的效果等。另外，色彩還有民族性，各個民族由于環境、文化、傳統等因素的影響，對于色彩的喜好也存在著較大的差異。充分運用色彩的這些特性，可以使我們的主頁具有深刻的藝術內涵，從而提升主頁的文化品位。

5.3常用的配色方案

1.暖色調。即紅色、橙色、黃色、赭色等色彩的搭配。這種色調的運用，可使主頁呈現溫馨、和煦、熱情的氛圍。

2.冷色調。即青色、綠色、紫色等色彩的搭配。這種色調的運用，可使主頁呈現寧靜、清涼、高雅的氛圍。

3.對比色調。即把色性完全相反的色彩搭配在同一個空間里。例如：紅與綠、黃與紫、橙與藍等。這種色彩的搭配，可以產生強烈的視覺效果，給人亮麗、鮮艷、喜慶的感覺。

第五章

色彩在網頁中的應用

最后，還要考慮主頁底色（背景色）的深、淺，這里借用攝影中的一個術語，就是“高調”和“低調”。底色淺的稱為高調；底色深的稱為低調。底色深，文字的顏色就要淺，以深色的背景襯托淺色的內容（文字或圖片）；反之，底色淡的，文字的顏色就要深些，以淺色的背景襯托深色的內容（文字或圖片）。這種深淺的變化在色彩學中稱為“明度變化”。當然，色彩的明度也不能變化太大，否則屏幕上的亮度反差太強，同樣也會使讀者的眼睛受不了。

5.4合理搭配網頁色彩

網頁的色彩是樹立網站形象的關鍵之一，網頁的背景、文字、圖標、邊框、超鏈接等都要用到色彩。不同的色彩會使瀏覽者有不同的心理感受。合理的搭配色彩，會更好的表現主題，吸引用戶的注意力。網頁色彩涉及到藝術知識，讓美術教師參加網頁色彩設計，可能會出現比較理想的效果。在色彩搭配上要注意色彩的鮮明性、獨特性、合適性、聯想性。背景色和前景色對比要大，以突出主要內容

網站給人的第一印象來自視覺沖擊，不同的色彩搭配產生不同的效果，并可能影響到訪問者的情緒。“標準色彩”是指能體現網站形象和延伸內涵的色彩，要用于網站的標志，標題，主菜單和主色塊。給人以整體統一的感覺。至于其它色彩也可以使用，但應當只是作為點綴和襯托，絕不能喧賓奪主。一般來說，一個網站的標準色彩不超過3種，太多則讓人眼花繚亂。適合于網頁標準色的顏色有：藍色，黃/橙色，黑/灰/白色三大系列色。

第五章

色彩在網頁中的應用

第六章 WEB頁面信息的交互——窗體與框架

要實現網頁的動態交互，必須掌握有關窗體對象（Form）和框架對象（Frames）更為復雜的知識。

6.1窗體基礎知識

窗體對象可以使設計人員能用窗體中不同的元素與客戶機用戶相交互，而用不著在之前首先進行數據輸入，就可以實現動態改變Web文檔的行為。

6.1.1窗體對象

窗體（Form）：它構成了Web頁面的基本元素。通常一個Web頁面有一個窗體或幾個窗體，使用Forms[]數組來實現不同窗體的訪問。

在Forms[0]中共有三個基本元素，而Forms[1]中只有兩個元素。

窗體對象最主要的功能就是能夠直接訪問HTML文檔中的窗體，它封裝了相關的HTML代碼：

6.1.2 窗體對象的方法

窗體對象的方法只有一個--submit()方法，該方法主要功用就是實現窗體信息的提交。如提交Mytest窗體，則使用下列格式：

document.mytest.submit()

第五章

色彩在網頁中的應用

6.1.3 窗體對象的屬性

窗體對象中的屬性主要包括以下：elements name action target encoding method。除Elements外，其它幾個均反映了窗體中標識中相應屬性的狀態，這通常是單個窗體標識；而elements常常是多個窗體元素值的數組，例：

elements[0].Mytable.elements[1] 6.1.4 訪問窗體對象

在JavaScript中訪問窗體對象可由兩種方法實現：（1）通過訪問窗體

在窗體對象的屬性中首先必須指定其窗體名，而后就可以通過下列標識訪問窗體如：document.Mytable()。

（2）通過數組來訪問窗體

除了使用窗體名來訪問窗體外，還可以使用窗體對象數組來訪問窗體對象。但需要注意一點，因窗體對象是由瀏覽器環境的提供的，而瀏覽器環境所提供的數組下標是由0到n。所以可通過下列格式實現窗體對象的訪問：

document.forms[0] document.forms[1] document.forms[2]...6.1.5 引用窗體的先決條件

在JavaScript中要對窗體引用的條件是：必須先在頁面中用標識創建窗體，并將定義窗體部分放在引用之前。

6.2 窗體中的基本元素

窗體中的基本元素由按鈕、單選按鈕、復選按鈕、提交按鈕、重置按鈕、文本框等組成。

在JavaScript中要訪問這些基本元素，必須通過對應特定的窗體元素的數組下標或窗體元素名來實現。每一個元素主要是通過該元素的屬性或方法來引用。其引用的基本格式見下：

formName.elements[].methadName(窗體名.元素名或數組.方法)formName.elemaent[].propertyName(窗體名.元素名或數組.屬性)下面分別介紹：

（1）Text單行單列輸入元素

功能：對Text標識中的元素實施有效的控制。基本屬性：

Name：設定提交信息時的信息名稱。對應于HTML文檔中的Name。Value：用以設定出現在窗口中對應HTML文檔中Value的信息。defaultvalue：包括Text元素的默認值 基本方法：

blur()：將當前焦點移到后臺。

第五章

色彩在網頁中的應用

select()：加亮文字。主要事件：

onFocus：當Text獲得焦點時，產生該事件。OnBlur：從元素失去焦點時，產生該事件。Onselect：當文字被加亮顯示后，產生該文件。onchange：當Text元素值改變時，產生該文件。例：

...（2）textarea多行多列輸入元素

功能：實施對Textarea中的元素進行控制。基本屬性

name：設定提交信息時的信息名稱，對應HTML文檔Textarea的Name。Value：用以設定出現在窗口中對應HTML文檔中Value的信息。Default value：元素的默認值。方法：

blur()：將輸入焦點失去 select()：將文字加亮后 事件：

onBlur:當失去輸入焦點后產生該事件 onFocus:當輸入獲得焦點后，產生該文件 Onchange:當文字值改變時，產生該事件 Onselect:當文字加亮后，產生該文件（3）Select選擇元素

功能：實施對滾動選擇元素的控制。屬性：

name:設定提交信息時的信息名稱，對應文檔select中的name。Length:對應文檔select中的length options:組成多個選項的數組 selectIndex;該下標指明一個選項

select在中每一選項都含有以下屬性： Text:選項對應的文字

selected:指明當前選項是否被選中 Index:指明當前選項的位置 defaultselected:默認選項 事件：

第五章

色彩在網頁中的應用

OnBlur：當select選項失去焦點時，產生該文件。onFocas:當select獲得焦點時，產生該文件。Onchange:選項狀態改變后，產生該事件。（4）Button按鈕

功能：實施對Button按鈕的控制。屬性：

Name:設定提交信息時的信息名稱，對應文檔中button的Name。Value:用以設定出現在窗口中對應HTML文檔中Value的信息。方法：

click()該方法類似于一個按下的按鈕。事件：

onclick當單擊button按鈕時，產生該事件。例 ：

........（5）checkbox檢查框

功能：實施對一個具有復選框中元素的控制。屬性：

name:設定提交信息時的信息名稱。

Value:用以設定出現在窗口中對應HTML文檔中Value的信息。Checked:該屬性指明框的狀態true/false.defauitchecked:默認狀態 方法：

click()該方法使得框的某一個項被選中。事件：

Onclick：當框的選被選中時，產生該事件。（6）radio無線按鈕

功能：實施對一個具單選功能的無線按鈕控制。屬性：

Name：設定提交信息時的信息名稱，對應HTML文檔中的radio的name相同 Value：用以設定出現在窗口中對應HTML文檔中Value的信息，對應HTML文檔中的radio的name。

length：單選按鈕中的按鈕數目。defalechecked:默認按鈕。

checked:指明選中還是沒有選中。

第五章

色彩在網頁中的應用

index:選中的按鈕的位置。方法：

chick():選定一個按鈕。事件：

onclick:單擊按鈕時，產生該事件。（7）hidden:隱藏

功能：實施對一個具有不顯示文字并能輸入字符的區域元素的控制。屬性：

name:設定提交信息時的信息名稱，對應HTML文檔的hidden中的Name。

Value:用以設定出現在窗口中對應HTML文檔中Value的信息，對應HTML文檔hidden中的value。

defaleitvalue:默認值（8）Password口令

功能：實施對具有口令輸入的元素的控制。屬性：

Name:設定提交信息時的信息名稱，對應HTML文檔中password中的name。Value:用以設定出現在窗口中對應HTML文檔中Value的信息，對應HTML文檔中password中的Value。

defaultvalu:默認值 方法：

select():加亮輸入口令域。

blur():使這丟失passward輸入焦點。focus():獲得password輸入焦點。（9）submit提交元素

功能：實施對一個具有提交功能按鈕的控制。屬性：

name:設定提交信息時的信息名稱，對應HTML文檔中submit。

Value:用以設定出現在窗口中對應HTML文檔中Value的信息，對應HTML文檔中value。

方法

click()相當于按下submit按鈕。事件：

onclick()當按下該按鈕時，產生該事件。

6.3窗體對象實例

下面我們演示通過點擊一個按鈕（red）來改變窗口顏色，點擊“調用動態按鈕文檔”調用一個動態按鈕文檔。

test8_1.htm 調用動態按鈕文檔

第五篇：網頁制作論文

網頁制作論文

簡介

網頁制作是網站策劃師、網絡程序員、網頁設計師等崗位，應用各種網絡程序開發技術和網頁設計技術，為企事業單位、公司或個人在全球互聯網上建設站點，并包含域名注冊和主機托管等服務的總稱。其作用為展現公司形象，加強客戶服務，完善網絡業務。網頁制作是企業開展電子商務的基礎設施和信息平臺，是INTERNET上宣傳和反映企業形象和文化的重要窗口。新競爭力也認為注重網站的網絡營銷價值而不是外在表現。網頁制作是指使用標識語言，通過一系列設計、建模、和執行的過程將電子格式的信息通過互聯網傳輸，瀏覽。

網頁制作要能充分吸引訪問者的注意力，讓訪問者產生視覺上的愉悅感。因此在網頁創作的時候就必須將網站的整體設計與網頁設計的相關原理緊密結合起來。網站設計是將策劃案中的內容、網站的主題模式，以及結合自己的認識通過藝術的手法表現出來。

目錄

1.網頁制作的兩種設計模式 2.網頁制作常用工具 3.flash 3.1flash簡介 3.2flash動畫的特點 3.3flash動畫的前景 3.4flash在網頁中的應用 3.5flash制作流程 4.fireworks

4.1fireworks簡介

4.2fireworks在網頁中的應用

4.3fireworks的重要性

4.4fireworks制作流程 5.參考文獻

正文

1.網頁制作的兩種設計模式

從前一般網頁都使用表格進行排版設計，這樣作的優點在于設計制作速度快，尤其在可視化網頁編輯器，如Microsoft FrontPage中，這樣設計顯得直觀而方便，然而這讓越來越復雜的版面需要許多不斷嵌套的表格設計，致使網頁代碼變得冗長復雜，使文件體積增大，且不容易被搜索引擎查找。同時，這樣做也不利于大型網站的改版工作。

于是隨著主流網頁瀏覽器對CSS的支援度提高，近年來興起了一種新的網頁設計模式。被業界稱為“網頁重構”的革命，其核心在于分隔網頁的風格和內容，指標記語言(如HTML,XML)負責定義頁面的內容，但不可以定義任何涉及網站外觀(風格)的東西。而網站風格就由另外的CSS檔案負責。在排版方面，新的模式提倡使用由CSS定義的DIV進行頁面排版，而將表格還原為排列數據的最初功能。這種模式有很多好處，例如可以協助搜尋引擎查找網頁的情況，減小文件提及提高瀏覽速度，且由于一個CSS檔案可以控制多個頁面，這也給改版帶來了很大方便。

由于W3C是該模式極力的倡導者，于是業界鑒定網頁是否符合W3C標準，就可以在W3C網站自動檢測該網站的情況。

這種模式也有缺點，其中一個弱點就是，在不同瀏覽器出來的效果會有分別，但這種情況主要是由于微軟的Internet Explorer對CSS文檔的支持有眾多缺陷造成的。另一方面，開始設計CSS時，并不能清楚看到目標，因此顯得不直觀。

網頁實際是一個文件，他存放在世界某個角落的的某一臺計算機中，而這臺計算機必須是與互聯網相連的。網頁經由網址（URL）來識別與存取，當我們在瀏覽器輸入網址后，經過一段復雜而又快速的程序，網頁文件會被傳送到你的計算機，然后再通過瀏覽器解釋網頁的內容，再展示到你的眼前。

2.網頁制作常用工具

1、dreamweaver,用與編輯HTML、ASP、JSP、PHP時的輔助工具。Dreamweaver是美國MACROMEDIA公司開發的集網頁制作和管理網站于一身的所見即所得網頁編輯器，它是第一套針對專業網頁設計師特別發展的視覺化網頁開發工具，利用它可以輕而易舉地制作出跨越平臺限制和跨越瀏覽器限制的充滿動感的網頁。

2、Frontpage 跟dreamweaver一樣，不過還是dreamweaver好。

3、FLASH 網頁需要畫面流動時的首選擇

4、PS圖象處理軟件，一般網頁都需要有圖片相搭配，PS是款很強大的工具。

5、FW跟PS一樣都是圖象處理軟件，但FW偏向與對網頁的處理。

6、Adobe公司推出的cs3系列，軟件之間兼容性較好。可以用此系列對網站的美工特效進行進一步的修飾美化和優化。

3.flash 3.1flash簡介

Flash最早出現并興起于網絡，是網絡多媒體動畫的重要制作形式，它是macromedia公司推出的交互式矢量圖和 Web 動畫的標準。網頁設計者使用 Flash 創作出既漂亮又可改變尺寸的導航界面以及其他奇特的效果。其運用范圍覆蓋諸多領域如電視廣告、網絡廣告、游戲、演示動畫、課件、網頁、手機動畫等新興媒體。現在由于網絡帶寬的不斷提高，Flash動態網頁以其具備的聲音、動態圖像等多媒體優勢，相信在不遠的將來能夠完全替代靜態（HTML）網頁。

3.2flash動畫的特點

（一）Flash動畫受網絡資源的制約一般比較短小，利用Flash制作的動畫是矢量的，無論把它放大多少倍都不會失真。

（二）Flash動畫具有交互性優勢，可以更好地滿足所有用戶的需要。它可以讓欣賞者的動作成為動畫的一部分。用戶可以通過點擊、選擇等動作，決定動畫的運行過程和結果，這一點是傳統動畫所無法比擬的。

（三）Flash動畫可以放在網上供人欣賞和下載，由于使用的是矢量圖技術，具有檔小、傳輸速度快、播放采用流式技術的特點，因此動畫是邊下載邊播放，如果速度控制得好，則根本感覺不到檔的下載過程。所以Flash動畫在網上被廣泛傳播。

（四）Flash動畫有嶄新的視覺效果，比傳統的動畫更加輕易與靈巧，更加“酷”。不可否認，它已經成為一種新時代的藝術表現形式。

（五）Flash動畫制作的成本非常低，使用Flash制作的動畫能夠大大地減少人力、物力資源的消耗。同時，在制作時間上也會大大減少。

（六）Flash動畫在制作完成后，可以把生成的檔設置成帶保護的格式，這樣維護了設計者的版權利益。

3.3flash動畫的前景

現在的Flash平臺包括:Flash Studio

8、Flash Player

8、Flash in Mobile flex 1.5、以及應用于通信行業的Breeze 5等；未來即將推出的產品包括Browser client Flash Player、Mobile client Flash Player、Apollo Flash+HTML的客戶端工具，以及Flex等企業端工具等。這些工具將滿足設計和開發人員跨越各種開放的和專有的平臺，包括從桌面到移動設備，提供更豐富的網絡內容和互聯網應用，企業也能夠通過Flash應用獲得更大的受益。

（一）網絡視頻鐘情Flash 面對全球超過100萬的Flash開發者的期望，Macromedia也不斷開發新的領域。而用戶對視頻應用的垂青，刺激著Macromedia推出新的工具。在上千開發者的注目下，Macromedia推出了Flash Media Server 2，以鞏固其Flash Platform作為網絡視頻最佳選擇的地位

（二）Flex 2產品線和Flash Player 8.5出手不凡

Macromedia Flex 2產品線和Macromedia Flash Player 8.5是本次發布會的重頭戲。新產品涵蓋RIA的全部應用場景，從電子商務產品配置，到需要與實時數據集成的可視交易應用。

Flash Player目前在全球6億多個桌面和移動設備上安裝,估計新版本在12個月內將被80%的聯網計算機下載。Flash Player 8.5在Flash Player 8的基礎上增加了適合行業使用的編程功能，并構建了先進的跨平臺運行時環境。它備有一個新的虛擬機，可以提供更高的運行性能、全面的運行錯誤報告、增強型調試功能以及支持ActionScript 3。ActionScript 3遵守最新的ECMA Script規范，能夠更易于查找及解決問題，從而提高開發人員的工作效率。

3.4flash在網頁中的應用

在網絡高速發展的今天,越來越多的人們已經不再滿意圖文并茂的靜態網頁格式,動態網頁應運而生,但是一般的動態圖片和網站的背景音樂應用并不合拍.什么時候可以把多媒體應用在網站上呢 Flash正是在這一網絡發展的大背景下應運而生的,前身是Future Splash.Flash1.0版本誕生于1996年,由于當時的網絡大背景,Flash在出道之時并沒有得到計算機行業應有的重視,Flash真正的火爆是從Flash3.0版本開始的,到了1999年6月發布的Flash4.0版本,其制作的動畫開始大量的在網上傳播,已經逐漸成為了網頁交互多媒體動畫設計軟件的標準.現在,Flash5.0以其特有的ActionScript腳本編程,正在以極快的速度追趕HTML網頁標準.它改變了以往靜態的,枯燥的,網頁形式,利用它短小精悍的文件體積和插件,利用它簡單易學的操作方式,利用它的“流”式播放形式豐富我們的網絡生活.試想,如果它真的超過HTML成為未來的網頁設計軟件的主流,那也將是網絡的一場革命,也是網絡生活的福音.3.5flash制作流程

（1）建立一個新的場景

依次選擇“文件”、“新建”、“Flash文檔”命令，建立空白文檔，大小為550*400像素，背景為白色。

（1）

（2）重新命名場景和涂層名稱

依次選擇“窗口”、“設計面板”、“場景”命令，在彈出的場景面板中雙擊默認場景名稱，改為“跳動的小球”。然后重新命名涂層名稱，雙擊默認涂層名稱，改為“地面”。然后用水平線表示地面，選擇筆觸顏色為黑色，單擊“線條工具”按鈕，在第一幀的舞臺下方，拖動鼠標畫一條直線表示地面。

（2）

（3）插入水平線結束幀

單擊水平線涂層第35幀的小方框，選中該幀；依次選擇“插入”、“時間軸”、“關鍵幀”命令，在地面層的1到35幀之間插入了相同的水平線。

（3）（4）插入跳動的小球涂層，畫小球的初始狀態

雙擊默認的涂層名，改為跳動的小球涂層，此圖層處于激活狀態。設置填充色為黑色，在第一幀的舞臺上方，畫一個小球，刪除輪廓線。

（4）

（5）插入下一幀

單擊跳動的小球層第二幀的小方框，選中該幀；依次選擇“插入”、“時間軸”、“關鍵幀”命令，在第二幀中復制第一幀的圖形；拖動小球向下移動一個距離，表示球在下落。

（5）

（6）制作下落動作的變化

重復上一步驟。

（6）

（7）小球變形

在下一幀的位置插入關鍵幀，利用任意變性工具把小球縱向壓縮。單擊“任意變形”按鈕,指針根據可實現的變形方式箭頭右下方的小圖形會有所變化；單擊小球，小球周圍出現8個黑色句柄框；把鼠標指針移動到4個中間句柄處，拖動鼠標，把圓球編程橢球形。

（7）

（8）多次重復上面步驟，在不同的幀中，制作小球被壓扁后又彈起的畫面。參照第9步，制作小球被壓扁后又彈起的畫面。重復上述步驟，直到小球靜止。4.fireworks 4.1fireworks簡介

Fireworks是Macromedia公司發布的一款專為網絡圖形設計的圖形編輯軟件，它大大簡化了網絡圖形設計的工作難度，無論是專業設計家還是業余愛好者，使用Fireworks都不僅可以輕松地制作出十分動感的GIF動畫，還可以輕易地完成大圖切割、動態按鈕、動態翻轉圖等，因此，對于輔助網頁編輯來說，Fireworks將是最大的功臣。借助于 Macromedia Fireworks 8，您可以在直觀、可定制的環境中創建和優化用于網頁的圖像并進行精確控制。Fireworks 業界領先的優化工具可幫助您在最佳圖像品質和最小壓縮大小之間達到平衡。它與 Macromedia Dreamweaver? 和 Macromedia Flash? 共同構成的集成工作流程可以讓您創建并優化圖像，同時又能避免由于進行 Roundtrip 編輯而丟失信息或浪費時間。利用可視化工具，無需學習代碼即可創建具有專業品質的網頁圖形和動畫，如變換圖像和彈出菜單等。

4.2fireworks在網頁中的應用

眾所周知，在網頁上的jpg圖片如果過大，會嚴重影響頁面的打開速度，Fireworks提供優化圖片的功能，即縮小圖片的KB，而且不影響畫面的質量（除非放大了與原圖對比）。由于很多人喜歡用photoshop制作jpg圖片，所以它的容量會很大（因為它是適合處理印刷品，要求比較清晰），最終還是要用Fireworks來處理一下。

在優化面板里有“導出jpg較高品質”，導出默認的80品質（可以用“2幅”畫面對比之前之后的大小）。

4.3fireworks的重要性

為Macromedia家族的一員，三劍客之一的fireworks，她的主要任務和特色就是制作矢量圖為網頁服務,FW也是Flash的最佳伴侶,在三劍客的MX系列中,FW和Flash的聯系更為緊密,所以無論是網頁制作和Flash制作,Fw都是不可或缺的利器.在Fw3年的應用實踐過程中,我無時無刻不在感受她的卓越和便利。的確,網頁制作看重的是效果和速度,并不是你用的軟件專業與否,你用了多少個軟件作出的網頁,設計師作出的網頁是為了讓大家接受而不是顯示自己的本領,在這樣的前提下,Fw的確是最好的選擇,最好的矢量圖效果,最快的速度。

4.4fireworks制作流程

1.準備素材 如圖

2、因為這幅圖片是位圖，我們可以用魔術棒將電視機中間的畫面選取成選區

2.選擇菜單——將選取框轉換為路徑，得到電視畫面的輪廓路徑。當然，也可以用鋼筆工具勾勒

出

電

視

畫

面的路

徑

4.將選中區域填充成折疊漸變

顏色可以自己選擇：

5.用選取工具拖動漸變方向手柄，接近垂直或接近水平方向：

6.將調整手柄以初選中區域 并在幀屬性，選取重制幀命令：選擇三幀 或在多些

7.依次選擇其他幀，拖動漸變調整手柄將其改變位置：柄以初選中區域 并在幀屬性幀命令：

最后保存 導出gif圖片 即可完成。

1.在Fireworks中打開一個新的畫布，調整畫布大小，選擇工具欄中的文本工具，輸入第一個數字，并設置好文字的字體、像素大小等樣式

2.輸入文本 1 然后再打開幀屬性 選擇重置幀 9 因為數字0-9 一共是十個

3.然后選擇每一幀，并修改畫布中的相應數字。

4.幀面板中右手邊顯示的是默認的幀延時值7毫秒，即7/100秒的速度。如果速度過快 可以修改值 選擇頂部幀，按住Shift鍵，點擊底部的最后一幀，全選這些幀，在幀延時值處雙擊，在顯示的對話框中設置一個更高的值。更高值將減慢動畫的播放速度。5.最后一步，打開優化面板，設置導出文件格式為“Gif動畫”，如圖：

6.也可以在幀面板的底部設置Gif動畫循環，默認為“永久”選項

7.畫布顏色可以隨意更改 再按f12 預覽就可以了，最后導出文件

5.參考文獻

[1]劉宇.Flash短片輕松學中國大陸.電子工業出版社，2009-01.[2]章精設，胡登濤.Flash Action Script 3.0從入門到精通.清華大學出版設，2008-10.[3]陳冰.Flash第1步:ActionScript編程篇(珍藏版).清華大學出版社，2006-03

下載網頁制作論文--個人網站設計.doc

將本文檔下載到自己電腦，方便修改和收藏，請勿使用迅雷等下載。

點此處下載文檔

文檔為doc格式