第一篇：《網(wǎng)頁設(shè)計與制作》習題集
《網(wǎng)頁設(shè)計與制作》習題集
一、判斷題：
1、Dreamweaver 是美國Macromedia公司開發(fā)的集網(wǎng)頁制作與管理網(wǎng)站于一身的網(wǎng)頁編輯器和開發(fā)工具?！?/p>
2、一個WEB站點至少需要一個主頁（home Page），可以有其他子頁（二級頁面等）?！?/p>
3、網(wǎng)頁的交互是指瀏覽者單擊欄目、超級鏈接等，以及鼠標經(jīng)過或放于某處時，頁面會作出相應的反應。√
4、網(wǎng)頁是指采用超文本標記語言編寫的，可以在瀏覽器下瀏覽的一種文檔?！?/p>
5、一個超級鏈接鏈接的地址為：this.html#x11，其中x11是this.html頁中的某個錨點?！?/p>
6、Dreamweaver 支持在網(wǎng)頁中插入各種圖像，簡單的方法是選擇Insert（插入）菜單的中的image(圖像)子菜單項。√
7、若某網(wǎng)頁背景顏色設(shè)置為FFFFF，則背景的顏色為黑色。×
8、采用目錄與錨點結(jié)合的辦法，可以實現(xiàn)在長的網(wǎng)頁文檔內(nèi)部跳轉(zhuǎn)的功能?！?/p>
9、在網(wǎng)頁設(shè)計過程中，有時需要將幾個單元格進行合并，一般在Dreamweaver中操作方法是，拖動鼠標，將需要合并的單元格選中，然后點擊屬性工具欄中的“合并單元格”。√
10、選中表格后，Dreamweaver 中即可顯示表格屬性，即可對表格的對齊方式、高度、寬度，邊框樣式等進行設(shè)置。√11、12、在Dreamweaver中，非連續(xù)的單元格也可直接合并?！?/p>
對于框架網(wǎng)頁的保存方法是，若要保存所有框架頁，則在菜單項里選擇“file(文件)”菜單下的“save(保存）”即可?！?/p>
13、一幅圖像在網(wǎng)頁中是作為一個獨立的對象插入的，但是如果情況需要，則可以一幅圖象中設(shè)置多個“對象點”完成特定的功能，這個就是圖像熱點?！?/p>
14、若需要對文件進行超級鏈接設(shè)定，只需選中文字，鼠標右鍵打開屬性中在Link（鏈接）項中輸入需要鏈接的URL即可。√
15、在制作網(wǎng)頁顯示時，若有一些網(wǎng)頁，他們有共同的標題、共同的目錄格式，只是某些內(nèi)容部分不太相同，這時，可以應用框架網(wǎng)頁來加快網(wǎng)頁的顯示速度，避免重復載入頁面?！?/p>
16、WEB站點是指一系列可以通過Internet 瀏覽器瀏覽的，具有相互超級鏈接的多媒體文檔的集合以及完成這些文檔的存放、查找、搜索、發(fā)布的物理設(shè)備和其他相關(guān)軟硬件系統(tǒng)的集合√
17、在制作框架網(wǎng)頁時，如果需要保存所有框架網(wǎng)頁，則只需要選擇文件菜單中的SAVE即可保存所有框架網(wǎng)頁。×
18、作為網(wǎng)頁定位技術(shù)的表格與層，相對來說表格更為通用，因為層需要瀏覽器的支持，而表格在任何瀏覽器下都沒有問題。√
19、網(wǎng)頁中引入層技術(shù)，在層中可以插入各種對象，而且各個層可以嵌套、重疊、交蓋等，但不是所有的瀏覽器都支持層技術(shù)?！?20、21、表單網(wǎng)頁中，一頁表單，至少且只能有一個表單標記，至少有一個提交的按鈕?！?網(wǎng)頁制作中，層的“Z-index”屬性表示層的層疊次序，數(shù)值大于0表示在頁面的上面，數(shù)據(jù)小于0表示在頁面的上面，數(shù)值越大就越先看見?！?/p>
22、√23、24、firework 中進行網(wǎng)頁布局的原理可以說就是利用層進行不同區(qū)域和對象的設(shè)置?！?Fireworks 是Macromedia 公司推出的圖象制作與處理軟件，提供圖像的創(chuàng)建、制作和處在Dreamweaver里，層與表格之間是可以轉(zhuǎn)換的，但要求層之間不能有重疊多層的情況。理功能。√25、26、√27、28、29、flash中的導線工具，在真正的層中顯示時并不可見。×
GIF動畫的文件大小相對較大，若用flash 導入后轉(zhuǎn)換為矢量動畫就可縮小?！?在追求速度為先的網(wǎng)頁設(shè)計時，可以多用圖象，在追求美觀為先的網(wǎng)頁設(shè)計時，可以多用Flash中，可以用導線來控制對象按照預定的軌跡運動。√
在Fireworks 處理過程中，在同一頁上，可以用不同層制作兩個運動不相關(guān)的多幀動畫。文字?！?30、Dreamweaver模板可以在局部應用，但不能應用于整個站點?！?/p>
二、多項選擇題：
1、在網(wǎng)頁中錄入文檔的方法有：
abc A)直接錄入法。
B）從已有的文檔中通過剪貼板復制剪切粘貼的方法。C）修改錄入的文檔的方法。D）以上均不正確
2、關(guān)于Dreamweaver的操作界面，下列說法正確的是：abd A)工具箱包含了常用的工具，制作網(wǎng)頁時用到這些工具。
B)對象屬性浮動工具欄，對網(wǎng)頁制作時選擇的對象相適應，用來設(shè)置對象的屬性。C)狀態(tài)欄，是表示出被編輯網(wǎng)頁的效果。
D)狀態(tài)欄，是表示出被編輯網(wǎng)頁中正在被編輯的標記名。
3、下列不屬于站點管理器的功能的是：ab A)可以實現(xiàn)快速超級鏈接。
B）可以自動糾正超級鏈接的更改。C）可以自動發(fā)布制作好的網(wǎng)頁。D）可以自動升級網(wǎng)站的WEB服務(wù)。
4、在框架式網(wǎng)頁中添加超級鏈接時，如果對象的“target(目標框架)”屬性為以下時，則可以新窗口打開鏈接頁。abd A)_blank
B）_parent
C）_self
D）_top
E）main
5、在框架式網(wǎng)頁中添加超級鏈接時，對象的“target ”屬性分別表示的意思正確的是：abc A)_blank 在新窗口打開網(wǎng)頁
B）_parent 在父框架窗口打開網(wǎng)頁 C）_self 在本窗口打開網(wǎng)頁
D）以上都不正確
6、網(wǎng)頁中的若有多層，下列哪個屬性決定層的視覺關(guān)系。ac A)Z-index
B）Layer
C）Top
D）left
7、Dreamweaver 能實現(xiàn)的關(guān)于站點管理的內(nèi)容有：abcd A)檢查站點的超級鏈接
B）生成站點報告、錯誤查找和修改。C）定義站點
D）測試站點
8、在網(wǎng)頁中插入水平線，一般可以設(shè)置水平線的以下屬性abc A)水平線的寬度。B）水平線的顏色。C）水平線的粗細程度。D）水平線的層疊次序。
9、網(wǎng)頁中的超級鏈接可以鏈接到。abcd A)鏈接到本網(wǎng)站中的其他網(wǎng)頁。
B）鏈接到本文件中某錨點位置。
C）可以其他站點中的某個位置。
D）可以鏈接到某網(wǎng)站中的某個文件對象。
10、在Dreamweaver MX 中，站點管理包括五大設(shè)置項，下列說法錯誤的是：bcd A)Local info 設(shè)置站點的名稱、本地文件夾映射位置，站點在Internet 上的位置等。B)Remote info 設(shè)置站點的遠程信息，包括遠程服務(wù)器的訪問方式，帳號、密碼等。C)Design Notes 設(shè)置網(wǎng)頁設(shè)計過程中是還否保持制作的記錄等。D)Quick View 設(shè)置站點網(wǎng)頁顯示效果。
E)Site Map Layer 站點地圖項，設(shè)置站點地圖的顯示方式等。
11、在firework 中存儲圖象時，下列說法正確的是：abcd A)選擇GIF圖像是單幅靜止圖像。
B）選擇Animated GIF 是連續(xù)的圖像對象，是動畫。C）選擇Png則保留firework 制作過程數(shù)據(jù)
D）選擇Jpeg 則是一幅靜止的圖像。
12、Fireworks 默認保存的文件格式是什么格式？a A)Png文件
B）JPG文件
C）PCX文件
D）TIF文件
13、下列關(guān)于Flash的說法不正確的是：d A)Flash是由Macromedia 公司出品的軟件。B)Flash 是一個矢量圖形編輯和動畫創(chuàng)作軟件。
C)Flash 制作出來的影片可能會比較小，因為它使用了矢量圖形技術(shù)。D)Flash 制作出來的影片可能會比較大，因為它使用了矢量圖形技術(shù)
14、下列關(guān)于Html標記不正確的是d A)a標記 用來標記超級鏈接
B）img標記 用來插入圖片 C）table標記 用來插入表格
D）table 標記 用來插入框架網(wǎng)頁
15、在網(wǎng)頁中可以直接插入以下內(nèi)容（單選）d A)圖片
B）動畫
C）超級鏈接
D）以上都可以直接插入
三、簡答題：
1、Dreamweaver MX 2004 是怎么樣一個軟件，它可用來做什么？(p185)
2、什么是圖象熱點？在網(wǎng)頁中插入圖象以后，若要使用圖象熱點，應如何操作？
3、在網(wǎng)頁中如何添加背景聲音？(p243)
4、請敘述在網(wǎng)頁中添加彈出式菜單的方法。(p239)
5、網(wǎng)頁制作技術(shù)中，什么是行為控制，試舉例說明(p237)
6、Fireworks 是怎么樣一個軟件，它的主要功能是什么，有什么特色？(p109)
7、在Fireworks 中，什么情況下適合用逐幀動畫制作方式？什么情況下適合用起始兩幀動畫制作方式，什么情況下適合用單幀動畫制作方式？(P147)
8、請敘述Flash 中導線工具的使用方法。(p40)
9、在Fireworks 進行網(wǎng)頁布局的原理是什么？p(172)
10、試描述HTML的基本語法，用簡單網(wǎng)頁的源代碼示例。(p289)
四、綜合題：
1、請補充完整一個標準的HTML基本頁面的HTML代碼
2、試談?wù)勈醉摰闹谱鳎瑥氖醉摰娘L格模式，內(nèi)容，所采用的網(wǎng)頁技術(shù)等多方面考慮(p289)
3、如需要在Flash 中實現(xiàn)將某些文字從左邊移動到右邊，則應如何做？(p29)
4、嘗試使用框架網(wǎng)頁制作，要求有標題頁一個，目錄頁一個，內(nèi)容頁一個，其他自選，在Dreamweaver中制作過程應是?p(223)-
5、網(wǎng)頁中模板的使用是怎么一回事，如何在Dreamweaver中建立模板與使用模板？(P257)8
第二篇：網(wǎng)頁設(shè)計與制作-論文（本站推薦）
第一章
緒論
摘 要
本論文將對個人網(wǎng)頁設(shè)計與制作的方法、工具等展開研究和探討。在介紹網(wǎng)頁設(shè)計與制作語言的基礎(chǔ)上，著重使用JavaScript作為工具語言進行網(wǎng)頁設(shè)計與制作的實際操作，分別對基于對象的JavaScript語言、內(nèi)部對象系統(tǒng)的使用及WEB頁面信息交互——窗口和框架進行詳細描述，并利用具體的實例進行驗證。
本論文主要章節(jié)如下，第一章：緒論，本章主要介紹網(wǎng)頁設(shè)計的相關(guān)知識。第二章：網(wǎng)頁設(shè)計語言概述，本章主要介紹網(wǎng)頁設(shè)計的語言——HTML，以及用于編輯HTML語言的軟件，為后續(xù)工作奠定基礎(chǔ)。第三章：基于對象的JavaScript語言，本章介紹了基于對象的JavaScript中常用內(nèi)部對象屬性、方法的使用。第四章：內(nèi)部對象系統(tǒng)的使用，本章主要介紹使用瀏覽器的內(nèi)部對象系統(tǒng)，可實現(xiàn)與HTML文檔進行交互。第五章：WEB頁面信息的交互——窗體與框架，本章主要介紹實現(xiàn)網(wǎng)頁的動態(tài)交互，必須掌握有關(guān)窗體對象（Form）和框架對象（Frames）更為復雜的知識。
關(guān)鍵詞： 網(wǎng)頁制作；網(wǎng)頁設(shè)計；HTML；ASP
第一章
緒論
第一章 緒論
隨著21世紀的到來，人們更深切地感受到計算機在生活和工作中的作用越來越重要，越來越來的職業(yè)需要具有計算機的應用技能。掌握計算機是職業(yè)的需要，更是事業(yè)發(fā)展的需要。網(wǎng)頁設(shè)計與制作是計算機能力的具體表現(xiàn)，本章主要介紹網(wǎng)頁設(shè)計的相關(guān)知識。
1.1 網(wǎng)頁設(shè)計概述
網(wǎng)站是企業(yè)向用戶和網(wǎng)民提供信息(包括產(chǎn)品和服務(wù))的一種方式,是企業(yè)開展電子商務(wù)的基礎(chǔ)設(shè)施和信息平臺，離開網(wǎng)站（或者只是利用第三方網(wǎng)站）去談電子商務(wù)是不可能的。企業(yè)的網(wǎng)址被稱為“網(wǎng)絡(luò)商標”，也是企業(yè)無形資產(chǎn)的組成部分，而網(wǎng)站是INTERNET上宣傳和反映企業(yè)形象和文化的重要窗口。
1.2 網(wǎng)頁設(shè)計的要素
網(wǎng)頁設(shè)計的兩大要素是：整體風格和色彩搭配。
一、確定網(wǎng)站的整體風格
在這里，我提供給大家一些參考經(jīng)驗：
1．將你的標志logo，盡可能的放在每個頁面上最突出的位置。2．突出你的標準色彩。
3．總結(jié)一句能反映貴站精髓的宣傳標語！
4．相同類型的圖像采用相同效果，比如說標題字都采用陰影效果，那么在網(wǎng)站中出現(xiàn)的所有標題字的陰影效果的設(shè)置應該是完全一致的！
二、網(wǎng)頁色彩的搭配
1．用一種色彩。這里是指先選定一種色彩，然后調(diào)整透明度或者飽和度，這樣的頁面看起來色彩統(tǒng)一，有層次感。
2．用兩種色彩。先選定一種色彩，然后選擇它的對比色。
3．用一個色系。簡單的說就是用一個感覺的色彩，例如淡藍，淡黃，淡綠；或者土黃，土灰，土藍。
1.3 大作業(yè)目的和意義
本大作業(yè)主要是對網(wǎng)頁設(shè)計與制作的語言基礎(chǔ)上進行探討，主要內(nèi)容如下：通過已經(jīng)做好的網(wǎng)頁，分析html網(wǎng)頁設(shè)計技術(shù)、XML技術(shù)、Java Applet技術(shù)和Javascript技術(shù)在網(wǎng)頁設(shè)計中的應用。
第一章
緒論
1.4 要分析的網(wǎng)頁
第一章
緒論
第一章
緒論
第二章
HTML網(wǎng)頁設(shè)計技術(shù)的應用
第二章 HTML網(wǎng)頁設(shè)計技術(shù)的應用
2.1 HTML語言介紹
HTML（HyperText Mark-up Language）即超文本標記語言或超文本鏈接標示語言，是目前網(wǎng)絡(luò)上應用最為廣泛的語言，也是構(gòu)成網(wǎng)頁文檔的主要語言。
HTML文本是由HTML命令組成的描述性文本，HTML命令可以說明文字、圖形、動畫、聲音、表格、鏈接等。HTML的結(jié)構(gòu)包括頭部（Head）、主體（Body）兩大部分，其中頭部描述瀏覽器所需的信息，而主體則包含所要說明的具體內(nèi)容。
2.1.1 HTML語言的特點
HTML文檔制作不是很復雜，且功能強大，支持不同數(shù)據(jù)格式的文件鑲?cè)?，這也是WWW盛行的原因之一，HTML語言的特點如下：
1、簡易性，HTML版本升級采用超集方式，從而更加靈活方便。
2、可擴展性，HTML語言的廣泛應用帶來了加強功能，增加標識符等要求，HTML采取子類元素的方式，為系統(tǒng)擴展帶來保證。
3、平臺無關(guān)性。雖然PC機大行其道，但使用MAC等其他機器的大有人在，HTML可以使用在廣泛的平臺上，這也是WWW盛行的另一個原因。
2.1.2 HTML語言的編輯軟件
HTML的本質(zhì)是文本，需要瀏覽器的解釋，HTML的編輯器大體可以分為三種：
1、基本編輯軟件，使用WINDOWS自帶的記事本或?qū)懽职娑伎梢跃帉懀斎?，如果你用WPS來編寫，也可以。不過存盤時請使用.htm或.html作為擴展名，這樣瀏覽器就可以解釋執(zhí)行了。
2、半所見即所得軟件，這種軟件能大大提高開發(fā)效率，它可以使你在很短的時間內(nèi)做出Homepage，且可以學習HTML，這種類型的軟件主要有HOTDOG，還有國產(chǎn)的軟件網(wǎng)頁作坊。
3、所見即所得軟件，使用最廣泛的編輯器，完全可以一點不懂HTML的知識就可以做出網(wǎng)頁，這類軟件主要有Frontpage，DREAMWEAVER、Delphi、Eclipse、UltraEdit。
2.1.4 html語言在網(wǎng)頁設(shè)計中的應用
第二章
HTML網(wǎng)頁設(shè)計技術(shù)的應用
2.2.3JavaScript技術(shù)在網(wǎng)頁設(shè)計中應用
一、JavaScript概述
JavaScript是一種基于對象(Object)和事件驅(qū)動(Event Driven)并具有安全性能的腳本語言。使用它的目的是與HTML超文本標記語言、Java 腳本語言（Java小程序）一起實現(xiàn)在一個Web頁面中鏈接多個對象，與Web客戶交互作用。從而可以開發(fā)客戶端的應用程序等。它是通過嵌入或調(diào)入在標準的HTML語言中實現(xiàn)的。它的出現(xiàn)彌補了HTML語言的缺陷，它是Java與HTML折衷的選擇，具有以下幾個基本特點：
1、是一種腳本編寫語言
JavaScript是一種腳本語言，它采用小程序段的方式實現(xiàn)編程。像其它腳本語言一樣,JavaScript同樣已是一種解釋性語言,它提供了一個易的開發(fā)過程。
它的基本結(jié)構(gòu)形式與C、C++、VB、Delphi十分類似。但它不像這些語言一樣，需要先編譯，而是在程序運行過程中被逐行地解釋。它與HTML標識結(jié)合在一起，從而方便用戶的使用操作。
2、基于對象的語言。
JavaScript是一種基于對象的語言，同時以可以看作一種面向?qū)ο蟮?。這意味著它能運用自己已經(jīng)創(chuàng)建的對象。因此，許多功能可以來自于腳本環(huán)境中對象的方法與腳本的相互作用。
3、簡單性
JavaScript的簡單性主要體現(xiàn)在：首先它是一種基于Java基本語句和控制流之上的簡單而緊湊的設(shè)計, 從而對于學習Java是一種非常好的過渡。其次它的變量類型是采用弱類型，并未使用嚴格的數(shù)據(jù)類型。
4、安全性
JavaScript是一種安全性語言，它不允許訪問本地的硬盤，并不能將數(shù)據(jù)存入到服務(wù)器上，不允許對網(wǎng)絡(luò)文檔進行修改和刪除，只能通過瀏覽器實現(xiàn)信息瀏覽或動態(tài)交互。從而有效地防止數(shù)據(jù)的丟失。
5、動態(tài)性的
JavaScript是動態(tài)的，它可以直接對用戶或客戶輸入做出響應，無須經(jīng)過Web服務(wù)程序。它對用戶的反映響應，是采用以事件驅(qū)動的方式進行的。所謂事件驅(qū)動，就是指在主頁(Home Page)中執(zhí)行了某種操作所產(chǎn)生的動作，就稱為“事件”(Event)。比如按下鼠標、移動窗口、選擇菜單等都可以視為事件。當事件發(fā)生后，可能會引起相應的事件響應。
6、跨平臺性
JavaScript是依賴于瀏覽器本身，與操作環(huán)境無關(guān)，只要能運行瀏覽器的計算機，并支持JavaScript的瀏覽器就可正確執(zhí)行。從而實現(xiàn)了“編寫一次,走遍天下”的夢想。
實際上JavaScript最杰出之處在于可以用很小的程序做大量的事。無須有高性能的電腦，軟件僅需一個字處理軟件及一瀏覽器，無須WEB服務(wù)器通道，通過自己的電腦即可完成所有的事情。
總之，JavaScript 是一種新的描述語言，它可以被箝入到 HTML 的文件之中。JavaScript語言可以做到回應使用者的需求事件(如：form的輸入)，而不用任何的網(wǎng)路來回傳輸資料，所以當一位使用者輸入一項資料時，它不用經(jīng)過傳給伺服端(server)處理，再傳回來的過程，而直接可以被客戶端(client)的應用程式所處理。
第二章
HTML網(wǎng)頁設(shè)計技術(shù)的應用
第五章
色彩在網(wǎng)頁中的應用
第五章 色彩在網(wǎng)頁中的應用
5.1色彩在網(wǎng)頁中的應用
色彩是藝術(shù)表現(xiàn)的要素之一。在網(wǎng)頁設(shè)計中，我們的設(shè)計師根據(jù)和諧、均衡和重點突出的原則，將不同的色彩進行組合．搭配來構(gòu)成美麗的頁面。根據(jù)色彩對人們心理的影響，合理地加以運用。
先選定一種色彩，然后調(diào)整透明度或者飽和度，這樣的頁面看起來色彩統(tǒng)一，有層次感。簡單的說就是用一個感覺的色彩，例如淡藍，淡黃，淡綠；或者土黃，土灰，土藍。
在網(wǎng)頁配色中不要將所有顏色都用到，盡量控制在三至五種色彩以內(nèi)。背景和前文的對比盡量要大以便突出主要文字內(nèi)容。
5.2主頁色彩的處理
色彩是人的視覺最敏感的東西。主頁的色彩處理得好，可以錦上添花，達到事半功倍的效果。色彩總的應用原則應該是“總體協(xié)調(diào)，局部對比”，也就是：主頁的整體色彩效果應該是和諧的，只有局部的、小范圍的地方可以有一些強烈色彩的對比。在色彩的運用上，可以根據(jù)主頁內(nèi)容的需要，分別采用不同的主色調(diào)。因為色彩具有象征性，例如：嫩綠色、翠綠色、金黃色、灰褐色就可以分別象征著春、夏、秋、冬。其次還有職業(yè)的標志色，例如：軍警的橄欖綠，醫(yī)療衛(wèi)生的白色等。色彩還具有明顯的心理感覺，例如冷、暖的感覺，進、退的效果等。另外，色彩還有民族性，各個民族由于環(huán)境、文化、傳統(tǒng)等因素的影響，對于色彩的喜好也存在著較大的差異。充分運用色彩的這些特性，可以使我們的主頁具有深刻的藝術(shù)內(nèi)涵，從而提升主頁的文化品位。
5.3常用的配色方案
1.暖色調(diào)。即紅色、橙色、黃色、赭色等色彩的搭配。這種色調(diào)的運用，可使主頁呈現(xiàn)溫馨、和煦、熱情的氛圍。
2.冷色調(diào)。即青色、綠色、紫色等色彩的搭配。這種色調(diào)的運用，可使主頁呈現(xiàn)寧靜、清涼、高雅的氛圍。
3.對比色調(diào)。即把色性完全相反的色彩搭配在同一個空間里。例如：紅與綠、黃與紫、橙與藍等。這種色彩的搭配，可以產(chǎn)生強烈的視覺效果，給人亮麗、鮮艷、喜慶的感覺。
第五章
色彩在網(wǎng)頁中的應用
最后，還要考慮主頁底色（背景色）的深、淺，這里借用攝影中的一個術(shù)語，就是“高調(diào)”和“低調(diào)”。底色淺的稱為高調(diào)；底色深的稱為低調(diào)。底色深，文字的顏色就要淺，以深色的背景襯托淺色的內(nèi)容（文字或圖片）；反之，底色淡的，文字的顏色就要深些，以淺色的背景襯托深色的內(nèi)容（文字或圖片）。這種深淺的變化在色彩學中稱為“明度變化”。當然，色彩的明度也不能變化太大，否則屏幕上的亮度反差太強，同樣也會使讀者的眼睛受不了。
5.4合理搭配網(wǎng)頁色彩
網(wǎng)頁的色彩是樹立網(wǎng)站形象的關(guān)鍵之一，網(wǎng)頁的背景、文字、圖標、邊框、超鏈接等都要用到色彩。不同的色彩會使瀏覽者有不同的心理感受。合理的搭配色彩，會更好的表現(xiàn)主題，吸引用戶的注意力。網(wǎng)頁色彩涉及到藝術(shù)知識，讓美術(shù)教師參加網(wǎng)頁色彩設(shè)計，可能會出現(xiàn)比較理想的效果。在色彩搭配上要注意色彩的鮮明性、獨特性、合適性、聯(lián)想性。背景色和前景色對比要大，以突出主要內(nèi)容
網(wǎng)站給人的第一印象來自視覺沖擊，不同的色彩搭配產(chǎn)生不同的效果，并可能影響到訪問者的情緒。“標準色彩”是指能體現(xiàn)網(wǎng)站形象和延伸內(nèi)涵的色彩，要用于網(wǎng)站的標志，標題，主菜單和主色塊。給人以整體統(tǒng)一的感覺。至于其它色彩也可以使用，但應當只是作為點綴和襯托，絕不能喧賓奪主。一般來說，一個網(wǎng)站的標準色彩不超過3種，太多則讓人眼花繚亂。適合于網(wǎng)頁標準色的顏色有：藍色，黃/橙色，黑/灰/白色三大系列色。
第五章
色彩在網(wǎng)頁中的應用
第六章 WEB頁面信息的交互——窗體與框架
要實現(xiàn)網(wǎng)頁的動態(tài)交互，必須掌握有關(guān)窗體對象（Form）和框架對象（Frames）更為復雜的知識。
6.1窗體基礎(chǔ)知識
窗體對象可以使設(shè)計人員能用窗體中不同的元素與客戶機用戶相交互，而用不著在之前首先進行數(shù)據(jù)輸入，就可以實現(xiàn)動態(tài)改變Web文檔的行為。
6.1.1窗體對象
窗體（Form）：它構(gòu)成了Web頁面的基本元素。通常一個Web頁面有一個窗體或幾個窗體，使用Forms[]數(shù)組來實現(xiàn)不同窗體的訪問。
在Forms[0]中共有三個基本元素，而Forms[1]中只有兩個元素。窗體對象最主要的功能就是能夠直接訪問HTML文檔中的窗體，它封裝了相關(guān)的HTML代碼：
6.1.2 窗體對象的方法窗體對象的方法只有一個--submit()方法，該方法主要功用就是實現(xiàn)窗體信息的提交。如提交Mytest窗體，則使用下列格式：
document.mytest.submit()
第五章
色彩在網(wǎng)頁中的應用
6.1.3 窗體對象的屬性
窗體對象中的屬性主要包括以下：elements name action target encoding method。除Elements外，其它幾個均反映了窗體中標識中相應屬性的狀態(tài)，這通常是單個窗體標識；而elements常常是多個窗體元素值的數(shù)組，例：
elements[0].Mytable.elements[1] 6.1.4 訪問窗體對象
在JavaScript中訪問窗體對象可由兩種方法實現(xiàn)：（1）通過訪問窗體
在窗體對象的屬性中首先必須指定其窗體名，而后就可以通過下列標識訪問窗體如：document.Mytable()。
（2）通過數(shù)組來訪問窗體
除了使用窗體名來訪問窗體外，還可以使用窗體對象數(shù)組來訪問窗體對象。但需要注意一點，因窗體對象是由瀏覽器環(huán)境的提供的，而瀏覽器環(huán)境所提供的數(shù)組下標是由0到n。所以可通過下列格式實現(xiàn)窗體對象的訪問：
document.forms[0] document.forms[1] document.forms[2]...6.1.5 引用窗體的先決條件
在JavaScript中要對窗體引用的條件是：必須先在頁面中用標識創(chuàng)建窗體，并將定義窗體部分放在引用之前。
6.2 窗體中的基本元素
窗體中的基本元素由按鈕、單選按鈕、復選按鈕、提交按鈕、重置按鈕、文本框等組成。
在JavaScript中要訪問這些基本元素，必須通過對應特定的窗體元素的數(shù)組下標或窗體元素名來實現(xiàn)。每一個元素主要是通過該元素的屬性或方法來引用。其引用的基本格式見下：
formName.elements[].methadName(窗體名.元素名或數(shù)組.方法)formName.elemaent[].propertyName(窗體名.元素名或數(shù)組.屬性)下面分別介紹：
（1）Text單行單列輸入元素
功能：對Text標識中的元素實施有效的控制?；緦傩裕?/p>
Name：設(shè)定提交信息時的信息名稱。對應于HTML文檔中的Name。Value：用以設(shè)定出現(xiàn)在窗口中對應HTML文檔中Value的信息。defaultvalue：包括Text元素的默認值 基本方法：
blur()：將當前焦點移到后臺。
第五章
色彩在網(wǎng)頁中的應用
select()：加亮文字。主要事件：
onFocus：當Text獲得焦點時，產(chǎn)生該事件。OnBlur：從元素失去焦點時，產(chǎn)生該事件。Onselect：當文字被加亮顯示后，產(chǎn)生該文件。onchange：當Text元素值改變時，產(chǎn)生該文件。例：
...（2）textarea多行多列輸入元素功能：實施對Textarea中的元素進行控制?；緦傩?/p>
name：設(shè)定提交信息時的信息名稱，對應HTML文檔Textarea的Name。Value：用以設(shè)定出現(xiàn)在窗口中對應HTML文檔中Value的信息。Default value：元素的默認值。方法：
blur()：將輸入焦點失去 select()：將文字加亮后 事件：
onBlur:當失去輸入焦點后產(chǎn)生該事件 onFocus:當輸入獲得焦點后，產(chǎn)生該文件 Onchange:當文字值改變時，產(chǎn)生該事件 Onselect:當文字加亮后，產(chǎn)生該文件（3）Select選擇元素
功能：實施對滾動選擇元素的控制。屬性：
name:設(shè)定提交信息時的信息名稱，對應文檔select中的name。Length:對應文檔select中的length options:組成多個選項的數(shù)組 selectIndex;該下標指明一個選項
select在中每一選項都含有以下屬性： Text:選項對應的文字
selected:指明當前選項是否被選中 Index:指明當前選項的位置 defaultselected:默認選項 事件：
第五章
色彩在網(wǎng)頁中的應用
OnBlur：當select選項失去焦點時，產(chǎn)生該文件。onFocas:當select獲得焦點時，產(chǎn)生該文件。Onchange:選項狀態(tài)改變后，產(chǎn)生該事件。（4）Button按鈕
功能：實施對Button按鈕的控制。屬性：
Name:設(shè)定提交信息時的信息名稱，對應文檔中button的Name。Value:用以設(shè)定出現(xiàn)在窗口中對應HTML文檔中Value的信息。方法：
click()該方法類似于一個按下的按鈕。事件：
onclick當單擊button按鈕時，產(chǎn)生該事件。例 ：
........（5）checkbox檢查框功能：實施對一個具有復選框中元素的控制。屬性：
name:設(shè)定提交信息時的信息名稱。
Value:用以設(shè)定出現(xiàn)在窗口中對應HTML文檔中Value的信息。Checked:該屬性指明框的狀態(tài)true/false.defauitchecked:默認狀態(tài) 方法：
click()該方法使得框的某一個項被選中。事件：
Onclick：當框的選被選中時，產(chǎn)生該事件。（6）radio無線按鈕
功能：實施對一個具單選功能的無線按鈕控制。屬性：
Name：設(shè)定提交信息時的信息名稱，對應HTML文檔中的radio的name相同 Value：用以設(shè)定出現(xiàn)在窗口中對應HTML文檔中Value的信息，對應HTML文檔中的radio的name。
length：單選按鈕中的按鈕數(shù)目。defalechecked:默認按鈕。
checked:指明選中還是沒有選中。
第五章
色彩在網(wǎng)頁中的應用
index:選中的按鈕的位置。方法：
chick():選定一個按鈕。事件：
onclick:單擊按鈕時，產(chǎn)生該事件。（7）hidden:隱藏
功能：實施對一個具有不顯示文字并能輸入字符的區(qū)域元素的控制。屬性：
name:設(shè)定提交信息時的信息名稱，對應HTML文檔的hidden中的Name。
Value:用以設(shè)定出現(xiàn)在窗口中對應HTML文檔中Value的信息，對應HTML文檔hidden中的value。
defaleitvalue:默認值（8）Password口令
功能：實施對具有口令輸入的元素的控制。屬性：
Name:設(shè)定提交信息時的信息名稱，對應HTML文檔中password中的name。Value:用以設(shè)定出現(xiàn)在窗口中對應HTML文檔中Value的信息，對應HTML文檔中password中的Value。
defaultvalu:默認值 方法：
select():加亮輸入口令域。
blur():使這丟失passward輸入焦點。focus():獲得password輸入焦點。（9）submit提交元素
功能：實施對一個具有提交功能按鈕的控制。屬性：
name:設(shè)定提交信息時的信息名稱，對應HTML文檔中submit。
Value:用以設(shè)定出現(xiàn)在窗口中對應HTML文檔中Value的信息，對應HTML文檔中value。
方法
click()相當于按下submit按鈕。事件：
onclick()當按下該按鈕時，產(chǎn)生該事件。
6.3窗體對象實例
下面我們演示通過點擊一個按鈕（red）來改變窗口顏色，點擊“調(diào)用動態(tài)按鈕文檔”調(diào)用一個動態(tài)按鈕文檔。
test8_1.htm
調(diào)用動態(tài)按鈕文檔第三篇：網(wǎng)頁設(shè)計與制作報告書
電子商務(wù)2班201341440213孫巖
網(wǎng)頁設(shè)計與制作報告書
課程名稱:網(wǎng)頁設(shè)計與制作
專業(yè)班級：電子商務(wù)2班
學 號:201341440213 姓 名：孫巖
指導教師：王康哲
電子商務(wù)2班201341440213孫巖
目錄
一．概要……………………………………………………………
二．網(wǎng)站開發(fā)……………………………………………………
三．應用工具方案……………………………………………
四．欄目劃分……………………………………………………
五．代碼表……………………………………………………….六．截圖……………………………………………………………
七．結(jié)論…………………………………………………………… 2 6 7 13 14
電子商務(wù)2班201341440213孫巖
摘要：
在Internet飛速發(fā)展的今天，互聯(lián)網(wǎng)成為人們快速獲取、發(fā)布和傳遞信息的重要渠道，它在人們政治、經(jīng)濟、生活等各個方面發(fā)揮著重要的作用。因此網(wǎng)站建設(shè)在Internet應用上的地位顯而易見，它已成為政府、企事業(yè)單位信息化建設(shè)中的重要組成部分，從而倍受人們的重視。
一、網(wǎng)頁制作開發(fā)背景
Dreamweaver以其功能強大、容易上手、界面親切而著稱。它采用所見即所得的方式編輯網(wǎng)頁，利用它可以輕松的組織、編輯網(wǎng)頁并將其發(fā)布到指定的站點上，而且在發(fā)布之后還能對更新情況進行監(jiān)控以更新站點的內(nèi)容?，F(xiàn)在流行的網(wǎng)頁制作軟件有很多，如Macromedia公司的Dreamweaver、微軟公司的Dreamweaver、還有Adobe Pagemill 3.0--制作多框架，表單和Image map 圖像的網(wǎng)頁工具、Netscape等等。其中Dreamweaver更以其功能強大、容易上手、界面親切而著稱。它采用所見即所得的方式編輯網(wǎng)頁，利用它可以輕松的組織、編輯網(wǎng)頁并將其發(fā)布到指定的站點上，而且在發(fā)布之后還能對更新情況進行監(jiān)控以更新站點的內(nèi)容。工具準備好了，可根據(jù)你的個人喜好來選擇一些素材，如圖片、喜歡的文章等。
二、網(wǎng)頁制作設(shè)計技巧
首先，我們來看一下創(chuàng)建一個只包含一個網(wǎng)頁的站點。選擇“文件”菜單的“新建”選項，單擊“站點”命令，這時新建站點對話框就彈出來了，在“指定新站點位置”文本框中輸入新站點的位置，單擊“只有一個網(wǎng)頁的站點” 圖標，單擊“確定”按鈕。這就建立好站點了，我們現(xiàn)在來看一下新的站點里有什么，單擊“視圖”工具條的“文件夾”按鈕。在文件夾列表里有一個網(wǎng)頁文件，名字叫做“index.htm”。我們知道，每一個站點都要有一個主頁，這個主頁也是一個網(wǎng)頁文件。瀏覽者訪問站點時首先進入的就是站點的主頁。主頁的名字在一般情況下就叫做“index.htm”。就是說我們新建只包含一個網(wǎng)頁的站點時，DREAMWEAVER就自動為我們創(chuàng)建了站點的主頁了。這個新建的站點主頁時空的，我們可以向里面添加內(nèi)容。
在文件列表里除了主頁之外，還有文件夾。新建站點時，DREAMWEAVER都會在站點所在位置下新建兩個文件夾，一個是“images”另一個是“_private”。我們在編輯站點時可以在“image”文件夾里放置站點用到的圖片。“private”
電子商務(wù)2班201341440213孫巖
文件夾比較特殊，其中的文件對瀏覽者來說是隱含的，我們可以把一些不想讓瀏覽者看到的網(wǎng)頁文件放在這個文件夾里，比如：我們可以在這個文件夾里存放注冊用戶的個人信息。
盡管每一個站點都要有一個主頁，不過創(chuàng)建站點時我們?nèi)匀豢梢詮囊粋€空站點開始：選擇“文件”菜單的“新建”命令，單擊“站點”選項，在“新建站點”對話框里，我們可以選擇“空站點”圖標來創(chuàng)建一個空站點?！靶陆ㄕ军c”對話框中還有許多其他圖標，這是DREAMWEAVER提供的用來創(chuàng)建站點模板或向?qū)?。我們?chuàng)建只有一個網(wǎng)頁的站點或者創(chuàng)建空站點，都是從頭開始來創(chuàng)建一個站點，這就好像蓋房子一樣，首先畫圖紙。然而，有許多的房子都具有相似的結(jié)構(gòu)和用途，所以我們可以用一張圖紙蓋很多相似的房子，這樣就節(jié)省了許多工作。
基于表格的設(shè)計：表格布局使網(wǎng)頁設(shè)計師制作網(wǎng)站時有了更多選擇。在 HTML 中表格標簽的本意是為了顯示表格化的數(shù)據(jù)，但是設(shè)計師很快意識到可以利用表格來構(gòu)造他們設(shè)計的網(wǎng)頁，這樣就可以制作較以往作品更加復雜的，多欄目的網(wǎng)頁。表格布局就這樣流行了起來，融合了背景圖片切片技術(shù)，常給人以看起來較實際布局簡潔得多的結(jié)構(gòu)。
結(jié)構(gòu)設(shè)計：這個時期的網(wǎng)頁設(shè)計還不太關(guān)注語義化和可用性方面的問題，主要還在追求良好的結(jié)構(gòu)美學。同一時期也是大量應用 GIF 占位圖片控制留白的時期。一些主流的公司甚至訓練設(shè)計師如何使用 GIF 占位;如微軟的“關(guān)于 HTML 表格中的 GIF 占位”。第一批主要應用表格布局的“所見即所得”網(wǎng)頁設(shè)計軟件的發(fā)展助長了表格的應用。另外，某些軟件自動生成的表格如此復雜以至于許多設(shè)計師不可能從頭手寫代碼(例如每行只有 1px 高卻包含了幾百列的表格)。即使是稍微復雜一點兒的網(wǎng)頁(比如多欄目頁面)，設(shè)計師們都要依賴于表格來創(chuàng)建。
三、網(wǎng)站結(jié)構(gòu)
網(wǎng)站結(jié)構(gòu)是指網(wǎng)站中頁面間的層次關(guān)系;按性質(zhì)可分為邏輯結(jié)構(gòu)及物理結(jié)構(gòu)。網(wǎng)站結(jié)構(gòu)對網(wǎng)站的搜索引擎友好性及用戶體驗有著非常重要的影響。
（一）網(wǎng)站結(jié)構(gòu)整體先用DIV和CSS來進行構(gòu)造，對整個網(wǎng)站進行布局，(二)網(wǎng)站結(jié)構(gòu)是衡量網(wǎng)站用戶體驗好壞的重要指標之一。清晰的網(wǎng)站結(jié)
電子商務(wù)2班201341440213孫巖
構(gòu)可以幫助用戶快速獲取所需信息;相反，如果一個網(wǎng)站的結(jié)構(gòu)極其糟糕的話，用戶在訪問時就猶如走進了一座迷宮，最后只會選擇放棄瀏覽。
（三）網(wǎng)站結(jié)構(gòu)還直接影響搜索引擎對頁面的收錄，一個合理的網(wǎng)站結(jié)構(gòu)可以引導搜索引擎從中抓取更多有價值的頁面。
網(wǎng)站結(jié)構(gòu)對網(wǎng)站及網(wǎng)站中頁面的影響。搜索引擎對重要頁面的抓取
由于互聯(lián)網(wǎng)中信息量極其龐大，為了向用戶展示更多有價值的信息，搜索引擎會優(yōu)先抓取每個網(wǎng)站中相對重要的頁面(即權(quán)重較高的頁面),然而，搜索引擎是怎樣發(fā)現(xiàn)這些重要頁面的呢?根據(jù)重要頁面的鏈接指向的頁面可能是重要頁面的思路;搜索引擎首先會從權(quán)重相對較高的頁面(即源頁面)出發(fā)跟蹤其中的鏈接，從而抓取其他相對重要的頁面(即目標頁面)。
網(wǎng)頁設(shè)計的要素
四、應用工具方案
DreamWeaver自制動態(tài)HTML動畫的網(wǎng)頁。
DreamWeaver是一個很酷的網(wǎng)頁設(shè)計軟件，它包括可視化編輯、HTML代碼編輯的軟件包，并支持ActiveX、JavaScript、Java、Flash、ShockWave等特性，而且它還能通過拖拽從頭到尾制作動態(tài)的HTML動畫，支持動態(tài)HTML(Dynamic HTML)的設(shè)計，使得頁面沒有plug-in也能夠在Netscape和IE 4.0瀏覽器中正確地顯示頁面的動畫。同時它還提供了自動更新頁面信息的功能。
DreamWeaver還采用了Roundtrip HTML技術(shù)。這項技術(shù)使得網(wǎng)頁在DreamWeaver和HTML代碼編輯器之間進行自由轉(zhuǎn)換，HTML句法及結(jié)構(gòu)不變。這樣，專業(yè)設(shè)計者可以在不改變原有編輯習慣的同時，充分享受到可視化編輯帶來的益處。DreamWeaver最具挑戰(zhàn)性和生命力的是它的開放式設(shè)計，這項設(shè)計使任何人都可以輕易擴展它的功能。
版面布局：在你開始設(shè)計之前，你必須仔細地為站點挑選色彩組合。千萬不要出現(xiàn)紫色的背景加上黑藍色的文字的組合。要使整個站點保持同一種色彩組合，因為不同顏色組合的背景或字體可能會是非常令人討厭的。你也可以選用一個背
電子商務(wù)2班201341440213孫巖
景圖，而不是僅用一種顏色。背景圖案可以自己繪制，也可以從因特網(wǎng)上下載。通過模糊背景圖案，就可以使文字更容易被閱讀。要記住的是，圖片不會被瀏覽器重畫的，而背景色彩則是要被重新畫的，因此，在上傳你的圖片之前，必須檢查不同的瀏覽器是如何顯示這些網(wǎng)頁的。當增加文字時，盡量設(shè)置容易被閱讀的字體和大小。如果你使用背景圖片，那么，當網(wǎng)頁被瀏覽時，背景色和字體將會先于背景圖片被下載，因此，如果背景色和文本的顏色沒有鮮明的對照的話，那么瀏覽者會有幾秒鐘的時間看到一個充滿了不可閱讀的文本的網(wǎng)頁。解決這個問題的簡單的方法就是，使背景色與背景圖的顏色相類似。
瀏覽導航：站點的瀏覽導航必須被設(shè)計成非常容易。如果需要，把站點分割為幾個部分。最容易的方法，就是在整個網(wǎng)站的所有的網(wǎng)頁的左邊放置一個菜單條。當然，除此以外，還有許多可選的方法。對于具有大量信息的站點，使用一個可擴展的菜單條會是一個不錯的選擇。無論你使用何種導航模式，在每一頁都放置一個主頁鏈接，那會是一種不錯的設(shè)計思想；瀏覽者必須知道，無論何時，當他們迷失在你的站點瀏覽中時，都可以通過簡單的一次點擊就能準確地知道目前所處的位置。
Frame(幀,框架)的問題：Frame—— 你也許會喜歡它，也許不喜歡。如果你在你的網(wǎng)站上使用幀，你很可能使一個幀用于導航目的，另一個幀用于放置內(nèi)容。你可以看見在同一頁上有兩個被分割的瀏覽窗口，你點擊左邊的幀，只會改變右邊的內(nèi)容。用幀來組織網(wǎng)站的內(nèi)容，顯然是非常容易的。
檢驗你的HTML代碼 ：不要在你的網(wǎng)站上放置瀏覽計數(shù)器。計數(shù)器會讓你的網(wǎng)站看起來不夠?qū)I(yè)化，如果瀏覽量不夠的話，還會起到相反的宣傳作用。最后，內(nèi)容是金，如果能給的瀏覽者一些有價值的東西，如，信息，建議，或軟件，那么就能吸引瀏覽者經(jīng)常光顧你的網(wǎng)站。為你的站點增加消息板和聊天室，從而提高網(wǎng)站的交互性，使你和你的訪問者交流，讓訪問者彼此交流。
五、頻道欄目劃分
圖1
電子商務(wù)2班201341440213孫巖
六、代碼段
content=“text/html;charset=gb2312” />
點擊咨詢 