靜態(tài)網站建設課件全套教程_第1頁
靜態(tài)網站建設課件全套教程_第2頁
靜態(tài)網站建設課件全套教程_第3頁
靜態(tài)網站建設課件全套教程_第4頁
靜態(tài)網站建設課件全套教程_第5頁
已閱讀5頁，還剩78頁未讀， 繼續(xù)免費閱讀

下載本文檔

版權說明：本文檔由用戶提供并上傳，收益歸屬內容提供方，若內容存在侵權，請進行舉報或認領

文檔簡介

關于網站什么是網站？

在網上看到的一個個網頁頁面的集合就是網站.

網站可分為4類:門戶網站、職能網站、專業(yè)網站和個人網站。

門戶網站：這是一種涉及領域最廣的網站，比如搜索、論壇、聊天室等功能，國內常見的門戶網站雅虎中國、新浪、網易等。

職能網站：是一類具有專門功能的網站。如政府部門、商務網站等。例如阿里吧吧、卓越網、易趣網以及當當網上書店等。

專業(yè)網站：專業(yè)性非常強，它只涉及生活中的某一領域，但內容卻十分專業(yè)一般為專業(yè)人士服務，例如網頁制作大寶庫、黃金書屋、中央電視臺等。

個人網站：一般個人為了興趣愛好或為了展示自己等目的建設的網站，因此風格內容樣式可以形色各異包羅萬象。網頁網頁的學名稱作HTML文件，是一種可以在www(萬維網)上傳輸，并被瀏覽器認識和翻譯成頁面顯示出來的文件www是“worldwideweb”的縮寫HTML的意思則是“HypertextMarkupLanguage”,中文翻譯為“超文本標記語言”?！俺谋尽本褪侵疙撁鎯瓤梢园瑘D片，鏈接，甚至音樂，程序等非文字的元素網頁組成及分類網頁的組成

文本：文本是一個網頁的最基本元素，是必不可少的。

圖片：一個比較成功的網頁，除了有文字信息外還需要一些圖片為網頁增色，是它更加具有魅力。

多媒體：主要指文字、圖形、圖象聲音、動畫等人的器官能夠直接感受到和理解的多種信息類型。

超鏈接：是WWW上的一種連接技巧，它通過已定義好的關鍵字和圖形由當前標題或內容索引信息指想別的頁面的連接點。有了超鏈接我們就可以任意遨游Internet了。網頁的分類

按網頁的表現(xiàn)形式可將網頁分為靜態(tài)網頁和動態(tài)網頁。

一般用戶制作的都是靜態(tài)網頁，它是一切網頁的基礎。

動態(tài)網頁也是首先制作靜態(tài)網頁，然后再加上動態(tài)技術就可以制作出完美的動態(tài)網頁了。超文本標記語言HTML

(HyperTextMarkupLanguage)HTML概述超文本標記語言HTML中的Markup的意思就是“設置標記”。HTML定義了許多用于排版的命令（標簽）。HTML把各種標簽嵌入到萬維網的頁面中。這樣就構成了所謂的HTML文檔。HTML文檔是一種可以用任何文本編輯器創(chuàng)建的ASCII碼文件。僅當HTML文檔是以.html或.htm為后綴時，瀏覽器才對此文檔的各種標簽進行解釋。當瀏覽器從服務器讀取HTML文檔后，就按照HTML文檔中的各種標簽，根據(jù)瀏覽器所使用的顯示器的尺寸和分辨率大小，重新進行排版并恢復出所讀取的頁面。

HTML的格式與標簽元素(element)是HTML文檔結構的基本組成部分。一個HTML文檔本身就是一個元素。每個HTML文檔由兩個主要元素組成：首部(head)和主體(body)。首部包含文檔的標題(title)，以及系統(tǒng)用來標識文檔的一些其他信息。標題相當于文件名。文檔的主體是HTML文檔的最主要的部分。主體部分往往又由若干個更小的元素組成，如段落(paragraph)、表格(table)、和列表(list)等。HTML用一對標簽（即一個開始標簽和一個結束標簽）或幾對標簽來標識一個元素。開始標簽由一個小于字符“<”、一個標簽名、和一個大于字符“>”組成。結束標簽和開始標簽的區(qū)別只是在小于字符的后面要加上一個斜杠字符“/”。標簽名并不區(qū)分大寫和小寫。有一些標簽可以將結束標簽省略。TagDescription<HTML>…</HTML>聲明這是用HTML寫的萬維網文檔<HEAD>…</HEAD>定界頁面的頭部<TITLE>…</TITLE>定義頁面的標題(不在瀏覽器的顯示窗口中顯示)<BODY>…</BODY>定界頁面的主體<Hn>…</Hn>定界一個n級標題<B>…</B>設置…為黑體字<I>…</I>設置…為斜體字<UL>…</UL>設置無序列表<OL>…</OL>設置編號列表<MENU>…</MENU>設置菜單<LI>開始一個列表選項(可以沒有<LI>)<BR>強制換行<P>一行的開始<HR>畫出一條水平線<PRE>…</PRE>設置為已排版的文本,瀏覽器顯示時不再排版<IMGSRC=“…”>插入一張圖像<AHREF=“…”>…</A>定義一個超鏈接<IMGSRC=port.gifHEIGHT=100WIDTH=65>命令例子及顯示效果網站設計流程1、網站定位：確定網站主題，如教育、宣傳、個人2、搜集和準備資料。3、規(guī)劃站點結構。4、設計：創(chuàng)建本地站點、網頁（風格、鏈接等）。5、本地端測試：鏈接、瀏覽器兼容性等。6、申請空間、發(fā)布（上傳）。7、后期維護。網站制作工作流程1、主題定位2、資料搜集3、結構設計4、形象設計5、主頁設計6、其他頁面設計7、站點規(guī)劃8、定義站點9、主頁制作10、其他頁面制作11、測試12、申請域名空間13、上傳14、宣傳15、運行維護前期準備設計階段制作階段上傳發(fā)布測試階段網站制作工作流程主題定位一、網站的題材定位題材的幾點建議：1、主題最好是你最有興趣且最擅長的東西。2、主題一定要小而精。3、題材不要太濫或太高。4、體現(xiàn)自己的個性。制作網站首先要考慮網站的主題。網站的內容是最重要的因素，空洞的網站對人沒有任何吸引力。網站、網頁主題定位時要注意，網站的主題和名稱一定要清楚明了，以避免盲目建設。資料搜集

互連網的強大就是它豐富的資源，你可以在上面搜集盡可能多的資料，并根據(jù)一定規(guī)則進行整理。當然，僅僅有這些資料還不足以使你的網站與眾不同，你還要需要精心設計一搜集一些互連網上沒有的東西，也就是屬于自己的東西。資料搜集非常重要，它決定了做的網站是否有內容。就個人網站而言，針對喜歡的專題，可以到相關的網站上去瀏覽一下。

網頁制作高手不是天生就有的，他們的基本功也都是從別人那里學來的。所以咱們也應該多去學習他們，學習他們更貼切的設計。結構設計

設計網站的結構首先把網站的內容和所要實現(xiàn)的功能列舉出來，根據(jù)內容和功能列一個結構化的藍圖，要先考慮用戶如何訪問你的網站？欄目和版塊的設計網站結構設計其實也就是合理的設計網站的欄目和版塊；對各個欄目進行更細的欄目規(guī)劃。需要做的主要有設定欄目的名字、確定欄目所含頁面內容與邏輯結構等；畫出網站的結構圖。并對主要欄目用表格的形式做以文字說明；確定導航的方式；形象設計

網站的形象設計非常重要的，這就你一個人給大家留下的印象似的，是否恰當合體，是否讓人感到親切，有美感，是否讓人能夠接近。1、設計網站的標志（LOGO）2、設計網站的標準色彩3、設計網站的標準字體4、設計網站的宣傳標語形象設計包括一、設計網站的標志（LOGO）在做網站的時候要給自己的網站設計一個標志（LOGO）。就如同商標一樣，LOGO是站點特色和內涵的集中體現(xiàn)，是網站文化的濃縮，成功的網站標志讓大家一看就能聯(lián)想起你的站點。二、設計網站的標準色彩

色彩是藝術表現(xiàn)的要素之一，它是光刺激眼睛再傳導到大腦中樞而產生的一種感覺。而網站給人的第一印象來自視覺的沖擊，確定網站的標準色彩是相當重要后的步。不同的色彩拾配產生不同的效果，并可能影響到訪問者的情緒。1、色彩的表示：網頁中的顏色通常采用6位16進制的數(shù)值來表示，每兩位代表一種顏色，從左到右依次表示紅色、綠色和藍色。2、色彩給人的感覺：紅色：是一種激奮的色彩，給人以沖動、憤怒、熱情和活力的感覺。綠色：介于冷暖兩種色彩的中間，顯得和睦、寧靜、健康、安全。它和金黃，淡白搭配，可以產生優(yōu)雅，舒適的氣氛。橙色：也是一種激奮的色彩，具有輕快、歡欣、熱烈、溫馨和時尚的效果。黃色：充滿快樂、希望、智慧和輕快，它也是最亮的一種顏色。藍色：是最具涼爽、清新、專業(yè)的色彩。它和白色混合，能體現(xiàn)柔順、淡雅、浪溫的氣氛（像天空的色彩）。白色：經人以潔白、明快、純真和干凈的感覺。黑色：通常是深沉、神秘、寂靜、悲哀和壓抑的代表?；疑壕哂兄杏?、平凡、溫和、謙讓、中立和高雅的感覺，它可以和任何一種顏色進行搭配。3、網站的主色調：不同顏色以及不同顏色組合可以給人不同的感受，所以站點在配色的時候，首先應當依據(jù)站點的性質來選取站點主色調，以便讓訪問者首先在色彩的視覺效果上對站點、站點的公司或者站點所宣傳的產品有一個較深的印象。4、網頁的色彩搭配：在網頁設中，應該考慮許多方面的色彩搭配問題，如背景色、文字顏色、表格顏色、插圖顏色等等之間的相互搭配，往往一個細節(jié)也會影響整個網頁的色彩均衡。網頁的色彩搭配沒有固定的模式與步驟，但是如果從整體到細節(jié)去搭配顏色，會使這項工作更輕松一些。背景色；標題欄的顏色；導航條的顏色；文字的顏色；插圖的顏色；規(guī)劃站點要注意的事項：

1、將不同的文件分類，分別放在不同的文件夾中以便管理。首先創(chuàng)建根目錄然后再創(chuàng)建子文件夾。

2、在對文件或文件夾命名時要注意：

（1）使用英文或漢語拼音作為文件或文件夾的名字。

（2）名字中不能包括空格等非法字符。

（3）命名應有一定的規(guī)則以便日后管理。

（4）文件名應該容易理解，看了就可以知道文件的內容，由于某些操作系統(tǒng)是區(qū)分文件名大小寫，因此建議全部使用小寫文件名。

3、合理分配各種類型的文件，對于圖像、多媒體都要分存到各個文件夾中。主頁設計

像設計任何東西一樣，我們首先應在草紙上畫一個草圖，我們可以盡可能地發(fā)揮我們的想象力，想象它的一種意境。我們可以多畫幾張。然后從中選擇最佳的一個作為藍本繼續(xù)使用。其他頁面設計其他頁面設計時要注意以下幾點：1、和首面保持相同的風格；2、要有返回主頁面的鏈接；3、目錄結構不要超過四層；分欄式網站：E！娛樂在線，二分欄在網絡上十分常見（“T”結構），可依據(jù)內容形式的變化而靈活變動。表格的使用表格概念

表格是由一些線條分開的小格組成。線條即是表格的邊框，被邊框分割開來的區(qū)域成之為單元格，數(shù)據(jù)、文字、圖形、圖片等對象均可以放在相應的單元格中。位于水平方向上的一系列單元格稱作一行，位于垂直方向上的一系列單元格稱作一列。表格的作用

表格最重要的功能是幫助網頁上的元素實現(xiàn)準確的定位，以滿足網頁設計布局、排版的需要。這是在互聯(lián)網上較為常見的網頁設計方式?！癯溄邮蔷W頁中由一個地方跳轉到另一個地方、網頁、網站或文件的指針，跳轉的起點稱為源端點，跳轉的終點稱為目標端點。超鏈接指出了源端點到目標端點的路徑即地址。

●超鏈接按照源端點可分為文本鏈接、圖像鏈接、表單鏈接。按照目標端點可分為外部鏈接、內部鏈接、局部鏈接和Email鏈接。

●超鏈接的路徑有絕對路徑和相對路徑兩種，一般外部鏈接要用絕對路徑，內部鏈接和局部鏈接用相對路徑。超鏈接超鏈接應用一、本站點內1、

同一頁面不同位置間的跳轉（創(chuàng)建錨記鏈接）將光標定位在要跳轉的目標位置，“插入”/命名錨記（或常用選項卡），輸入錨記名稱（mj1）；選中文本或圖像，打開屬性面板，“鏈接”處輸入“#錨記名稱”回車確認。2、

不同頁面文件鏈接：選中文本（圖片），打開屬性面板，在鏈接和目標處設置。二、與其他站點間鏈接：輸入絕對地址三、電子郵件鏈接：選中文本/圖片，屬性面板“鏈接”輸入mailto:四、空鏈接：選中文本/圖片，屬性面板“鏈接”輸入”#”網站相冊新建空白頁面。選擇菜單：“命令”→“創(chuàng)建網站相冊”，彈出“創(chuàng)建網站相冊”對話框。在對話框中進行設置，設置完成后，單擊“確定“按鈕，系統(tǒng)自動調用Fireworks，當處理完成后，會出現(xiàn)提示對話框，單擊“確定”按鈕，在文檔窗口中將出現(xiàn)相冊頁面。插入flash動畫：“插入/媒體/flash插入/圖像對象/鼠標經過圖像插入/媒體/圖像查看器背景色

圖片標題顏色、字體、大小

邊框顏色、粗細

圖片標題

設置具體圖片

幻燈片播放

延遲時間

圖像查看器題目

過渡類型Blinds:百葉窗Fade:淡入Fly:飛入Iris:盒裝展開Photo:照片閃爍Pixeldissolve:溶解Rotate:旋轉Squeeze:切入Wipe:擦除Zoom:放大Random:隨機表單表單作用：和用戶溝通的界面，得到瀏覽者的反饋信息，把來自用戶的信息提交給服務器，是網站與瀏覽者之間的橋梁。表單與服務器端腳本程序掌握創(chuàng)建表單頁面用于收集用戶信息，表單元素的構成。創(chuàng)建表單插入表單:(1)“表單”工具欄——點擊表單按鈕

(2)[插入]菜單——表單——表單注意點：在插入表單對象之前，必須先插入表單區(qū)域，紅色虛線表示，在瀏覽器中不會顯示。表單區(qū)域就像表單對象容器。表單屬性：表單名稱

Method：信息發(fā)送方法

Get:把表單值添加給URL，并向服務器發(fā)送Get請求。

Post:在消息正文中發(fā)送表單值（常用）表單對象文本字段：用于輸入用戶名、密碼等

類型：單行、多行、密碼

字符寬度、最大字符數(shù)文本區(qū)域：即為多行文本域。一般用于輸入個人介紹、留言信息等多文本復選框：選擇愛好等多項中不定項選擇單選按鈕：多項中只能選一項單選按鈕組：與單選按鈕類似列表/菜單：下拉列表框或菜單，如省份、職業(yè)等使用層層和表格一樣都是網頁內容的容器，在層中可以放置文本、圖像、表單、對象插件。應用：利用時間軸面板為層創(chuàng)建動畫。目標：了解層的屬性設置，掌握利用時間軸為層創(chuàng)建動畫。層的基本操作創(chuàng)建層:“插入”/布局對象/層或“布局”工具欄/描繪層認識層面板選擇層：層邊框/Div#layer層標記/黃色層標記插入層對象移動層對層相關屬性的設置制作時間軸動畫是由于引入時間軸面板，它可以描述圖層和圖像隨時間變化的屬性，生成生動的動畫效果。一、曲線運動：添加層，選中層，“修改”/時間軸/錄制層路徑。為層創(chuàng)建動畫圖5-9時間軸面板行為通道動畫條時間軸下拉列表框關鍵幀動畫通道二、圖像變換源文件：圖像，屬性面板“源文件”。三、多條時間軸管理動畫：層、圖像插入層，插入圖像，拖拽層到時間軸，結束60幀。15、30、45分別增加關鍵幀，設置位置。添加時間軸2，選中圖片拖拽到時間軸，結束幀60幀，15、30、45分別增加關鍵幀，并在屬性面板中“源文件”換圖片。走馬燈效果direction表示滾動的方向，默認為從右向左：可選的值有right、down、up。滾動方向分別為：right表示→，up表示↑，down表示↓。scrollAmount。它表示速度，值越大速度越快。如果沒有它，默認為6，建議設為1～3比較好。

width和height，表示滾動區(qū)域的大小，width是寬度，height是高度。特別是在做垂直滾動的時候，一定要設height的值。<td><marqueedirection="up"height="100"scrollamount="2"onmouseout="this.start()"onmouseover="this.stop()">滾動文本

</marquee></td>行為：實現(xiàn)javascript特效1、彈出信息：2、狀態(tài)欄文本:設置文本3、打開瀏覽器窗口4、創(chuàng)建交換圖：交換圖像5、顯示彈出式菜單Css樣式頁面版式固定，方便統(tǒng)一更新。新建樣式：一、類:類型、邊框、背景二、超鏈接效果框架頁面新建空白頁面，選擇“左側”框架。光標定位在每個框架內設置網頁。選擇框架集，保存全部。在框架面板內可以選擇框架，查看屬性。模板1、創(chuàng)建頁面，文件/另存為模板。2、定義可編輯區(qū)域：選擇區(qū)域，插入/模板對象/可編輯區(qū)域,保存文件。3、應用模板：新建空白頁面，資源面板，模板，拖拽模板文件到網頁中，修改可編輯部分。網絡技術教研室付冬fd1997@126.com網頁前臺設計課程簡介

該課程主要介紹網站建設的基本方法，掌握網頁制作工具的使用方法和技巧，培養(yǎng)管理、設計網站的能力。內容安排（三大模塊）：Fireworks矢量圖形處理Flash矢量動畫Dreamweaver網頁設計課程要求課程實踐性較強，上課要認真學習，不遲到、早退。對知識要學有所悟，學有所用。課程考核：出勤+平時成績+期末上機考試缺課1/3以上取消考試資格遲到三次記一次曠課課程性質對WEB設計師的工作過程進行分解分析，確定該崗位的核心能力。將核心能力整合提升為對應的課程，構建出以工作體系為基礎的課程體系。

網站規(guī)劃網站制作網站維護與管理前導課程與后續(xù)課程計算機應用計算機網絡Photoshopcs網頁三劍客動態(tài)網頁設計企業(yè)網站設計網站的規(guī)劃能力網站風格設計能力圖片、動畫和文字的編輯能力課程能力目標對網站設計所涵蓋的崗位群進行工作任務的職業(yè)能力分析，歸納出課程能力目標：稍微涉足網絡的人一般都知道，世界著名軟件公司Macromedia的軟件產品DreamTeam三劍客，即廣大網友耳熟能詳?shù)摹熬W頁設計三劍客”——Dreamweaver網頁版式、Fireworks圖像處理、Flash矢量動畫。網頁設計工具模塊一Fireworks矢量圖形處理Fireworks8是一個完全為網頁制作者設計的圖像處理軟件。它在繪圖方面結合了位圖以及矢量圖處理的特點，不僅具備復雜的圖像處理功能，能夠自由地導入各種圖像，并且還能輕松地把圖像輸出到Flash、Dreamweaver以及第三方的應用程序。圖像基本概念1、位圖圖像：位圖，是由像素點構成的。可精確記錄色調豐富的圖像，逼真地表現(xiàn)自然界景象，且易于交換。像素點的多少將決定圖像的顯示質量和文件大小，位圖圖像的分辨率越高，其顯示越清晰，文件所占的空間也就越大。

但縮放會不清晰，產生失真。對位圖圖像進行放大時，放大的只是像素點，圖像的清晰度會降低，甚至出現(xiàn)馬賽克和鋸齒狀。無法制作真正的3D圖像，文件大，對內存和硬盤空間要求高。2、矢量圖：以數(shù)學的矢量方式記錄圖像，內容以線條和色塊為主。例如一條線段的數(shù)據(jù)只需要記錄兩個端點的坐標、線段的粗細和色彩。矢量圖的清晰度與分辨率無關，對矢量圖進行縮放時，仍保持原有的清晰度和光滑度，不會影響圖像的質量?？扇我饪s放，不會失真，可制作3D圖像。文件體積小。但不易制作色彩變化豐富的圖像，無法像照片一樣描述自然景觀。不易于交換。矢量圖與位圖的比較1.矢量圖的數(shù)據(jù)容量比位圖小。

2.矢量圖的清晰度與分辨率無關，而位圖的清晰度與分辨率密切相關。3.位圖的色彩比矢量圖豐富逼真。

1、圖像分辨率：圖像中存儲的信息量，單位是ppi(像素/英寸)。圖像分辨率和圖像尺寸的值決定文件的大小及輸出的質量。文件的大小與其圖像分辨率的平方成正比。3、分辨率：在單位長度內所含有的點（即像素）的多少。分辨率分為圖像分辨率、掃描分辨率、設備分辨率、圖像位分辨率。2、掃描分辨率：在掃描一幅圖像之前所設定的分辨率。單位是Dpi點/英寸。3、設備分辨率：輸出分辨率，指各類輸出設備每英寸上可產生的點數(shù)。如顯示器、打印機。Dpi點/英寸。4、圖像的位分辨率，又稱位深（顏色深度）。是用來衡量每個像素儲存信息的位數(shù)。這種分辨率決定圖像可以標記為多少種色彩等級的可能性。一般常見的有8位、16位、24位或32位色彩。位：2的平方次數(shù)。如8位，一幅8位色彩深度的圖像，所能表現(xiàn)的色彩等級是256級。層的概念圖層就好像是一層透明的玻璃紙，把不同的圖形對象繪制在不同的玻璃紙上，然后再將所有玻璃紙疊放在一起就形成了幅完整的圖案。

初識Flash什么是Flash

Flash是矢量圖編輯和動畫創(chuàng)作的專業(yè)軟件，設計和開發(fā)人員可使用它來創(chuàng)建演示文稿、應用程序和其他允許用戶交互的內容。在Flash中，可以通過繪制圖形、運用圖片、添加聲音、導入視頻等手段，構建包含豐富媒體的各種動畫。

Flash發(fā)展史Flash的前身是Futuresplash，flash1.0版本誕生于1996年，F(xiàn)lash真正的火爆是從3.0開始的，1996年6月發(fā)布的4.0，其制作的動畫開始大量的在網上傳播，它改變了以往靜態(tài)的網頁形式，豐富了我們的網絡生活，已經逐漸成為了網頁交互多媒體動畫設計軟件的標準。2000年推出5.0后，2002年推出FlashMX。FlashMX2004是Macromedia公司2004年推出的專業(yè)級網頁動畫制作軟件，2005年8月升級為Flash8.0。

Flash應用Flash基于矢量圖的Web標準，可以制作Web導航、互動圖片及動畫效果。1、網頁素材：廣告條、電子賀卡等支持娛樂部分。2、用于網站的開發(fā)：能夠生成HTML文件。3、開發(fā)多媒體：輸出動畫，支持導入音樂文件，支持交互內容等，可用于產品演示、Authorware課件（教學光盤）和MTV。4、支持交互腳本，可用于制作游戲、開發(fā)游戲。Flash的主要特點1、矢量圖形：采用矢量圖像圖像文件小，放大和縮小都不會影響圖像的質量，適合于卡通動畫制作。2、體積小，支持多種文件格式，大部分的位圖圖像格式和矢量圖文件格式都可以導入，還有音樂文件和視頻文件。3、采用流式的播放技術：可以邊下載邊觀看。4、動畫易于跨平臺播放，任何操作系統(tǒng)和瀏覽器支持。動畫原理電影膠片上有許多按順序串在一起的畫面。膠片上每一個畫面稱為一幀?！耙曈X停留”產生運動視覺效果。基礎動畫及制作技巧

動畫分類：逐幀動畫、補間動畫（形狀補間、運動補間）、遮罩動畫。

其中運動補間還包括實現(xiàn)旋轉和引導層動畫。逐幀動畫逐幀動畫是一幀幀地制作出來的動畫。在時間軸面板上表現(xiàn)為一個個連續(xù)的關鍵幀。逐幀動畫的種類1.圖片逐幀動畫：用導入gif文檔的方式制作的動畫。2.文字逐幀動畫：3.鼠繪逐幀動畫：用鼠標或壓感筆一幀一幀地畫成的動畫。幀的操作普通幀：用于延長前邊關鍵幀演員的顯示時間。用一個中間有方形塊表示，快捷鍵F5。經常用于背景。關鍵幀：將前邊幀中的演員復制到當前幀的舞臺中。同一演員在不同時刻定義不同狀態(tài)。用實心圈表示，快捷鍵F6?？瞻钻P鍵幀：無內容的關鍵幀用空心圓圈表示?？蓜?chuàng)建演員，或者刪除前面幀中的演員，換演員?？旖萱IF7。Flash能生成兩種類型的補間動畫，一種是動作補間動畫，另一種是形狀補間。這兩類動畫的共同特點是：創(chuàng)建動畫時只需要完成起始幀和結束幀這兩幀動畫對象的編輯，編輯相鄰兩個關鍵幀中的動畫圖像，中間幀都是由Flash在二者之間插值而自動生成創(chuàng)建的動畫。所不同的是：這兩類動畫中的動畫對象的屬性有所不同。補間動畫形狀補間動畫初識形狀補間動畫(演員是矢量圖）

形狀補間動畫，是指在一個時間點（關鍵幀）繪制一個形狀，然后在另一個時間點（關鍵幀）更改該形狀如：大小、形狀、顏色、位置等或繪制另一個形狀，再通過屬性面板在兩幀之間創(chuàng)建形狀補間動畫，從而在兩幀之間產生動畫效果。

形狀補間動畫形狀補間動畫的創(chuàng)建方法1.創(chuàng)建并編輯起始關鍵幀

2.創(chuàng)建并編輯終止關鍵幀

3.選中起始關鍵幀，在“屬性”面板創(chuàng)建補間“形狀”4.在“屬性”面板上設置形狀補間動畫的參數(shù)

注意：形狀補間動畫的生成，是Flash對相鄰兩個關鍵幀的圖像進行分析，進而自動生成的補間圖像。一般情況下，兩個關鍵幀的圖像最好是都是由線條勾畫出來的，效果最佳。如果各關鍵幀中的圖像比較復雜，則Flash所生成的補間圖像也相對復雜。如果關鍵幀中的圖像是來自導入的位圖圖像，并且差別很大，那么，F(xiàn)lash也有可能生成不了補間圖像。

動作補間動畫初識動作補間動畫(演員是元件的實例)在“時間軸”面板上的一個時間點（關鍵幀）放置一個元件，然后在另一個時間點（關鍵幀）改變這個元件的大小、顏色、位置、透明度、濾鏡參數(shù)等，即生成補間動畫的相鄰兩個關鍵幀必須是同一個對象。

Flash根據(jù)二者之間幀的值創(chuàng)建的動畫，被稱為動作補間動畫。

初識元件、實例和庫

元件、實例和庫的關系如果把元件比喻成圖章，那么庫就是存放圖章的抽屜，而實例就是用圖章在紙面上蓋下的圖案。元件和實例：演員與角色

初識元件、實例和庫

元件的類型

元件分為圖形元件、影片剪輯元件和按鈕元件三類

元件的制作、編輯和管理

元件制作的初始操作新建各類元件的初始操作，都必須先調出“創(chuàng)建新元件”對話框元件的制作、編輯和管理

圖形元件的制作1.制作圖形元件使用的對象，可以是位圖、矢量圖、組合體、文本等等2.要創(chuàng)建圖形元件，必須在“創(chuàng)建新元件”對話框的【類型】中選擇【圖形】3.圖形元件只須編輯第1幀元件的制作、編輯和管理

把圖形轉換為元件為了更容易確定對象大小和位置等原因，我們經常先在場景上畫個圖形，然后把它轉換成元件。動作補間動畫動作補間動畫的創(chuàng)建方法1.創(chuàng)建并編輯起始關鍵幀

2.在終止幀插入關鍵幀，并改變此幀中元件的位置和屬性3.選中起始關鍵幀，在“屬性”面板上創(chuàng)建補間“動畫”4.在“屬性”面板上設置動作補間動畫的參數(shù)引導線動畫引導線動畫的概念所謂引導線動畫，就是能使對象按照我們設定的曲線路徑運動的動畫。從本質來說，引導線動畫就是由路徑約束其運動軌跡的動作補間動畫。問題：自然界中更多的是曲線運動，能否制作按照指定的路徑運動的動畫？引導線動畫引導線動畫的創(chuàng)建方法1.在被引導層上創(chuàng)建起始關鍵幀，并拖出一個元件到舞臺上備用2.在被引導層上方新建一個【引導層】3.繪制引導線4.編輯被引導層的起始關鍵幀和終止關鍵幀5.選中被引導層的起始幀，在“屬性”面板上創(chuàng)建補間“動畫”創(chuàng)建補間動畫。6.設置屬性參數(shù)

遮罩動畫遮罩動畫的概念遮罩動畫，就是實現(xiàn)了遮罩效果的動畫。

遮罩動畫，至少應該具有兩個圖層，即“遮罩層”和“被遮罩層”。遮罩就像個透明的窗口(遮罩的填充色塊本身是不可見的)，只有從那里(遮罩層的填充色塊之下)才可以看到被遮罩層上的內容。創(chuàng)建基本交互動畫Flash還可以制作具有交互式效果的動畫，可以響應用戶的各種操作事件。所謂交互動畫是指瀏覽者可以使用鍵盤、鼠標操作來控制動畫的播放和停止，改變動畫的顯示效果和尺寸及執(zhí)行其他的各種操作。交互動畫是通過動作腳本語言（ActionScript）設置動作來產生的，ActionScript是Flash中內嵌的腳本程序。Flash提供了一個專門處理動作腳本的編輯環(huán)境——“動作”面板。動作腳本基礎知識

什么是動作腳本所謂腳本，是指一組指令或命令，供應用程序或操作系統(tǒng)在特定的時間調用，以執(zhí)行一段指定的過程。動作腳本是Flash的腳本語言。它的英文字面為“ActionScript”，是“Action”（動作）和“Script”（腳本）的組合。動作腳本的英文縮寫為“AS”。創(chuàng)建基本交互動畫動作的三要素：1、動作：實現(xiàn)一個結果給用戶2、事件：一個動作產生的時機(什么時候）3、作用動作的對象事件的分類：1、對象事件：具體對象2、時間事件：影片播放的時間作用動作的對象：1、按鈕實例、影片剪輯實例2、幀：關鍵幀、空白關鍵幀（幾秒）

通常，把應用于關鍵幀上的動作腳本稱為幀動作，把應用于按鈕上的動作腳本稱為按鈕動作，把應用于影片剪輯上的動作腳本稱為影片剪輯動作。為幀添加動作的方法1.選中要添加動作腳本的關鍵幀或空白關鍵幀2.按下快捷鍵【F9】打開“動作”面板3.在“動作”面板上添加動作腳本停止、播放和跳轉語句

1.play命令時間軸上的播放頭從當前幀開始播放。2.stop命令時間軸上的播放頭停止在當前幀上。3.gotoAndPlay命令時間軸上的播放頭跳至特定的幀上，并從該幀開始播放。4.gotoAndStop命令時間軸上的播放頭跳至

溫馨提示

  • 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯(lián)系上傳者。文件的所有權益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網頁內容里面會有圖紙預覽，若沒有圖紙預覽就沒有圖紙。
  • 4. 未經權益所有人同意不得將文件中的內容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網僅提供信息存儲空間，僅對用戶上傳內容的表現(xiàn)方式做保護處理，對用戶上傳分享的文檔內容本身不做任何修改或編輯，并不能對任何下載內容負責。
  • 6. 下載文件中如有侵權或不適當內容，請與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論