使用Dreamweaver制作網(wǎng)站

網(wǎng)站維護(hù)與網(wǎng)頁制作主講：康梅娟第2講使用Dreamweaver制作網(wǎng)站2.1Dreamweaver基礎(chǔ)操作2.2模板、多媒體元素和書簽超鏈接的使用2.3圖像熱區(qū)、CSS樣式的應(yīng)用2.4圖層的使用2.5創(chuàng)建時間軸動畫2.6表單的應(yīng)用2.7框架的應(yīng)用2.8使用行為講解提綱大任務(wù)制作“空谷幽蘭”的網(wǎng)站的靜態(tài)部分，包括扉頁、首頁、照片、音樂、視頻、動畫、文章、粉絲、北京粉絲、西安粉絲和濟(jì)南粉絲共11個靜態(tài)頁面。站點的創(chuàng)建和管理網(wǎng)頁的創(chuàng)建和編輯使用表格布局網(wǎng)頁在網(wǎng)頁中插入文本、圖像和影片超鏈接的使用2.1Dreamweaver基礎(chǔ)操作任務(wù)1制作“扉頁”和“首頁”一、站點的創(chuàng)建和管理１．創(chuàng)建站點1.創(chuàng)建站點-續(xù)注意:（1）可以創(chuàng)建多個站點（2）打開某個站點的方法“站點”|“管理站點”，選擇站點，單擊“完成”“文件”面板中的站點下拉列表（3）同一個站點只需創(chuàng)建1次，以后編輯時只需打開編輯即可（裝了還原卡的機子除外）2.站點的管理（1）新建文件（2）新建文件夾2.站點的管理-續(xù)（3）文件夾和文件的移動、復(fù)制、刪除或重命名（4）打開文件：雙擊文件名二、網(wǎng)頁的創(chuàng)建和編輯1.網(wǎng)頁的創(chuàng)建在“文件”面板的站點中創(chuàng)建從啟動頁面創(chuàng)建文件|新建2.網(wǎng)頁的編輯（1）打開網(wǎng)頁：文件|打開或者在“文件”面板中雙擊要編輯的文件名稱。（2）保存網(wǎng)頁：文件|保存；文件|另存為。（3）預(yù)覽網(wǎng)頁：按“F12”鍵；文件|在瀏覽器中預(yù)覽|iexpore；單擊“文檔”工具欄的【在瀏覽器中預(yù)覽/調(diào)試】按鈕，并在彈出的下拉菜單中選擇【預(yù)覽在iexpore】命令。2.網(wǎng)頁的編輯-續(xù)（4）設(shè)置網(wǎng)頁標(biāo)題（5）設(shè)置“上邊距”為0：修改|頁面屬性（6）添加/刪除字體：選擇“字體”下拉列表的最后一項“編輯字體列表…”，打開“編輯字體列表”對話框。三、使用表格布局網(wǎng)頁在設(shè)計網(wǎng)頁中，表格不僅可以羅列數(shù)據(jù)，更重要的是可以用來控制網(wǎng)頁的布局。通常，新建網(wǎng)頁后，要先在網(wǎng)頁中插入表格，再將其它網(wǎng)頁元素插入到表格的單元格中。網(wǎng)頁布局的３種解決方案：表格、框架、圖層。1.表格的3種視圖(1)標(biāo)準(zhǔn)視圖：設(shè)計規(guī)律、簡單表格(2)擴(kuò)展視圖：定位元素、放光標(biāo)(3)布局視圖：設(shè)計復(fù)雜、無規(guī)律表格2.創(chuàng)建表格（1）插入表格（2種方法）單擊“插入”|“表格”命令單擊“常用”面板中的“表格”按鈕（2）表格屬性面板填充：指定單元格的內(nèi)容和單元格邊框間的距離，單位是像素。間距：相鄰單元格間的距離，單位是像素。（2）表格屬性面板-續(xù)

清除表格的列寬將表格寬度轉(zhuǎn)換成像素將表格寬度轉(zhuǎn)換成百分比清除表格的行高將表格高度轉(zhuǎn)換成像素將表格高度轉(zhuǎn)換成百分比（3）為表格輸入數(shù)據(jù)在表格的單元格中，可以插入文本、圖片、超鏈接、表單、動態(tài)組件等元素，也可以插入嵌套表格。3.編輯表格（1）選中整張表格方法1:使用<table>標(biāo)記方法2:單擊表格任意位置，按兩次Ctrl+A方法3：單擊表格左上角（2）選中表格行方法1：拖動鼠標(biāo)從左至右方法2：把鼠標(biāo)移至要選定的行的行首，鼠標(biāo)會變成粗黑箭頭，單擊左鍵，選定行方法3：使用<tr>標(biāo)記（3）選中表格列方法1：拖動鼠標(biāo)從上至下方法2：把鼠標(biāo)移至要選定的列的列首，鼠標(biāo)會變成粗黑箭頭，單擊左鍵，選定列（4）選中單元格方法1：單擊某個單元格方法2：使用<td>標(biāo)記（5）添加行或列修改|表格|插入行修改|表格|插入列修改|表格|插入行或列（6）刪除行或列修改|表格|刪除行修改|表格|刪除列（7）合并單元格方法1：修改|表格|合并單元格方法2：屬性面板上的“合并單元格”按鈕（8）拆分單元格方法1：修改|表格|拆分單元格方法2：屬性面板上的“拆分單元格”按鈕小結(jié)表格的應(yīng)用技巧：外圍表格寬度：780像素內(nèi)嵌表格寬度：百分比每一個版塊都用一個單獨的表格靈活運用嵌套表格四、在網(wǎng)頁中插入文本、圖像和影片1.插入文本（1）插入特殊字符：插入|HTML|特殊字符（2）插入日期：插入|日期（3）插入水平線：插入|HTML|水平線（4）空格符的鍵入：切換到全角中文進(jìn)行輸入（5）換行符：shift+Enter（6）段落標(biāo)識符：Enter（7）文本的屬性面板2.插入圖像（1）插入圖像：插入|圖像或單擊“常用”子面板上的【圖像】按鈕（2）設(shè)置圖像屬性3.插入滾動字幕（1）選中滾動字幕內(nèi)容（2）單擊“插入”|“標(biāo)簽”（3）選擇“html標(biāo)簽”中的marquee，單擊“插入”，單擊“關(guān)閉”（4）選中marquee標(biāo)簽，在“標(biāo)簽檢查器”面板的“屬性”選項卡中設(shè)置屬性Behavior:設(shè)置字幕運動方式Direction:設(shè)置字幕滾動方向Scrollamount:設(shè)置字幕滾動速度3.插入滾動字幕-續(xù)Scrolldelay:設(shè)置字幕滾動時停頓的時間，單位為毫秒。如果要讓滾動看起來流暢，數(shù)值應(yīng)該盡量小。Loop:設(shè)置字幕滾動次數(shù)，默認(rèn)值為無限，“-1”也為無限。打開行為面板，添加兩個行為：onMouseOver:this.stop()設(shè)置鼠標(biāo)移動到滾動字幕時的動作為停止?jié)L動。onMouseOut：this.start()設(shè)置鼠標(biāo)離開滾動字幕時的動作為開始滾動。4.插入Flash影片方法1：插入|媒體|Flash方法2：常用面板|“媒體”按鈕插入透明Flash五.超鏈接的使用1.超鏈接的概念超鏈接是指從起始端點到目標(biāo)端點的一個跳轉(zhuǎn)。超鏈接的鏈接目標(biāo)可以是1個網(wǎng)頁、1張圖片、1首歌曲、1個office文檔、1個程序等；超鏈接的鏈接目標(biāo)可以是本機上的1個任意的文件，也可以是其它服務(wù)器上的1個URL，或者是某個網(wǎng)頁中的具體位置。2.超鏈接路徑（1）絕對路徑使用完整URL,如：http://（2）相對路徑鏈接的文件相對于當(dāng)前網(wǎng)頁的路徑。注意：鏈接站點內(nèi)部的文件最好采用相對路徑。3.創(chuàng)建超鏈接（1）創(chuàng)建頁面鏈接（2）創(chuàng)建電子郵件鏈接（1）創(chuàng)建頁面鏈接選中文本或圖像，在其屬性面板的“鏈接”后設(shè)置。打開目標(biāo)網(wǎng)頁的方式_blank：在新的瀏覽器窗口中打開_parent：在父框架或上級窗口中打開_self：在同一框架或本窗口中打開_top：在頂層框架中打開（2）創(chuàng)建Email鏈接選中載體；插入|電子郵件鏈接，或在屬性面板的“鏈接”后輸入：mailto:電子郵箱地址模板的使用在網(wǎng)頁中插入音頻、視頻在網(wǎng)頁中插入圖像查看器書簽超鏈接的使用2.2模板、多媒體元素和書簽超鏈接的使用任務(wù)2制作照片、音樂、視頻、動畫、文章頁面。一、模板的使用什么是模板？為什么要使用模板？如何使用模板？使用模板舉例小結(jié)一、模板的使用什么是模板？模板是一種特殊類型的文檔，用于設(shè)計“固定的”頁面布局；然后用戶便可以基于模板創(chuàng)建文檔，創(chuàng)建的文檔會繼承模板的頁面布局。設(shè)計模板時，可以指定在基于模板的文檔中哪些內(nèi)容是用戶“可編輯的”。一、模板的使用為什么要使用模板？減少重復(fù)勞動使相關(guān)的網(wǎng)站頁面風(fēng)格保持一致創(chuàng)建1次可套用多次可以一次更新多個頁面

一、模板的使用如何使用模板？使用模板的前提：首先要將網(wǎng)站作為Dreamweaver管理的一個站點。使用模板的思路：通常制作模板文件時，只把導(dǎo)航條和標(biāo)題欄等各個頁面共有的部分制作出來，而把其他部分留給各個頁面安排設(shè)置具體內(nèi)容。制作模板文件與制作普通的網(wǎng)頁的方法是相同的，但是在制作模板文件時，必須設(shè)置好“頁面屬性”，指定好“可編輯區(qū)域”。使用模板的步驟（1）編輯將要作為模板的頁面。（2）生成模板：文件|另存為模板，將（1）保存為模板頁，注意選擇站點和設(shè)置模板文件名。（3）編輯模板：打開模板頁，插入|模板對象|可編輯區(qū)域，可編輯區(qū)域可有多個。（4）用模板生成頁面：文件|新建，選擇“模板”中的（2）保存的模板頁。編輯可編輯區(qū)域。（5）修改模板內(nèi)容與更新站點文件。4.使用模板舉例（1）制作照片模板photo.dwt(2)套用photo.dwt制作“照片”頁面小結(jié)使用模板的好處使用模板的前提使用模板的思路使用模板的步驟二、插入音頻、視頻

方法：插入|媒體|插件切換到代碼視圖，設(shè)置相關(guān)屬性。

autostart=“true”，自動播放Loop=“true”,循環(huán)播放三.插入圖像查看器（1）準(zhǔn)備好用到的圖片（尺寸相同）（2）插入|媒體|圖像查看器（3）為生成的flash文件設(shè)置保存路徑和名稱（4）在Flash元素面板中設(shè)置相關(guān)參數(shù)bgColor:背景顏色。captionColor:圖片的標(biāo)題顏色。captionFont:圖片的標(biāo)題字體。captionSize:圖片的標(biāo)題字體大小。frameColor:邊框顏色。frameShow:是否顯示邊框。frameThickness:邊框?qū)挾取mageCaption:圖片標(biāo)題。三.插入圖像查看器-續(xù)imageLinks:為每張圖片設(shè)置鏈接。imageLinkTarget:設(shè)置打開鏈接網(wǎng)頁的方式。imageURLs：選擇圖片源文件。showControls:是否顯示控制臺slideAutoPlay:是否自動播放slideDelay:圖片播放的延遲時間。slideLoop:是否循環(huán)播放。title：圖像查看器的標(biāo)題。titleColor:標(biāo)題顏色。titleFont:標(biāo)題字體titleSize:標(biāo)題字體大小。transitionType:圖片切換的模式。四、書簽超鏈接的使用先定義書簽：光標(biāo)定位在跳轉(zhuǎn)的目標(biāo)位置前；插入|命名錨記創(chuàng)建超鏈接指向書簽：文件名#書簽名稱如果是當(dāng)前網(wǎng)頁，文件名可省略。圖像熱區(qū)的使用CSS樣式的使用2.3圖像熱區(qū)、CSS樣式的應(yīng)用任務(wù)3制作粉絲、北京粉絲、西安粉絲和濟(jì)南粉絲頁面；使用CSS樣式格式化所有靜態(tài)頁面。一、圖像熱區(qū)的使用圖像熱區(qū)是在一幅圖像中劃分出幾個不同的幾何圖形區(qū)域，然后分別為這些區(qū)域建立超鏈接。創(chuàng)建圖像熱區(qū)的步驟：插入圖像并選中；在屬性面板上選擇熱區(qū)工具并在圖像上繪制熱區(qū)選定熱區(qū)，在屬性面板中設(shè)置鏈接目標(biāo)二、CSS樣式的使用CSS樣式的概念CSS樣式的三種存在方式直接插入式內(nèi)嵌樣式CSS樣式的類型CSS樣式定義外部文件方式小結(jié)二、CSS樣式的使用1.CSS樣式的概念

CSS，翻譯為“層疊樣式表”，主要用來進(jìn)行頁面風(fēng)格設(shè)計。利用CSS不僅可以控制一個頁面中的元素格式，而且可以控制多個頁面中的元素格式。2.CSS樣式的三種存在方式根據(jù)作用范圍不同，CSS樣式有三種存在方式：（1）直接插入式（2）內(nèi)嵌樣式（3）外部文件方式3.直接插入式作用：僅對所定義的標(biāo)記起作用。用法：代碼視圖下，在標(biāo)記中插入style屬性。格式：<標(biāo)記style="屬性:屬性值;屬性:屬性值;…">如：<hrstyle="color:#FF0000;height:10px"/>注意：basefont、param、script不能使用style屬性。觀看示例4.內(nèi)嵌樣式（1）用法：定義在<head>和</head>之間，其范圍僅限于本網(wǎng)頁。（2）格式：<styletype=“text/css”><!--選擇符1{屬性:屬性值;屬性:屬性值…}選擇符2{屬性:屬性值;屬性:屬性值…}…選擇符n{屬性:屬性值;屬性:屬性值…}--></style>觀看示例:未格式觀看示例：套用格式后（3）使用內(nèi)嵌樣式的方法寫代碼：先在<head>和</head>之間添加style代碼，然后在具體的標(biāo)記中應(yīng)用樣式。使用CSS樣式面板(需掌握)。*1.窗口|css樣式*2.新建css規(guī)則*3.設(shè)置樣式類型，定義在“僅對該文檔”*4.設(shè)置規(guī)則*5.選中元素，套用樣式（在屬性面板的“樣式”或“類”下拉列表中選擇樣式名稱或在css樣式面板中右擊相應(yīng)的樣式名稱選擇“套用”。）（4）使用內(nèi)嵌樣式舉例舉例.xiaobiaoti（類）

、p（標(biāo)簽）.xiaobiaoti:宋體、18px、粗體、#4E6735、文本對齊（居中）、空格保留，定義在當(dāng)前文檔。p：宋體、14px、行高20px、黑色、左對齊、文字縮進(jìn)28px，定義在當(dāng)前文檔。5.CSS樣式的類型（1）類：根據(jù)用戶的需要創(chuàng)建一個CSS樣式屬性，可應(yīng)用到文字，圖片等網(wǎng)頁元素中；樣式的名稱必須以“”開頭。先定義后套用。（2）標(biāo)簽：重定義HTML標(biāo)記的默認(rèn)格式。只需定義，使用到該標(biāo)記時會自動套用格式。（3）高級：為某個標(biāo)記組合定義樣式，可用于定義超鏈接的4種狀態(tài)的樣式。只需定義，使用到該標(biāo)記時會自動套用格式。CSS樣式舉例

.image（類）:方框?qū)?0px，高150px高級:A:link

（文本超鏈接）：宋體、16px、黑色、無修飾A:active

（激活超鏈接）:宋體、16px、#FF0000、刪除線A:hover

（鼠標(biāo)懸停在超鏈接）：華文行楷、16px、#4A37AB、下劃線A:visited

（訪問過的超鏈接）：宋體、16px、黑色、無修飾

6.CSS樣式定義（1）類型：設(shè)置文本或段落的樣式（2）背景：設(shè)置元素的背景色或背景圖像（3）區(qū)塊：設(shè)置元素的對齊方式、放置位置（4）方框：控制元素在頁面上的放置方式，如圖片、表格的大小，表格的填充，頁面的邊界等。（5）邊框：定義元素周圍的邊框的設(shè)置（如表格的邊框的寬度、顏色和樣式）。

6.CSS樣式定義-續(xù)（6）列表：設(shè)置列表（如項目符號列表、編號列表）的樣式（7）定位：定義層的默認(rèn)顯示樣式。（8）擴(kuò)展：包括過濾器、分頁和光標(biāo)選項。對樣式所控制的對象應(yīng)用特殊效果可提供分頁設(shè)置改變指針圖像7.外部文件方式（1）作用：可在每個網(wǎng)頁中引用，可使整個網(wǎng)站的網(wǎng)頁在風(fēng)格上保持一致。（2）用法：將css寫成一個文件的方式，在網(wǎng)頁頭部引用該文件。注意：樣式表文件的擴(kuò)展名為.css。應(yīng)用格式前應(yīng)用格式后（3）使用外部文件方式的方法（需掌握）*1.新建css規(guī)則時，定義在“新建樣式表文件”或已有的樣式表文件*2.打開需應(yīng)用樣式的網(wǎng)頁，單擊“附加樣式表”按鈕*3.選擇樣式表文件*4.鏈接或?qū)?5.“類”樣式需手工套用，“標(biāo)簽”和“高級”自動套用（4）使用外部文件方式舉例.dabiaoti：宋體、36px、粗體、黑色、垂直居中、水平居中，定義在style.css中。body：在“背景”中設(shè)置背景圖像，在“方框”中設(shè)置“上邊界”為0，定義在style.css中。小結(jié)統(tǒng)一整個站點風(fēng)格，用外部文件樣式；統(tǒng)一某個網(wǎng)頁風(fēng)格，用內(nèi)嵌樣式；調(diào)整網(wǎng)頁內(nèi)部某個標(biāo)記時，用直接插入式。三種樣式可在同一網(wǎng)頁中同時使用，如果其設(shè)置的樣式發(fā)生沖突，則按優(yōu)先級起作用。優(yōu)先級別：直接插入式>內(nèi)嵌樣式>外部文件方式2.4圖層的使用圖層可用于網(wǎng)頁布局圖層可放在網(wǎng)頁中的任意位置圖層中可以插入任意元素圖層可以移動、重疊、顯示或隱藏使用圖層，可以制作出三維效果圖層和時間軸配合，可以制作動畫圖層應(yīng)用實例-三維效果觀看頁面1創(chuàng)建層插入層：“插入”|“布局對象”|“層”繪制層：“布局”面板|“描繪層”按鈕單擊“描繪層”按鈕后，按下【Ctrl】鍵不放，可連續(xù)繪制多個層。2.層重疊

在層控制面板上將“防止重疊”選項取消選中，可創(chuàng)建重疊的層。否則，將無法創(chuàng)建重疊的層。層的最大優(yōu)勢之一就是可以重疊，層的重疊次序是用“z軸”來表示。“z軸”上的值可正可負(fù)，也可為0，數(shù)值大的層在上面。

3.層嵌套

先在文檔中插入一個層。將光標(biāo)置于該層內(nèi)，然后“插入”|“布局對象”|“層”4選擇層單擊層的激活標(biāo)志。單擊【窗口】|【層】命令，打開“層”面板，在“層”面板中單擊層的名稱，這種方法也適用于選擇隱藏的層。

單擊層邊界，按住【Shift】可以同時選定多個層。在層面板中單擊層的名稱，按住【Shift】可以同時選定多個層。5插入層對象當(dāng)光標(biāo)移入層內(nèi)時，可以插入網(wǎng)頁元素，如文本、圖像、層、表單、表格等。在層中插入網(wǎng)頁元素的方法與在編輯窗口中插入方法一樣。6移動層選定層，按住鼠標(biāo)左鍵不放拖動。選定層，按鍵盤上的四個方向鍵，每按一次，移動1個像素，如果同時按住【Shift】鍵，每次可移動10個像素的距離。

7對齊層層的對齊方式包括左對齊、右對齊、頂端對齊和底部對齊。執(zhí)行對齊方式后，各層將以最后一個選定的層為基準(zhǔn)對齊。先按住“Shift”鍵的同時用鼠標(biāo)選擇層，然后單擊菜單【修改】|【對齊】中相應(yīng)的對齊方式或按“Ctrl+相應(yīng)的方向”鍵。8設(shè)置層屬性單個層的屬性

“層編號”：層的名稱，具有唯一性。“左”和“上”：層相對于頁面或父層的左上角相對位置。“寬”和“高”：層的寬度和高度，如果層中內(nèi)容超過指定大小，這些值被忽略?！癦軸”：層的重疊順序。編號大的層出現(xiàn)在編號小的層上面。單個層的屬性“可見性”：層的初始顯示狀態(tài)，包括顯示Defaule（默認(rèn)）、繼承Inherit、可見Visible、隱藏Hidden四種。“背景圖像”：指定背景圖像?！氨尘邦伾保褐付ū尘邦伾?。

多個層的屬性當(dāng)選中多個層時，層屬性面板將顯示文本屬性和普通層屬性的子集，它可以允許一次修改多個層。

9層的應(yīng)用在網(wǎng)頁設(shè)計中，層能方便地定位頁面元素、顯示或隱藏網(wǎng)頁中的一些內(nèi)容。層除了象表格一樣可以設(shè)定背景、設(shè)定位置、自由移動、控制顯示外，還可以輕松建立三維效果，我們可以使網(wǎng)頁中的對象在垂直方向互相重疊，再配合時間軸的應(yīng)用做出既美觀又具有動感效果的網(wǎng)頁。

圖層的應(yīng)用-背景音樂插入1個圖層在圖層中插入插件（插入|媒體|插件）設(shè)置插件能夠自動播放設(shè)置圖層的可見性為hidden補充：插入flash按鈕在插入之前，必須先保存網(wǎng)頁插入|媒體|Flash按鈕插入后會自動生成一個.swf文件另存為：設(shè)置生成的swf文件存放路徑，如：flash\enter.swf，注意“\”的方向注意：flash按鈕的存放路徑（在磁盤上的完整路徑）中不允許有中文目錄名。補充：插入flash按鈕選中flash按鈕，單擊屬性面板上的“播放”，可觀看效果；如要更改設(shè)置，如更改按鈕的樣式，可單擊屬性面板上的“編輯”按鈕。2.5創(chuàng)建時間軸動畫時間軸是一種用來控制網(wǎng)頁中的層在每一秒的位置的工具。它通過在不同的時間改變層的位置、大小、可見性或疊放順序等來創(chuàng)建動畫。用時間軸做動畫可以滿頁飛,依賴時間軸設(shè)計的動畫是建立在圖層基礎(chǔ)上的。

1時間軸控制面板Dreamweaver提供時間軸面板，用來設(shè)置和控制時間軸動畫。要打開和關(guān)閉時間軸面板，按“Alt+F9”鍵或單擊菜單【窗口】|【時間軸】命令。

2創(chuàng)建時間軸動畫直線運動動畫簡單曲線運動動畫復(fù)雜曲線運動動畫使用時間軸改變圖像屬性使用時間軸改變圖層屬性直線運動動畫插入1個圖層，在圖層中放置元素（輸入文本或插入圖像等）ALT+F9，打開時間軸面板選中圖層，按住鼠標(biāo)左鍵不放，將其拖動到時間軸的某一條動畫通道中；或右擊，在彈出菜單中選擇“添加到時間軸”分別在起始關(guān)鍵幀、結(jié)束關(guān)鍵幀處將圖層拖動到所需的位置選擇“自動播放”和“循環(huán)”簡單曲線運動動畫先完成直線運動動畫的制作（參照上頁）在起始關(guān)鍵幀和結(jié)束關(guān)鍵幀之間選擇1幀，如第8幀，右擊，選擇“增加關(guān)鍵幀”，然后在該幀處將圖層拖動到所需位置。如需要，可重復(fù)第步。復(fù)雜曲線運動動畫-記錄路徑插入1個圖層，在圖層中放置元素（輸入文本或插入圖像等）ALT+F9，打開時間軸面板選中圖層，單擊“修改”|“時間軸”|“錄制層路徑”，將鼠標(biāo)指針移到圖層左上角的標(biāo)志處，變成“+”后，按住左鍵不放并拖動繪制1條封閉曲線（運動軌跡）。選擇“自動播放”和“循環(huán)”使用時間軸改變圖像屬性插入圖像1，如aoyun1.jpgALT+F9，打開時間軸面板選中圖像，按住鼠標(biāo)左鍵不放，將其拖動到時間軸的某一條動畫通道中用鼠標(biāo)拖動動畫條右端的結(jié)束關(guān)鍵幀標(biāo)記，將第15幀拖動到第45幀在第15、30幀處分別右擊，選擇“增加關(guān)鍵幀”使用時間軸改變圖像屬性在第15幀處，選中圖像，單擊其屬性面板中“源文件”文本框右邊的“瀏覽”按鈕，更換1張圖像，如aoyun2.jpg在第30幀處，將圖像的源文件更換為aoyun3.jpg，操作步驟同第步。選擇“自動播放”和“循環(huán)”。注意：該動畫不需要用圖層。使用時間軸改變圖層屬性插入圖層，為圖層設(shè)置背景圖像，如fj.jpg，將圖層的寬度設(shè)置為1像素，高度設(shè)置為背景圖像的高度ALT+F9，打開時間軸面板選中圖層，按住鼠標(biāo)左鍵不放，將其拖動到時間軸的某一條動畫通道中；或右擊，在彈出菜單中選擇“添加到時間軸”在結(jié)束關(guān)鍵幀處將圖層寬度調(diào)整為背景圖像的寬度選擇“自動播放”和“循環(huán)”練習(xí)鳥群的變化繞復(fù)雜曲線運動的變換圖像動畫2.6表單的應(yīng)用認(rèn)識表單創(chuàng)建表單網(wǎng)頁的步驟添加表單對象檢查表單表單標(biāo)簽引言表單的作用是獲取web站點訪問者的信息，實現(xiàn)用戶和服務(wù)器之間的交互。搜集用戶的個人資料信息、訂單信息等，都要用表單來搜集，然后將搜集到的信息提交給服務(wù)器來處理。一.認(rèn)識表單表單是由文本和表單控件組成的，用戶在表單中鍵入或選擇相關(guān)的信息，單擊“提交”按鈕將信息傳給服務(wù)器，由服務(wù)器處理收集到的信息，并將信息保存到特定文件中。一個完整的表單包含表單對象和表單處理程序兩部分。表單對象用來收集用戶信息，表單處理程序負(fù)責(zé)向服務(wù)器提交表單。只有將表單與某個表單處理程序關(guān)聯(lián)之后，才能實現(xiàn)該表單功能。一個網(wǎng)頁中可以有多個表單，但一個表單中不能再嵌入表單。二.創(chuàng)建表單網(wǎng)頁的步驟(1)插入表單(2)在表單中插入表格(3)在表格中插入說明性文字和表單域三.添加表單對象插入表單的2種方法：插入|表單|“相應(yīng)的表單對象”命令單擊表單面板上的相應(yīng)按鈕表單的屬性面板動作：指定表單處理程序所在的文件，可以是一個網(wǎng)址，也可以使用以mailto:為前綴的郵件地址，將表單數(shù)據(jù)發(fā)到指定的郵箱。方法：表單數(shù)據(jù)傳輸?shù)椒?wù)器的方法。post：傳遞大量數(shù)據(jù)、安全性高Get:傳遞少許數(shù)據(jù)，安全性低2.添加文本域（1）文本域的類型：單行文本域：輸入短數(shù)據(jù)多行文本域：輸入較長文本密碼域：輸入密碼（2）文本域的屬性面板字符寬度：允許顯示的字符數(shù)最多字符數(shù)：允許輸入的字符數(shù)初始值：默認(rèn)的顯示文字3.添加單選按鈕組Label:選項內(nèi)容布局：按鈕組的外觀風(fēng)格。表格，表格式的單列表；換行符，沒有表格線的單列表。4.添加復(fù)選框復(fù)選框的屬性面板初始狀態(tài)：初始選中狀態(tài)選定值：選中復(fù)選框后控件代表的值5.添加按鈕“按鈕”屬性面板標(biāo)簽：按鈕上的顯示文字動作：提交表單，用來提交表單數(shù)據(jù)；重設(shè)表單，用來取消表單輸入內(nèi)容，重新輸入；無，根據(jù)處理腳本執(zhí)行相應(yīng)操作。6.添加列表框類型：設(shè)置列表框外觀。菜單，顯示為下拉列表框；列表，顯示為帶滾動條的平鋪列表框。列表值：設(shè)置列表項目。初始化時選定：設(shè)置列表框中初始值允許多選7.添加文件域使用文件域時要求將表單的方法設(shè)置為post。四、檢查表單可以為表單或文本域添加行為，用來檢查指定文本域的內(nèi)容是否符合規(guī)定，以確保用戶輸入的正確性。五、表單標(biāo)簽<form>表單內(nèi)容</form>小結(jié)表單的概念表單的作用創(chuàng)建表單網(wǎng)頁的步驟表單的插入和屬性設(shè)置常用表單域的插入和屬性設(shè)置2.7用框架布局頁面框架也是一種設(shè)計網(wǎng)頁布局的技術(shù)?？蚣軐⒁粋€瀏覽器窗口劃分為多個區(qū)域，每個區(qū)域顯示不同的網(wǎng)頁內(nèi)容。一組框架構(gòu)成的網(wǎng)頁被稱為一個框架集?？蚣芗且粋€網(wǎng)頁，用來存儲頁面的框架結(jié)構(gòu)，包括框架的大小和位置信息等?？砂阉醋魇侨萜鳌Ｆ渲?，每一個框架都對應(yīng)一個頁面文件。在框架集中，一般情況下，可以用其中的一個框架來保持網(wǎng)頁中固定的內(nèi)容，如網(wǎng)頁大標(biāo)題、導(dǎo)航菜單等，用一個框架來展現(xiàn)所選擇的網(wǎng)頁內(nèi)容。1.創(chuàng)建框架和框架集插入預(yù)定義框架集在“布局”面板上單擊“框架”按鈕，在下拉菜單中選一個框架集樣式。1.創(chuàng)建框架和框架集用戶自己設(shè)計框架集上下拖框架集的邊框左右拖框架集的邊框拖動框架集的邊框角修改|框架集2.選定框架和框架集用鼠標(biāo)選中框架或框架集按下Alt鍵，單擊欲選中的框架的任意位置利用框架面板選中單擊框架內(nèi)的任意位置，可選定框架單擊框架面板四周的邊框，可選定框架集3.設(shè)置框架邊框的顯示和隱藏查看|可視化助理|框架邊框4.刪除框架和框架集刪除框架，將該框架邊框拖到父框架的邊框上或拖離頁面刪除框架集，要么不保存，要么刪除該框架集文件。5.框架和框架集屬性面板（1）“框架集”屬性面板邊框邊框?qū)挾冗吙蝾伾岛蛦挝?.框架和框架集屬性面板（2）“框架”屬性面板框架名稱源文件邊框和邊框顏色滾動不能調(diào)整大小邊界寬度和邊界高度6.保存框架和框架集一個包含n個框架的框架頁所包含的網(wǎng)頁個數(shù)為n+1。在保存時，需要將其保存成n+1個不同的文件。命名框架中的各個網(wǎng)頁時，要做到見名知意。6.保存框架和框架集（1）保存框架集文件|保存框架頁如果框架集文件是主頁，需保存為index.htm（2）保存框架文件|保存全部7.在框架中插入文本、圖像和表格直接在每個框架中插入直接編輯某框架對應(yīng)的頁面文件2.8使用行為行為，是將JavaScript代碼放置在文檔中，使訪問者能夠與網(wǎng)頁進(jìn)行交互，從而以多種方式更改頁面或執(zhí)行某些任務(wù)。行為由事件和該事件觸發(fā)的動作兩部分組成。事件指示網(wǎng)頁的訪問者執(zhí)行了某種操作，