全套課件·多媒體網(wǎng)頁設(shè)計(jì)教程

1、第1章 網(wǎng)頁設(shè)計(jì)概論本章要點(diǎn)網(wǎng)頁設(shè)計(jì)基礎(chǔ)知識與網(wǎng)頁設(shè)計(jì)相關(guān)的多媒體技術(shù)HTML語言基礎(chǔ)目 錄1.1 網(wǎng)頁設(shè)計(jì)基礎(chǔ)知識1.2 多媒體素材基礎(chǔ)1.3 HTML基礎(chǔ)1.1 網(wǎng)頁設(shè)計(jì)基礎(chǔ)知識1.1.1 Internet與Web1.1.2 網(wǎng)頁、網(wǎng)站與主頁1.1.3 網(wǎng)站分類與賞析1.1.4 網(wǎng)頁色彩與布局1.1.1 Internet與Web Internet 又稱國際互聯(lián)網(wǎng)，是一個把分布于世界各地不同結(jié)構(gòu)的計(jì)算機(jī)網(wǎng)絡(luò)通過各種傳輸介質(zhì)互相連接起來的網(wǎng)絡(luò)。Internet上的信息資源極為豐富，分為信息資源和服務(wù)資源兩類。它的主要功能包括：網(wǎng)上信息查詢、網(wǎng)上交流、電子郵件、文件傳輸和遠(yuǎn)程登錄。 World

2、Wide Web 簡稱WWW或Web，也稱萬維網(wǎng)。是Internet提供的最主要的信息服務(wù)。是以超文本標(biāo)記語言（Hypertext Markup Language ,HTML）與超文本傳輸協(xié)議（Hypertext Transfer Protocol，HTTP）為基礎(chǔ)，能夠以十分友好的接口提供Internet信息查詢服務(wù)的瀏覽系統(tǒng)。 1.1.2 網(wǎng)頁、網(wǎng)站與主頁（1/3） 網(wǎng)頁（Web Page）也稱為Web頁，是用戶通過瀏覽器在Internet中看到的頁面，網(wǎng)頁分為靜態(tài)網(wǎng)頁和動態(tài)網(wǎng)頁 。 從文件角度講，網(wǎng)頁通常是一種由HTML語言編寫的文本文件，網(wǎng)頁文件又稱HTML文件，其擴(kuò)展名為.html或

3、htm。 在瀏覽器的菜單欄中選擇【查看】【源文件】命令，可打開一個網(wǎng)頁文件并看到網(wǎng)頁的源代碼 。網(wǎng)頁作為一種文本文件，可以用任意文本編輯器編輯。 提示：網(wǎng)頁起初都是用HTML編寫的，許多網(wǎng)頁文件的擴(kuò)展名為.html或.htm，但現(xiàn)在很多網(wǎng)頁的擴(kuò)展名為.jsp、.asp、.aspx、.php、.phpx等，這些網(wǎng)頁是有區(qū)別的，它們表示是使用不同的網(wǎng)頁編程技術(shù)編寫的。1.1.2 網(wǎng)頁、網(wǎng)站與主頁（2/3） 網(wǎng)站（Website）又稱為站點(diǎn)或Web站點(diǎn)，是指根據(jù)一定的規(guī)則，使用HTML等工具制作的用于展示特定內(nèi)容的相關(guān)網(wǎng)頁的集合。網(wǎng)站總是由一個主頁和其他具有超鏈接文件的頁面構(gòu)成。 主頁 是網(wǎng)站中的一

4、個特殊頁面，是進(jìn)入網(wǎng)站的門戶，是整個網(wǎng)站的第一頁。一般命名為index.html。1.1.2 網(wǎng)頁、網(wǎng)站與主頁（3/3）網(wǎng)頁基本元素文本圖像超鏈接動畫1.1.3 網(wǎng)站分類與賞析門戶類網(wǎng)站企業(yè)信息類網(wǎng)站教育類網(wǎng)站產(chǎn)品信息類網(wǎng)站 1.1.4 網(wǎng)頁色彩與布局（1/2）色彩基礎(chǔ)知識 三原色、顏色分類、飽和度、透明度、色系色彩搭配技巧網(wǎng)頁色彩的應(yīng)用分析 “中國瓷器”網(wǎng)站（） “北美工藝品展”網(wǎng)站（） “多媒體設(shè)計(jì)”網(wǎng)站（） 1.1.4 網(wǎng)頁色彩與布局（2/2）頁面尺寸 網(wǎng)頁的尺寸和顯示器大小及分辨率有關(guān)，分辨率越高，頁面的尺寸越大 。 頁面布局類型 國字形、拐角形、三字形、川字形、封面形、Flash形

5、1.2 多媒體素材基礎(chǔ) 1.2.1 顏色的基本概念 1.2.2 圖像的色彩模式 1.2.3 圖像的基本屬性 1.2.4 圖像文件的格式 1.2.5 計(jì)算機(jī)動畫概述 1.2.6 音頻與視頻基礎(chǔ) 1.2.7 常用多媒體素材與網(wǎng)頁制作工具介紹1.2.1 顏色的基本概念(1/2)顏色的三要素亮度 顏色的明暗程度 色相(色調(diào)) 顏色的相貌 飽和度 純度或彩度 色相、飽和度統(tǒng)稱為色度，表示顏色的類別和深淺程度。1.2.1 顏色的基本概念(2/2) 三基色 是這樣的三種顏色，它們相互獨(dú)立，其中任意色均不能由其他兩色混合產(chǎn)生。自然界常見的各種彩色光，都可由三種顏色相互獨(dú)立的光組成，有兩種基色系統(tǒng)，一種是加色系

6、統(tǒng)，其三基色是紅（Red）、綠（Green）、藍(lán)（Blue），另一種是減色系統(tǒng)，其三基色是青色（Cyan）、品紅（Magenta）和黃色（Yellow）。紅色+綠色=黃色紅色+藍(lán)色=品紅綠色+藍(lán)色青色紅色+綠色+藍(lán)色白色1.2.2 圖像的色彩模式 色彩模式 是指在計(jì)算機(jī)上打印或顯示圖像時表示顏色的數(shù)字方法。通常在不同的應(yīng)用環(huán)境采用不同的色彩模式?；叶饶Ｊ絉GB模式CMY模式HSB模式Lab模式安全色1.2.3 圖像的基本屬性（1/3） 數(shù)字圖像的種類有兩種：圖形和圖像。它們也是構(gòu)成動畫或視頻的基礎(chǔ)。 圖形 又稱矢量圖形、幾何圖形或矢量圖，是經(jīng)過計(jì)算機(jī)運(yùn)算而形成的抽象化結(jié)果，由具有方向和長度的矢

7、量線段構(gòu)成。 。 圖像 又稱點(diǎn)陣圖像或位圖圖像，是指在空間和亮度上已離散化的圖像。 圖形與圖像的區(qū)別1.2.3 圖像的基本屬性（2/3） 分辨率 是用于度量圖像單位長度數(shù)據(jù)量的參數(shù)，其高低直接影響圖像的質(zhì)量。分辨率通常表示為ppi（pixel per inch，像素/英寸）和dpi（dot per inch，點(diǎn)/每英寸）。計(jì)算機(jī)顯示領(lǐng)域用ppi度量分辨率，而dpi用于打印、印刷領(lǐng)域等 。 顯示分辨率 掃描分辨率 打印分辨率1.2.3 圖像的基本屬性（3/3） 顏色深度 是指記錄每個像素所使用的二進(jìn)制位數(shù)。顏色深度決定圖像可以使用的最多顏色數(shù)目或亮度級別數(shù)目。顏色深度值越大，顯示的圖像色彩越豐富

8、，畫面越自然、逼真，但數(shù)據(jù)量也隨之激增。 顏色深度/bit數(shù)值顏色數(shù)量顏色評價1212二值圖像42416簡單色圖像828256基本色圖像1621665536增強(qiáng)色圖像2422416777216真彩色圖像322324294967296真彩色圖像6426468719476736真彩色圖像圖像文件的字節(jié)數(shù)圖像分辨率顏色深度81.2.4 圖像文件的格式 常用的圖像文件格式有幾下幾種 BMP格式GIF格式JPEG格式TIF格式PNG格式PSD格式1.2.5 計(jì)算機(jī)動畫概述 動畫 是一種通過連續(xù)畫面來顯示運(yùn)動和變化的技術(shù)，通過一定速度播放畫面以達(dá)到連續(xù)的動態(tài)效果。 計(jì)算機(jī)動畫 是指借助于計(jì)算機(jī)生成一系列連

9、續(xù)圖像畫面，并可動態(tài)實(shí)時播放的計(jì)算機(jī)技術(shù)。按性質(zhì)和運(yùn)動方式逐幀動畫（幀動畫）實(shí)時動畫（算法動畫）矢量動畫 計(jì)算機(jī)動畫分類 按表現(xiàn)形式二維動畫三維動畫變形動畫1.2.6 音頻與視頻基礎(chǔ)（1/2） 模擬音頻 聲音是由物體的振動產(chǎn)生的。這種聲音的震動通過話筒的轉(zhuǎn)換。可以形成聲音波形的電信號，這就是模擬音頻信號構(gòu)成 。 數(shù)字音頻 是由許多0和1組成的二進(jìn)制數(shù)，可以以聲音文件（WAV或MIDI格式）的形式存儲在磁盤中。使用音頻卡（聲卡）的A/D轉(zhuǎn)換器（模擬/數(shù)字轉(zhuǎn)換器）將模擬音頻信號進(jìn)行采樣和量化處理，即可獲得相應(yīng)的數(shù)字音頻信號。 聲音文件分為兩大類： WAV格式的波形音頻文件（.wav）； MIDI格

10、式的樂器數(shù)字化接口文件（.mid）。1.2.6 音頻與視頻基礎(chǔ)（2/2） 視頻 是一組連續(xù)地隨時間變化的圖像，與加載的同步聲音共同呈現(xiàn)動態(tài)的視覺和聽覺效果。常見的視頻信號有電影和電視。 視頻文件可分為兩大類：影像文件和流式視頻文件，常見的文件格式有：AVI、MOV、MPEG、DAT、RM、ASF、WMV等 1.2.7 常用多媒體素材及網(wǎng)頁制作工具圖像處理工具 Photoshop 、Fireworks媒體處理工具 Flash、Audition、GoldWave 、Premiere、After Effect 網(wǎng)頁編輯工具 HTML編輯器 “所見即所得”編輯器（Dreamweaver、Frontpa

11、ge）1.3 HTML基礎(chǔ)1.3.1 HTML文檔基本結(jié)構(gòu) 1.3.2 HTML的基本結(jié)構(gòu)標(biāo)記 1.3.3 文字與段落排版標(biāo)記 1.3.4 多媒體標(biāo)記 1.3.5 超鏈接標(biāo)記 1.3.6 框架標(biāo)記 1.3.1 HTML文檔基本結(jié)構(gòu)（1/2） HTML 是Hypertext Markup Language（超文本標(biāo)記語言）的縮寫，它是構(gòu)成Web頁面的符號標(biāo)記語言。通過HTML將所需要表達(dá)的信息按某種規(guī)則寫成HTML文件，并將這些HTML文件翻譯成可以識別的信息，就是所見到的網(wǎng)頁。 【案例1.1】用HTML制作一個簡單的網(wǎng)頁。 效果圖1.3.1 HTML文檔基本結(jié)構(gòu)（2/2）HTML標(biāo)記格式為：受

12、標(biāo)記影響的內(nèi)容說明 【案例1.2】標(biāo)記屬性說明。 設(shè)置標(biāo)記屬性的格式為：受標(biāo)記影響的內(nèi)容說明 標(biāo)記屬性示例 Hello!網(wǎng)頁設(shè)計(jì)學(xué)習(xí)從HTML開始！ HTML語言是建立網(wǎng)頁的規(guī)范 1.3.2 HTML基本結(jié)構(gòu)標(biāo)記常用標(biāo)記 常用屬性：Bgcolor、 Background、text、link屬性 使用格式： 網(wǎng)頁的內(nèi)容 注釋標(biāo)記 使用格式：，或者1.3.3 文字與段落排版標(biāo)記（1/5）常用標(biāo)記 常用屬性：face、size、color 使用格式：文本內(nèi)容 【案例1.3】font常用屬性應(yīng)用示例。 1.3.3 文字與段落排版標(biāo)記（2/5）控制字體特殊效果標(biāo)記標(biāo)記名稱標(biāo)記作用標(biāo)記格式b文字加粗文字i

13、文字斜體文字u文字加下畫線文字strike文字加刪除線文字sup文字為上標(biāo)文字Sub文字為下標(biāo)文字1.3.3 文字與段落排版標(biāo)記（3/5）段落排版標(biāo)記 標(biāo)題標(biāo)記 使用格式：標(biāo)題文字 【案例1.4】標(biāo)題標(biāo)記應(yīng)用示例。 【案例1.5】換行、段落標(biāo)記標(biāo)記應(yīng)用示例。 換行和段落標(biāo)記 、 1.3.3 文字與段落排版標(biāo)記（4/5）其他標(biāo)記水平線標(biāo)記 有序列表標(biāo)記列表項(xiàng)標(biāo)記 表項(xiàng)1 表項(xiàng)2 【案例1.6】有序列表標(biāo)記應(yīng)用示例。 1.3.3 文字與段落排版標(biāo)記（5/5）無序列表標(biāo)記 表項(xiàng)1 表項(xiàng)2 【案例1.7】制作一個介紹諾貝爾獎的頁面。 示例1.3.4 多媒體標(biāo)記（1/2）圖像標(biāo)記 使用格式:背景音樂標(biāo)記

14、 使用格式:1.3.4 多媒體標(biāo)記（2/2）音頻和視頻標(biāo)記 使用格式：Flash標(biāo)記 使用格式： 【案例1.8】圖文混排及多媒體標(biāo)記綜合實(shí)例（修改案例1.7） 。 1.3.5 超鏈接標(biāo)記建立鏈接標(biāo)記 使用格式：鏈接標(biāo)識鏈接到Email 使用格式： 鏈接標(biāo)識用圖像建立鏈接 使用格式： 【案例1.9】使用a標(biāo)記創(chuàng)建超鏈接示例。 1.3.6 框架標(biāo)記（1/2）框架標(biāo)記 使用格式： 框架組標(biāo)記 使用格式： 1.3.6 框架標(biāo)記（1/2） 【案例1.10】一個簡單的框架應(yīng)用示例。 【案例1.11】框架建的鏈接應(yīng)用示例。 top.html代碼main.html代碼left.html代碼作業(yè)圖形與圖像的構(gòu)成

15、原理不同。圖形的數(shù)據(jù)量相對較小，圖像的數(shù)據(jù)量相對較大。圖像的像素點(diǎn)之間沒有內(nèi)在聯(lián)系，在放大與縮小時，圖像的清晰度受影響，而圖形由運(yùn)算關(guān)系支配，放大與縮小不會影響圖形的各種特征。圖像的層次和色彩豐富，表現(xiàn)力較強(qiáng)，適于表現(xiàn)自然的、細(xì)節(jié)的景物，圖形則適于表示變化的曲線、簡單的圖案和運(yùn)算的結(jié)果等。圖形與圖像的區(qū)別 任何標(biāo)記都用 “”括起來，如，以表示這是HTML代碼而非普通文本。注意，“”與標(biāo)記名之間不能留有空格或其他字符。 HTML的多數(shù)標(biāo)記都是成對出現(xiàn)的，分別稱為開始和結(jié)束標(biāo)記，結(jié)束標(biāo)記需在標(biāo)記名前加上符號“/”，也有不用結(jié)束的，稱為單標(biāo)記，如、。 任何標(biāo)記的大小寫都是等價的，建議用小寫形式。 標(biāo)

16、記可以嵌套使用，嵌套時注意不要發(fā)生交叉嵌套。下面的嵌套是正確的： 攝影動態(tài)說明屬性只可加于開始標(biāo)記中，并非所有的標(biāo)記都有屬性，如換行標(biāo)記就沒有屬性。根據(jù)需要可以使用某標(biāo)記的所有屬性，也可以只使用其中的幾個屬性。在使用時屬性之間沒有順序要求。屬性和標(biāo)記一樣，不區(qū)分大小寫，但建議使用小寫字母表示。任何標(biāo)記的屬性都有默認(rèn)值，當(dāng)使用默認(rèn)值時屬性描述可省略。說明【案例1.1】效果圖標(biāo)庫第2章 圖像基本編輯本章要點(diǎn)Photoshop CS3的操作界面和基本操作方法圖像的縮放、裁剪和傾斜矯正圖像的曝光補(bǔ)償與色彩校正，圖像的美化和修飾目 錄2.1 Photoshop CS3界面 2.2 文件操作與畫布調(diào)整 2

17、.3 屏幕顯示控制 2.4 圖像的縮放、裁剪與傾斜 2.5 色調(diào)調(diào)整與圖像修飾 2.1 Photoshop CS3界面 2.1.1 窗口布局2.1.2 工具箱2.1.3 面板2.1.1 窗口布局默認(rèn)軟件界面2.1.2 工具箱 工具箱位于Photoshop CS3窗口的左側(cè)，其中包含幾十個用于圖像處理的工具按鈕。為了方便選取，功能相近的工具被分組 。選擇好工具后，可以通過窗口頂部、菜單欄下方的工具屬性欄調(diào)整該工具的選項(xiàng)。 2.1.3 面板 Photoshop CS3右側(cè)有一組面板，如“導(dǎo)航器”、“直方圖”、“顏色”、“圖層”等都是不同的面板窗口。這些面板可以折疊和展開。 2.2 文件操作與畫布調(diào)

18、整 2.2.1 文件操作 2.2.2 畫布調(diào)整 2.2.1 文件操作 文件的創(chuàng)建 創(chuàng)建文件的方法是單擊【文件】【新建】，之后會彈出如圖2.7所示“新建”對話框。 2.2.1 文件操作文件格式說明PSD/PDD Photoshop默認(rèn)格式，可以存儲成RGB或CMYK模式，可以保存Photoshop的層、通道、路徑等信息，是目前惟一能夠支持全部圖像色彩模式的格式，缺點(diǎn)是存儲文件占用磁盤空間大，在一些圖形程序中沒有得到很好支持。GIF 用于顯示HTML文檔中的索引顏色圖形和圖像。GIF采用無損壓縮存儲，在不影響圖像質(zhì)量的情況下，可以生成很小的文件，但最多只支持8位（256色）圖像。JPEG 用于顯示

19、HTML文檔中的照片和其它連續(xù)色調(diào)圖像。 與GIF 格式不同，JPEG保留RGB圖像中的所有顏色信息，但其采用的有損壓縮會丟失部分?jǐn)?shù)據(jù)，并影響圖像品質(zhì)。PNG 作為GIF的替代品開發(fā)，用于無損壓縮和在Web上顯示圖像。與GIF不同，PNG支持24位圖像。PNG保留圖像中的透明度，可使圖像中某些部分不顯示出來，用來創(chuàng)建一些有特色的圖像。BMP Windows操作系統(tǒng)中的標(biāo)準(zhǔn)圖像文件格式，能夠被Windows應(yīng)用程序廣泛支持，其包含的圖像信息較豐富，幾乎不進(jìn)行壓縮，但占用磁盤空間過大。保存時常用的文件格式2.3 屏幕顯示控制2.3.1 放大顯示圖像 2.3.2 縮小顯示圖像 2.3.3 觀察放大的

20、圖像2.3.4 使用“導(dǎo)航器”2.3.1 放大顯示圖像 使用縮放工具 單擊工具箱中的“縮放工具”，移動鼠標(biāo)到圖像中，鼠標(biāo)指針變?yōu)椤胺糯蠊ぞ摺焙髥螕?。顯示比例每次遞增100%。 使用快捷鍵 使用快捷鍵Ctrl +“+”（加號鍵）可以方便地逐級放大（每次遞增100%）圖像。 提示：無論當(dāng)前選用的是何種工具，按住Ctrl + Space（空格鍵），鼠標(biāo)指針立即變?yōu)椤胺糯蠊ぞ摺薄?2.3.2 縮小顯示圖像 使用縮放工具 單擊工具箱中的“縮放工具”，移動鼠標(biāo)到圖像中，如果鼠標(biāo)指針變?yōu)椤胺糯蠊ぞ摺?，在工具屬性欄中單擊“縮小工具”按鈕后單擊。顯示比例依次遞減。 使用快捷鍵 使用快捷鍵Ctrl +“-”（減號

21、鍵）可以方便地逐級縮小圖像。 提示：按住Alt鍵可改變當(dāng)前的縮放功能。若當(dāng)前工具為“縮小工具”，按住Alt鍵可變?yōu)椤胺糯蠊ぞ摺?，而?dāng)前為“放大工具”時，按住Alt鍵則可轉(zhuǎn)換為“縮小工具”。 2.3.3 觀察放大的圖像 放大后的圖像，在窗口中看到的往往只是其局部，要想查看圖像的其余部分，可以利用圖像編輯窗口的滾動條、“抓手工具”和“導(dǎo)航器”面板。 提示：無論當(dāng)前選用的是何種工具，按住Space（空格鍵），鼠標(biāo)立即切換為“抓手工具” 。 2.3.4 使用“導(dǎo)航器” “導(dǎo)航器”面板 可用來控制圖像的縮放顯示，在需要觀察放大顯示的圖像時，還可用來移動需要查看的區(qū)域。 提示：在圖片窗口和“導(dǎo)航器”面板的

22、左下角均有當(dāng)前圖像的顯示比例，可在此處直接輸入一個數(shù)字 。 2.4 圖像的縮放、裁剪與傾斜2.4.1 縮放圖像 2.4.2 裁剪圖像 2.4.3 度量矯正傾斜的圖像2.4.4 改變傾斜透視2.4.5 拼接圖片2.4.1 縮放圖像 【案例2.1】將教學(xué)資源中的文件“ch02素材e0201.jpg”（1024768像素，1013KB），縮小為400300像素，大小不超過100KB?？s放圖像 在網(wǎng)頁設(shè)計(jì)中經(jīng)常要根據(jù)版面大小改變圖片的尺寸，縮小一張圖片，不會影響其圖像質(zhì)量，而放大圖片會使得圖像模糊，從而影響視覺效果。 2.4.2 裁剪圖像 【案例2.2】按照構(gòu)圖，裁剪出一張可用于網(wǎng)頁標(biāo)題的圖片。 裁剪

23、圖像 在照片的后期處理中，適當(dāng)進(jìn)行裁剪，通過二次構(gòu)圖，能使主體更加突出，畫面的構(gòu)成更趨合理，從而使照片煥發(fā)出新的活力。 【案例2.3】將圖片旋轉(zhuǎn)裁剪，要求裁剪的長寬比為5:4 。素材與效果圖素材與效果圖2.4.3 度量矯正傾斜的圖像 【案例2.4】度量矯正畫面傾斜的圖片，矯正后再按9:6的寬屏比例裁剪 。度量矯正傾斜圖像 利用“標(biāo)尺工具”，在圖片上畫出一條參考線，可以精確測量出參考線與屏幕水平線之間的傾斜角度，并獲得理想的矯正效果。素材與效果圖2.4.4 改變傾斜透視 【案例2.5】矯正圖片中的傾斜透視 。傾斜透視 圖片上的傾斜透視有兩類，一是物體自身存在傾斜面，如樓梯、房頂、斜坡等，二是因視

24、點(diǎn)太高或太低，產(chǎn)生俯視傾斜透視或仰視傾斜透視 。素材與效果圖2.4.5 拼接圖片 【案例2.6】風(fēng)景圖片的無縫拼接 。傾斜透視 在拍攝一些寬大場面時，為了獲取廣闊的視角效果，采用分段拍攝、后期拼接的方法，最終效果完全能達(dá)到甚至超過廣角鏡頭的表現(xiàn)能力。素材與效果圖2.5 色調(diào)調(diào)整與圖像修飾2.5.1 調(diào)整曝光 2.5.2 校正偏色 2.5.3 渲染色彩2.5.4 修飾圖像2.5.1 調(diào)整曝光調(diào)整曝光的工具 直方圖與色階調(diào)整、曲線調(diào)整、陰影/高光、正片疊底。 【案例2.7】利用色階調(diào)整圖像的明暗。 素材與效果圖 【案例2.7】利用色階調(diào)整圖像的明暗。 素材與效果圖 【案例2.8】調(diào)整曝光過度的水仙

25、花。 素材與效果圖 【案例2.9】調(diào)整逆光拍攝的風(fēng)景。 素材與效果圖 【案例2.10】調(diào)整曝光過度的圖片。 素材與效果圖2.5.2 校正偏色 【案例2.11】利用“色階工具”矯正偏色。 偏色 物質(zhì)原本是黑白灰色的，在正常白光照射下，反射的RGB三個顏色分量相等。當(dāng)眼睛（或拍攝器材）出了問題，或在數(shù)字化（如掃描）過程中使用了錯誤的設(shè)置，或是在不同色溫的復(fù)雜光源照射下，得到的照片中物體的RGB值就不相等了，這就是偏色 。 素材與效果圖說明：本案例的重點(diǎn)及難點(diǎn)都在灰場取樣，僅調(diào)整黑場和白場是不能校正偏色的，必須同時確定正確的灰場。2.5.3 渲染色彩渲染色彩 可以將普通的圖像再加工、藝術(shù)化。藝術(shù)化可

26、以基于現(xiàn)有的圖像，也可以從無到有進(jìn)行原創(chuàng)。常用工具有色相/飽和度、曲線調(diào)整、濾鏡。 【案例2.12】紅花變藍(lán)花。 素材與效果圖 【案例2.13】多云的白晝變艷麗的黃昏。 素材與效果圖 【案例2.14】創(chuàng)造木頭材質(zhì)效果。 素材與效果圖 【案例2.15】模擬彩色濾鏡。 素材與效果圖2.5.4 修飾圖像修飾圖像 包括消除紅眼、修復(fù)污點(diǎn)、抹除多余景物等。 【案例2.16】修復(fù)紅眼。 素材與效果圖 【案例2.17】修復(fù)臉上的污點(diǎn)。 素材與效果圖 【案例2.18】抹除照片右側(cè)人物，并將主體人物平移。 素材與效果圖作業(yè)【案例2.2】素材【案例2.2】裁剪后效果【案例2.3】素材【案例2.3】裁剪后效果【案例

27、2.4】素材【案例2.4】矯正后效果【案例2.5】素材【案例2.5】矯正后效果【案例2.6】素材【案例2.6】拼接效果【案例2.7】素材【案例2.7】調(diào)整后效果【案例2.8】素材【案例2.8】調(diào)整后效果【案例2.9】素材【案例2.9】調(diào)整后效果【案例2.10】原始素材【案例2.10】調(diào)整后效果【案例2.11】原始素材【案例2.11】調(diào)整后效果【案例2.12】原始素材【案例2.11】調(diào)整后效果【案例2.13】原始素材【案例2.13】調(diào)整后效果【案例2.14】效果【案例2.15】原始素材【案例2.15】調(diào)整后效果【案例2.16】原始素材【案例2.16】修復(fù)后效果【案例2.17】原始素材【案例2.1

28、7】修復(fù)后效果【案例2.18】原始素材【案例2.18】調(diào)整后效果圖標(biāo)庫第3章 圖像綜合處理本章要點(diǎn)圖層的概念、操作方法，圖層樣式與混合模式，圖層的填充與調(diào)整摳圖工具與摳圖方法，圖像合成技術(shù)蒙板、路徑與通道的概念與應(yīng)用Photoshop中的文字處理方法目 錄3.1 圖層的概念與操作3.2 摳圖與合成3.3 使用蒙版3.4 使用路徑3.5 使用通道3.6 文字處理3.1 圖層的概念與操作3.1.1 圖層基本概念3.1.2 圖層操作方法3.1.3 圖層樣式及混合模式3.1.4 填充圖層和調(diào)整圖層3.1.1 圖層基本概念 圖層 是制作復(fù)雜圖像效果所必需的處理手段。圖層就像玻璃紙，當(dāng)在每張玻璃紙上分別畫

29、上不同的圖案，并將他們疊放在一起，就會看到組合出的新的圖案，去除或修改某張玻璃紙上的內(nèi)容會產(chǎn)生不同的結(jié)果，且并不影響其余玻璃紙上的內(nèi)容。Photoshop中的圖層背景圖層普通圖層提示：按住Alt鍵并雙擊“背景”圖層，可快速將“背景”圖層變成普通圖層。3.1.2 圖層操作方法 圖層面板是Photoshop中非常重要的面板窗口，專門用于圖層的操作和管理 ?！景咐?.1】分層繪制RGB三原色。3.1.3 圖層樣式及混合模式圖層樣式 是針對單個圖層加入的特殊效果【案例3.2】利用酒瓶與天空合成新的效果圖。 素材與效果圖混合模式 是兩個或多個圖層之間對應(yīng)像素顏色的運(yùn)算方式 【案例3.3】加色原理與減色原

30、理 ?！景咐?.4】合成人物與風(fēng)景 。 素材與效果圖3.1.4 填充圖層和調(diào)整圖層 填充圖層 是具有實(shí)色、漸變或圖案等填充效果的層，可以通過混合模式、不透明度及填充不透明度等方式影響其下面的圖層。調(diào)整圖層 是包含圖像調(diào)整信息（如色階、曲線等）的層，可以像圖像調(diào)整工具（如色階、曲線等）那樣調(diào)整其下面的圖層。 素材與效果圖【案例3.5】利用填充圖層制作淡出風(fēng)格的雪景?！景咐?.6】利用填充圖層及調(diào)整圖層制作玉貝殼 。 素材與效果圖3.2 摳圖與合成 3.2.1 選區(qū)的概念 3.2.2 套索摳圖 3.2.3 魔棒摳圖 3.2.4 快速選擇工具 3.2.5 橡皮擦摳圖 3.2.6 濾鏡摳圖與合成 3.

31、2.1 選區(qū)的概念 選區(qū) 在編輯和處理圖像時，可以根據(jù)需要創(chuàng)建一個可編輯區(qū)域，稱為選區(qū)。建立選區(qū)后，所有操作只對選區(qū)內(nèi)的圖像起作用，這樣，就不會影響選區(qū)外的圖像。 創(chuàng)建規(guī)則選區(qū)：矩形選框工具、橢圓選框工具創(chuàng)建不規(guī)則選區(qū)：套索工具、魔棒工具、快速選擇工具，還可以將通道、路徑等轉(zhuǎn)換為選區(qū)建立選區(qū)后，單擊菜單【選擇】，可以選用多種命令對選區(qū)進(jìn)行操作 3.2.2 套索摳圖套索工具組 套索、多邊形套索、磁性套索【案例3.7】使用“多邊形套索工具”摳圖 。 素材與效果圖【案例3.8】使用“磁性套索工具”摳圖 。 素材與效果圖3.2.3 魔棒摳圖 魔棒工具 適合選擇顏色較一致的區(qū)域，而不必像使用套索工具那樣

32、跟蹤物體的輪廓。 【案例3.9】使用“魔棒工具”摳圖 。素材與效果圖【案例3.10】使用“魔棒工具”摳圖 ，并合成一張更換天空的圖片 。素材與效果圖3.2.4 快速選擇工具 快速選擇工具 是對魔棒的升級，可以拖動“快速選擇工具”繪制出一個選區(qū) 。 【案例3.11】使用“快速選擇工具”摳圖 。素材與效果圖3.2.5 橡皮擦摳圖橡皮擦工具組 橡皮擦、背景橡皮擦、魔術(shù)橡皮擦【案例3.12】使用“橡皮擦工具”摳圖并合成圖像 。 素材與效果圖【案例3.13】使用“背景橡皮擦工具”摳圖并合成 。素材與效果圖【案例3.14】使用“魔術(shù)橡皮擦工具”摳圖并合成 。素材與效果圖3.2.6 濾鏡摳圖與合成【案例3.

33、15】使用“抽出”濾鏡摳圖。素材與效果圖【案例3.16】使用“消失點(diǎn)”濾鏡合成圖像 。素材與效果圖3.3 使用蒙板 蒙版 類似一張覆蓋在圖層上的玻璃紙，可任意在玻璃紙上涂抹而不會破壞圖像本身。使用蒙版可以隱藏圖層中的局部區(qū)域，也可使局部或整體產(chǎn)生半透明的效果，結(jié)合圖層混合模式會產(chǎn)生更多的圖像效果。 蒙版中只能繪制黑色、白色和灰色三類顏色，黑色區(qū)表示屏蔽區(qū)，白色區(qū)表示非屏蔽區(qū)，灰色區(qū)表示具有一定不透明度的區(qū)域。 Photoshop中的蒙版有圖層蒙版、矢量蒙版和剪貼蒙版三類。 3.3 使用蒙板【案例3.17】獅王的守護(hù) 。素材與效果圖【案例3.18】草叢中的舞蹈精靈 。素材與效果圖【案例3.19】

34、虎虎生威 。素材與效果圖3.4 使用路徑【案例3.20】用路徑摳圖并合成 。素材與效果圖3.5 使用通道【案例3.21】利用通道摳圖（蘋果G3火焰字） 。素材與效果圖通道 是Photoshop中非常重要的一部分內(nèi)容，根據(jù)其保存信息的含意，通道可分為原色通道、專色通道和Alpha通道。無論是哪種類型的通道，都和蒙版類似，只能在其中看到黑色、白色和灰色三類顏色。 3.6 文字處理【案例3.22】使用文字圖層產(chǎn)生文字效果 。素材與效果圖添加文字圖層可使用“橫排文字工具”或“直排文字工具”，添加文字蒙版的方法是使用“橫排文字蒙版工具”或“直排文字蒙版工具” 【案例3.23】用路徑引導(dǎo)文字 ?！景咐?.

35、24】制作金屬質(zhì)感的文字 。效果圖【案例3.25】制作金屬質(zhì)感的文字 。效果圖效果圖作業(yè)【案例3.2】素材【案例3.2】合成效果【案例3.4】素材【案例3.4】合成效果【案例3.2】素材【案例3.2】合成效果【案例3.5】原始圖片【案例3.5】效果【案例3.6】素材【案例3.6】合成效果【案例3.7】原始素材【案例3.7】摳圖效果【案例3.8】原始素材【案例3.8】摳圖效果【案例3.9】原始素材【案例3.9】摳圖效果【案例3.10】原始素材【案例3.10】摳圖后合成效果【案例3.11】原始素材【案例3.11】摳圖后合成效果【案例3.12】原始素材【案例3.12】摳圖后合成效果【案例3.13】原

36、始素材【案例3.13】摳圖后合成效果【案例3.14】原始素材【案例3.14】摳圖后合成效果【案例3.15】原始素材【案例3.15】摳圖效果【案例3.16】原始素材【案例3.16】摳圖后合成效果【案例3.17】原始素材【案例3.16】合成效果【案例3.18】原始素材【案例3.18】合成效果【案例3.19】原始素材【案例3.19】合成效果【案例3.20】原始素材【案例3.20】摳圖后合成效果【案例3.21】原始素材【案例3.21】摳圖后合成效果【案例3.22】原始素材【案例3.22】合成效果【案例3.23】效果圖【案例3.24】效果圖【案例3.25】效果圖圖標(biāo)庫第4章 Flash動畫基礎(chǔ)本章要點(diǎn)F

37、lash CS3的工作環(huán)境和基本操作Flash繪圖基礎(chǔ)和繪圖工具幀、時間軸、圖層與元件目 錄4.1 Flash CS3工作環(huán)境概述 4.2 Flash CS3繪圖基礎(chǔ) 4.3 動畫制作基礎(chǔ) 4.4 元件的創(chuàng)建與編輯 4.1 Flash CS3工作界面概述 4.1.1 工作環(huán)境簡介4.1.2 面板4.1.3 Flash CS3文檔的基本操作4.1.1 工作環(huán)境簡介歡迎屏幕工作窗口4.1.2 面板 面板圍繞在舞臺的下面和右面，包括“幫助”面板、“動作”面板、 “屬性”面板、“濾鏡”面板、 “變形”面板、 “對齊”面板、 “顏色”面板、 “庫”面板、 “場景”面板。4.1.3 Flash CS3文檔

38、的基本操作 Flash CS3文檔的基本操作包括：新建文件、文檔屬性設(shè)定、保存文件、測試動畫、打開文件、導(dǎo)入文件、發(fā)布動畫等。 選擇菜單下的相應(yīng)命令即可完成這些操作，也可以使用快捷鍵進(jìn)行操作。 4.2 Flash CS3繪圖基礎(chǔ) 4.2.9 套索工具 4.2.10 任意（漸變）變形工具 4.2.11 鋼筆工具4.2.12 刷子工具4.2.13 文本工具4.2.14 填充圖形對象工具4.2.15 動畫文檔的基本操作4.2.1 Flash繪圖基礎(chǔ) 4.2.2 線條工具4.2.3 鉛筆工具4.2.4 矩形（基本矩形）工具4.2.5 橢圓（基本橢圓）工具4.2.6 多角星形工具4.2.7 選擇工具4.

39、2.8 部分選取工具4.2.1 Flash繪圖基礎(chǔ) Flash中繪制的是矢量圖形，由筆觸和填充構(gòu)成，在繪制各種圖形時，在工具箱的“顏色”區(qū) 可以設(shè)置圖形的筆觸顏色、填充顏色以及筆觸的粗細(xì)、樣式等屬性 。 Flash提供了兩種繪制模式，合并繪制模式和對象繪制模式。4.2.2 線條工具線條工具 用于繪制各種筆觸樣式的矢量直線。通過“屬性”面板，可以設(shè)置線條的顏色、線型和粗細(xì)等。4.2.3 鉛筆工具鉛筆工具 用于繪制簡單的矢量線條，其繪圖方式與使用真實(shí)鉛筆大致相同，“鉛筆工具”提供了“直線化”、“平滑”和“墨水”三種繪圖模式。4.2.4 矩形工具和基本矩形工具Flash提供了兩種繪制矩形的工具，即矩

40、形工具和基本矩形工具，通過“屬性”面板，可以設(shè)置矩形的筆觸顏色、線型、粗細(xì)、填充顏色和矩形邊角半徑等 。提示：按住Shift鍵，即可繪制正方形。4.2.5 橢圓工具和基本橢圓工具Flash提供了兩種繪制橢圓的工具，即橢圓工具和基本橢圓工具，通過“屬性”面板，可以設(shè)置橢圓的筆觸顏色、線型、粗細(xì)、填充顏色和起始、結(jié)束角度等 。提示：使用基本矩形工具和基本橢圓工具，只能用于對象繪制 。4.2.6 多角星形工具“多角星形工具” 用于繪制任意多邊形和星形圖形?？梢酝ㄟ^“屬性”面板的“選項(xiàng)”按鈕 、設(shè)置多邊形或星形的樣式、邊數(shù)和星形頂點(diǎn)大小等 。4.2.7 選擇工具“選擇工具” 用于抓取、選擇、移動和改變

41、圖形形狀，它是Flash中使用最多的工具。使用工具箱的“選項(xiàng)”區(qū)的“緊貼至對象”、“平滑”和“伸直”3個選項(xiàng)，可以完成“對齊”、“平滑”和“伸直”操作，使用此操作可以減少錨點(diǎn)。 【案例4.1】繪制中國銀行標(biāo)志。 效果圖 【案例4.2】繪制瓢蟲。 效果圖4.2.8 部分選取工具“選擇工具”也可用于抓取、選擇、移動和改變圖形形狀，但它主要用來更精細(xì)的調(diào)整圖形形狀?？梢酝瓿梢韵虏僮鳎?移動路徑點(diǎn)位置，可以改變對象的形狀。 拖動控制點(diǎn)，可以改變曲線的弧度。 選中路徑點(diǎn)后按Delete鍵，可以刪除路徑點(diǎn)。 按住Alt鍵，可以改變路徑點(diǎn)類型。 按住Ctrl鍵，可以對路徑進(jìn)行縮放、變形等 4.2.9 套索工

42、具“套索工具”主要用于選取圖形中不規(guī)則的形狀區(qū)域 ?！疤姿鞴ぞ摺边x中后，在工具箱的“選項(xiàng)”區(qū)會出現(xiàn)3個選項(xiàng) ： 魔術(shù)棒 用于選取相近顏色區(qū)域，操作對象為位圖圖像。 魔術(shù)棒設(shè)置 用于設(shè)置魔術(shù)棒的閾值和平滑。 多邊形模式 用于用直線精確地繪制出對象的輪廓 4.2.10 任意變形與漸變變形工具“任意變形工具”用于改變工作區(qū)中對象的形狀。“漸變變形工具”用于更改漸變的方式。 【案例4.3】繪制花朵。 效果圖4.2.11 鋼筆工具“鋼筆工具”是一個工具組，在繪制過程中，與組中的其余三個工具（添加錨點(diǎn)工具、刪除錨點(diǎn)工具及轉(zhuǎn)換錨點(diǎn)工具）結(jié)合使用，通過對路徑錨點(diǎn)進(jìn)行相應(yīng)的調(diào)整，繪制出精確的路徑。 【案例4.4

43、】繪制中國心。 效果圖4.2.12 刷子工具“刷子工具” 用于繪制自由形狀的矢量填充，其繪圖如同毛筆繪畫一般?！八⒆庸ぞ摺边x中后，可以在工具箱的“選項(xiàng)”區(qū)設(shè)置 “刷子模式”、“刷子大小”和“刷子形狀”。以下是5種刷子模式的繪圖效果。 4.2.13 文本工具“文本工具” 用于輸入或編輯文本。在創(chuàng)建文本后，選擇【修改】【分離】命令可以將多字符文本的每一個文本都放置在單獨(dú)的文本框中。再次執(zhí)行【修改】【分離】命令可以將文本轉(zhuǎn)換為圖形對象，從而使文本可以像圖形一樣被編輯。以下是對文本執(zhí)行1次和2次分離后的效果。 提示：執(zhí)行分離操作時也可以使用快捷鍵Ctrl+B。4.2.14 填充圖形對象工具Flash工

44、具箱中提供了“墨水瓶工具”、“顏料桶工具”、“滴管工具”和“橡皮擦工具”等用于填充圖形對象的工具。 4.2.15 動畫文檔的基本操作 【案例4.5】制作標(biāo)語 。4.3 動畫制作基礎(chǔ)4.3.1 幀 4.3.2 時間軸與圖層 4.3.1 幀 幀 電影是由一格一格的膠片按照先后順序播放出來的，由于人眼有視覺暫留現(xiàn)象，這一格一格的膠片按照一定速度播放出來，我們看起來就“動”了。動畫制作采用的也是這一原理，而這一格一格的膠片，就是 Flash 中的“幀”。 Flash CS3中的幀包括：空白幀、關(guān)鍵幀、空白關(guān)鍵幀、過渡幀、普通幀。 幀的操作有：插入幀、刪除幀、移動幀、復(fù)制粘貼關(guān)鍵幀、清除幀、轉(zhuǎn)換幀、設(shè)置

45、幀頻【案例4.6】制作笑臉。效果4.3.2 時間軸與圖層 時間軸 時間軸用來組織和控制動畫，在不同時間播放不同圖層和幀的內(nèi)容，時間軸主要由層、幀和播放頭組成。 圖層 圖層可以看成是相互堆疊在一起的許多透明紙，每一張紙上繪制著一些圖形和文字。可以在圖層上繪制和編輯對象，而不會影響其他圖層上的對象。 圖層具有獨(dú)立性，當(dāng)改變其中任何一個圖層的對象時，其他圖層中的對象保持不變。 【案例4.7】制作場景。效果4.4 元件的創(chuàng)建與編輯4.4.1 元件與實(shí)例 4.4.2 創(chuàng)建圖形元件 4.4.3 按鈕元件的制作4.4.4 影片剪輯元件的制作4.4.5 元件創(chuàng)建實(shí)例4.4.1 元件與實(shí)例 實(shí)例 指位于舞臺上或

46、嵌套在另一個元件內(nèi)的元件副本 。元件 是在Flash中創(chuàng)建的圖形、按鈕或影片剪輯，是Flash動畫設(shè)計(jì)最基本、最重要的元素。元件只需創(chuàng)建一次，即可在整個文檔或其它文檔中重復(fù)使用 ，每個元件都有自己的時間軸，可以將幀、關(guān)鍵幀和層添加到元件時間軸。包括圖形元件、影片剪輯元件和按鈕元件。 庫 是元件和實(shí)例的載體，它最基本的用處是對動畫中的元件進(jìn)行管理，使用庫可以省去很多重復(fù)操作及一些不必要的麻煩。4.4.2 創(chuàng)建圖形元件 【案例4.8】直接創(chuàng)建圖形元件星星。 【案例4.9】將案例4.2繪制的瓢蟲轉(zhuǎn)換為元件 。效果圖4.4.3 按鈕元件的制作 【案例4.10】臉色按鈕 。創(chuàng)建按鈕元件需要3個基本過程，

47、即繪制按鈕圖案、添加按鈕關(guān)鍵幀和編寫按鈕事件。按鈕元件有如下4個狀態(tài)：彈起狀態(tài)、指針經(jīng)過狀態(tài)、按下狀態(tài)、點(diǎn)擊狀態(tài)。效果4.4.4 影片剪輯元件的制作 【案例4.11】閃爍的星星 。影片剪輯元件本身就是一段動畫，它和按鈕元件一樣，有自己的時間軸，使用影片剪輯元件可創(chuàng)建反復(fù)使用的動畫片段，且可獨(dú)立播放，可以包括交互式控件、聲音，甚至其它影片剪輯實(shí)例。效果4.4.5 元件創(chuàng)建實(shí)例 【案例4.12】變化的星星 。效果作業(yè)【案例4.1】效果圖【案例4.2】效果圖【案例4.3】效果圖【案例4.4】效果圖【案例4.6】效果【案例4.7】效果【案例4.8】效果【案例4.10】效果【案例4.11】效果【案例4.

48、12】效果圖標(biāo)庫第5章 Flash動畫制作本章要點(diǎn)創(chuàng)建動畫的各種方式：逐幀動畫、形狀補(bǔ)間動畫、動作補(bǔ)間動畫、引導(dǎo)路徑動畫、遮罩動畫、時間軸特效等在動畫中使用聲音Flash動畫簡單腳本目 錄5.1 逐幀動畫5.2 形狀補(bǔ)間動畫5.3 動作補(bǔ)間動畫 5.4 引導(dǎo)路徑動畫 5.5 遮罩動畫 5.6 時間軸特效 5.7 聲音的應(yīng)用5.8 Flash動畫簡單腳本 5.1 逐幀動畫 逐幀動畫 將動畫中的每一幀都設(shè)置為關(guān)鍵幀，在每一個關(guān)鍵幀中創(chuàng)建不同的內(nèi)容，就成為逐幀動畫。逐幀動畫主要應(yīng)用于創(chuàng)建沒有規(guī)律的運(yùn)動動畫。 【案例5.1】轉(zhuǎn)動的地球，導(dǎo)入圖片建立逐幀動畫。 效果 【案例5.2】利用逐幀動畫，設(shè)計(jì)一個

49、倒計(jì)時計(jì)數(shù)器。 效果5.2 形狀補(bǔ)間動畫 形狀補(bǔ)間動畫 就是在一個關(guān)鍵幀中繪制一個圖形，在另一個關(guān)鍵幀中更改該圖形或繪制另一個圖形，F(xiàn)lash通過計(jì)算生成中間各幀來創(chuàng)建的動畫。形狀補(bǔ)間動畫可以實(shí)現(xiàn)兩個圖形之間顏色、形狀、大小、位置等的變化，使用的元素多為繪畫出來的“形狀”。制作方法 【案例5.3】圖形變形。 效果 【案例5.4】變形文字。效果 【案例5.5】變形文字（使用形狀提示）。效果提示：如果使用圖形元件、按鈕、文字，則必先“打散”將其轉(zhuǎn)換為“形狀”才能創(chuàng)建形狀補(bǔ)間動畫。5.3 動作補(bǔ)間動畫 動作補(bǔ)間動畫 就是給對象指定一個開始位置和終止位置，F(xiàn)lash通過計(jì)算生成中間各幀，使其產(chǎn)生運(yùn)動的

50、效果 。動作補(bǔ)間動畫可以改變這個元件的大小、顏色、位置、透明度等，還可以創(chuàng)建淡入、淡出動畫效果。制作方法 【案例5.6】小車碰撞。 效果 【案例5.7】旋轉(zhuǎn)的金箍棒。效果提示：與形狀補(bǔ)間動畫相反，構(gòu)成動作補(bǔ)間動畫的元素必須是對象組合或是元件，否則不能設(shè)置動作補(bǔ)間動畫。5.4 引導(dǎo)路徑動畫 引導(dǎo)路徑動畫 將一個或多個層鏈接到一個運(yùn)動引導(dǎo)層，使一個或多個對象沿同一條路徑運(yùn)動的動畫形式。這種動畫可以使一個或多個元件完成曲線或不規(guī)則運(yùn)動。制作方法 【案例5.8】魚兒游。 效果 【案例5.9】流動文字。效果5.5 遮罩動畫 遮罩動畫 在Flash中主要是通過圖層來實(shí)現(xiàn)的，可以把它理解為一個特殊的層，為了

51、得到特殊的顯示效果，可以在這個特殊的層上創(chuàng)建一個任意形狀的“窗口”，遮罩層下方的對象可以通過該“窗口”顯示出來，而“窗口”之外的對象將被隱藏起來。制作方法 【案例5.10】望遠(yuǎn)鏡。 效果 【案例5.11】閃光文字。效果提示：遮罩可以是一個形狀，也可以是文字，甚至是隨意畫的一個區(qū)域，任何一個不規(guī)則形狀的范圍都可用做遮罩。5.6 時間軸特效 Flash包含了多種預(yù)設(shè)的時間軸特效，使用預(yù)設(shè)的時間軸特效可以用最少的步驟創(chuàng)建復(fù)雜的動畫。恰當(dāng)合理地運(yùn)用時間軸特效，可以為動畫添加一些特殊的效果，可以應(yīng)用時間軸特效的對象有文本、圖形（包括形狀、組以及圖形元件）、位圖圖像、按鈕元件。 Flash內(nèi)建的時間軸特效

52、共分為三大類，“變形/轉(zhuǎn)換”、“幫助”、“效果”。“變形/轉(zhuǎn)換”子菜單中包含“變形”和“轉(zhuǎn)換”兩項(xiàng)；“幫助”子菜單中包含“分散式直接復(fù)制”和“復(fù)制到網(wǎng)格”兩項(xiàng)；“效果”子菜單中包含“分離”、“展開”、“投影”和“模糊”四項(xiàng)。 5.7 聲音的應(yīng)用5.7.1 聲音的導(dǎo)入 5.7.2 使用行為控制聲音 5.7.1 聲音的導(dǎo)入 向Flash中導(dǎo)入聲音，可單擊【文件】【導(dǎo)入】【導(dǎo)入到庫】，在“導(dǎo)入”對話框中，定位并打開所需的聲音文件，也可以將聲音從公用庫拖入當(dāng)前文檔的庫中 。 導(dǎo)入到庫中的聲音，如果不將其添加至?xí)r間軸，導(dǎo)入的聲音文件就不起任何作用。要將導(dǎo)入到庫中的聲音添加到時間軸，應(yīng)先新建一個承載聲音文

53、件的圖層，選定新建的聲音層后，將聲音從“庫”面板中拖到舞臺中。 【案例5.12】為案例5.6導(dǎo)入聲音。 效果5.7.2 使用行為控制聲音 行為 是預(yù)先編寫好的一段具有特定控制功能的ActionScript 2.0動作腳本，以一個命令的形式存放于“行為”面板中，可以將它們應(yīng)用于對象（按鈕或影片剪輯元件）。可以使用行為將聲音載入文件 或者使用行為播放或停止聲音。 【案例5.13】音樂控制。 效果5.8 Flash簡單動畫腳本5.8.1 Flash動畫腳本基礎(chǔ) 5.8.2 添加動作的位置5.8.3 流程控制語句5.8.1 Flash動畫腳本基礎(chǔ)“動作”面板的組成 。 實(shí)例的命名 點(diǎn)語法的使用 常用時

54、間軸控制函數(shù)函數(shù)說明Play()開始播放動畫Stop()停止播放動畫gotoAndPlay()跳轉(zhuǎn)到某幀處繼續(xù)播放動畫gotoAndStop()跳轉(zhuǎn)到某幀處停止播放動畫stopAllsounds()停止播放所有的聲音5.8.2 添加動作的位置給關(guān)鍵幀添加動作。 【案例5.14】為關(guān)鍵幀添加動作。 效果給按鈕元件添加動作。 【案例5.15】為按鈕元件添加動作。 效果給影片剪輯元件添加動作。 【案例5.16】為影片剪輯元件添加動作。 效果5.8.3 流程控制語句條件控制語句ifelse 。 if（條件1） 語句1 else 語句2 【案例5.17】移動的球效果循環(huán)控制語句for 。 for（表達(dá)式

55、1；條件表達(dá)式；表達(dá)式2） 語句 【案例5.18】隨機(jī)小球效果作業(yè)形狀補(bǔ)間動畫的制作創(chuàng)建形狀補(bǔ)間動畫的具體操作方法為： 在“時間軸”面板上動畫開始的關(guān)鍵幀設(shè)置初始的圖形 在動畫結(jié)束關(guān)鍵幀設(shè)置要變成的圖形 單擊開始幀，在“屬性”面板“補(bǔ)間”中選擇“形狀”選項(xiàng)，或在開始幀上單擊鼠標(biāo)右鍵選擇“創(chuàng)建補(bǔ)間形狀”動作補(bǔ)間動畫的制作創(chuàng)建動作補(bǔ)間動畫的具體操作方法為： 在“時間軸”面板上動畫開始的關(guān)鍵幀設(shè)置一個對象 在動畫結(jié)束關(guān)鍵幀改變對象的屬性 再單擊開始幀，在屬性面板“補(bǔ)間”中選擇“動作”選項(xiàng)，或在開始幀上單擊鼠標(biāo)右鍵選擇“創(chuàng)建補(bǔ)間動畫”引導(dǎo)路徑動畫的制作創(chuàng)建引導(dǎo)路徑動畫的具體操作方法為： 在包含運(yùn)動對象

56、的圖層上方添加運(yùn)動引導(dǎo)層 在運(yùn)動引導(dǎo)層中用繪圖工具畫出一條運(yùn)動路徑 在包含運(yùn)動對象的圖層中，在起始幀把運(yùn)動對象的中心點(diǎn)移到路徑的起始端點(diǎn)，在結(jié)束幀把運(yùn)動對象的中心點(diǎn)移到路徑的結(jié)束端點(diǎn) 在兩個關(guān)鍵幀之間創(chuàng)建補(bǔ)間動畫遮罩動畫的制作創(chuàng)建遮罩動畫的具體操作方法為： 創(chuàng)建或選擇一個圖層作為被遮罩層，在該圖層中應(yīng)包含將出現(xiàn)在遮罩中的對象 在被遮罩層上面創(chuàng)建一個新圖層作為遮罩層，在該圖層中創(chuàng)建形狀、文字或任意的區(qū)域等 在“時間軸”面板中在遮罩層上單擊右鍵選擇“遮罩層”?！景咐?.1】效果圖【案例5.2】效果圖【案例5.3】效果圖【案例5.4】效果圖【案例5.5】效果【案例5.6】效果【案例5.7】效果【案例

57、5.8】效果【案例5.9】效果【案例5.10】效果【案例5.11】效果【案例5.12】效果【案例5.13】效果【案例5.14】效果【案例5.15】效果【案例5.16】效果【案例5.17】效果【案例5.18】效果圖標(biāo)庫第6章 初識Dreamweaver CS3 本章要點(diǎn) Dreamweaver CS3的操作界面和基本操作方法本地站點(diǎn)的創(chuàng)建與管理站點(diǎn)中文件的操作目錄6.1 Dreamweaver CS3工作環(huán)境6.2 創(chuàng)建第一個網(wǎng)站6.1 Dreamweaver CS3工作環(huán)境6.1.1 Dreamweaver CS3工作界面6.1.2 文檔窗口6.1.3 菜單欄和插入欄6.1.4 常用面板6.1

58、.1 Dreamweaver CS3工作界面歡迎屏幕 6.1.1 Dreamweaver CS3工作界面工作界面6.1.2 文檔窗口文檔工具欄 狀態(tài)欄 標(biāo)尺和網(wǎng)格 6.1.3 菜單欄和插入欄1菜單欄2插入欄制表符格式的插入欄 菜單格式的插入欄 6.1.4 常用面板1屬性面板2面板組6.2 創(chuàng)建第一個網(wǎng)站6.2.1 創(chuàng)建本地站點(diǎn)6.2.2 創(chuàng)建簡單網(wǎng)頁6.2.3 站點(diǎn)管理6.2.4 站點(diǎn)文件操作6.2.1 創(chuàng)建本地站點(diǎn) 定義本地站點(diǎn)是指用戶在本地計(jì)算機(jī)上，構(gòu)建出站點(diǎn)的框架，從整體上對站點(diǎn)進(jìn)行全局把握。 【案例6.1】利用Dreamweaver CS3創(chuàng)建一個本地站點(diǎn)mysite1 。6.2.2

59、創(chuàng)建簡單網(wǎng)頁【案例6.2】在mysite1站點(diǎn)根目錄下創(chuàng)建一個簡單網(wǎng)頁。新建文件 設(shè)置頁面外觀 輸入文字 保存文件 在瀏覽器中預(yù)覽 6.2.3 站點(diǎn)管理1打開站點(diǎn)2編輯站點(diǎn)3刪除站點(diǎn)6.2.4 站點(diǎn)文件操作1創(chuàng)建文件（文件夾）2復(fù)制、移動、刪除文件圖標(biāo)庫第7章 網(wǎng)頁基本元素 本章要點(diǎn) 文本和圖像的插入和編輯插入flash動畫、音頻和視頻創(chuàng)建超級鏈接創(chuàng)建表單目錄7.1 文本7.2 圖像7.3 Flash動畫7.4 插入導(dǎo)航條7.5 音頻與視頻7.6 創(chuàng)建超鏈接7.7 表單7.1 文本7.1.1 插入文本7.1.2 設(shè)置文字屬性7.1.3 設(shè)置段落屬性7.1.1 插入文本在字符之間添加空格按 Ct

60、rl+Shift+ 空格鍵。選擇【插入】【HTML】【特殊字符】【不換行空格】。在“插入”欄中的“文本”選項(xiàng)卡中，單擊“字符”按鈕并選擇“不換行空格” 圖標(biāo)。換行插入特殊字符 創(chuàng)建項(xiàng)目列表和編號列表 單擊“屬性”面板中的“項(xiàng)目列表”按鈕或“編號列表”按鈕。單擊【文本】【列表】，根據(jù)需要選擇“項(xiàng)目列表”或“編號列表”。【案例7.1】 7.1.2 設(shè)置文字屬性更改字體更改字號更改字體顏色 更改字體樣式 （粗體、斜體、下劃線等） 7.1.3 設(shè)置段落屬性對齊文本縮進(jìn)文本設(shè)置段落格式 添加水平線和時間 【案例7.2】對案例7.1所創(chuàng)建的網(wǎng)頁，設(shè)置文本屬性。 7.2 圖像7.2.1 插入圖像7.2.2