HTML和中文DreamweaverMX2004實用教程第5章

1、 本章要點本章要點l5.1 重做重做“卡通青蛙卡通青蛙”網(wǎng)頁網(wǎng)頁 l5.2 再做再做“俏皮歇后語俏皮歇后語”網(wǎng)頁網(wǎng)頁 l5.3 “霸道的文字霸道的文字”網(wǎng)頁網(wǎng)頁 l5.4 再做再做“心情隨筆心情隨筆”網(wǎng)頁網(wǎng)頁 l5.5 “射門射門”網(wǎng)頁網(wǎng)頁 l5.6 再做再做“射門射門”網(wǎng)頁網(wǎng)頁 l5.7 “風(fēng)景幻燈風(fēng)景幻燈”網(wǎng)頁網(wǎng)頁l5.8 “浮動圖像浮動圖像”網(wǎng)頁網(wǎng)頁 l習(xí)題習(xí)題 5在在Dreamweaver中重做后的中重做后的“卡通青蛙卡通青蛙”網(wǎng)頁如圖網(wǎng)頁如圖5-1-1所示?？梢钥闯?，所示?？梢钥闯觯摼W(wǎng)頁和第該網(wǎng)頁和第1章中的章中的“卡通青蛙卡通青蛙”網(wǎng)頁基本相同，在網(wǎng)頁中包含幾個大小不網(wǎng)頁基本相同

2、，在網(wǎng)頁中包含幾個大小不同的卡通青蛙圖像，并且每個圖像的周圍都增加了邊框。這兩個網(wǎng)頁的不同的卡通青蛙圖像，并且每個圖像的周圍都增加了邊框。這兩個網(wǎng)頁的不同之處在于第同之處在于第1章中的章中的“卡通青蛙卡通青蛙”網(wǎng)頁是使用網(wǎng)頁是使用HTML代碼實現(xiàn)的，而本實代碼實現(xiàn)的，而本實例是使用例是使用“樣式樣式”實現(xiàn)的。實現(xiàn)的。 圖5-1-1 “卡通青蛙”網(wǎng)頁的顯示效果 5.1.1 創(chuàng)建創(chuàng)建CSS樣式表樣式表1“CSS樣式”面板執(zhí)行執(zhí)行“窗口窗口”“CSS樣式樣式”菜單命令，或者按菜單命令，或者按Shift+F1鍵，即可調(diào)出鍵，即可調(diào)出“CSS樣式樣式”面板，如圖面板，如圖5-1-2所示。其中各選項的作用

3、如下。所示。其中各選項的作用如下。圖5-1-2 “CSS樣式”面板（1）顯示窗口：顯示所有樣式表的名稱，）顯示窗口：顯示所有樣式表的名稱，“（未定義樣式）（未定義樣式）”表示沒有樣表示沒有樣式。式。（2）“附加樣式表附加樣式表”按鈕：單擊該按鈕，調(diào)出按鈕：單擊該按鈕，調(diào)出“選擇樣式表文件選擇樣式表文件”對話框，對話框，用于導(dǎo)入外部的樣式表（文件的擴展名為用于導(dǎo)入外部的樣式表（文件的擴展名為.css）。）。 圖5-1-2 “CSS樣式”面板 （3）“新建新建CSS樣式樣式”按鈕：單擊該按鈕，調(diào)出按鈕：單擊該按鈕，調(diào)出“新建新建CSS樣式樣式”對話對話框，如圖框，如圖5-1-3所示。利用該對話框可

4、以建立新的樣式。所示。利用該對話框可以建立新的樣式。 圖5-1-3 “新建CSS樣式”對話框 （4）“編輯樣式表編輯樣式表”按鈕：單擊該按鈕，調(diào)出能進行樣式表編輯的對話按鈕：單擊該按鈕，調(diào)出能進行樣式表編輯的對話框，利用該對話框可以對框，利用該對話框可以對CSS樣式表進行編輯。樣式表進行編輯。（5）“刪除刪除CSS樣式樣式”按鈕：單擊該按鈕，將刪除選中的樣式。按鈕：單擊該按鈕，將刪除選中的樣式。2創(chuàng)建CSS樣式表（1）在）在“CSS樣式樣式”面板中單擊面板中單擊“新建新建CSS樣式樣式”按鈕，調(diào)出如圖按鈕，調(diào)出如圖5-1-3所所示的示的“新建新建CSS樣式樣式”對話框。選中對話框。選中“選擇器

5、類型選擇器類型”欄內(nèi)的第欄內(nèi)的第1個單選鈕，個單選鈕，在在“名稱名稱”下拉列表框內(nèi)輸入一個樣式表的名稱，名稱必須以下拉列表框內(nèi)輸入一個樣式表的名稱，名稱必須以“.”開始。開始。（2）單擊該對話框中的）單擊該對話框中的“確定確定”按鈕，即可退出該對話框，調(diào)出按鈕，即可退出該對話框，調(diào)出“保存樣保存樣式表文件為式表文件為”對話框。利用該對話框，輸入對話框。利用該對話框，輸入CSS樣式表名稱，單擊樣式表名稱，單擊“保存保存”按鈕，將新建的空的按鈕，將新建的空的CSS樣式表保存。同時，可彈出樣式表保存。同時，可彈出“CSS樣式定義樣式定義”對話對話框，如圖框，如圖5-1-4所示（初始時所示（初始時“分

6、類分類”欄中選中的是欄中選中的是“類別類別”列表項）。利列表項）。利用該對話框可以定義樣式表內(nèi)各個對象屬性。用該對話框可以定義樣式表內(nèi)各個對象屬性。 圖5-1-4 “CSS樣式定義”對話框 （3）設(shè)置完畢后，單擊）設(shè)置完畢后，單擊“確定確定”按鈕，即可完成樣式表的定義。此時，按鈕，即可完成樣式表的定義。此時，在在“CSS樣式表樣式表”面板的顯示窗口內(nèi)，會顯示出新創(chuàng)建的樣式表的名稱。面板的顯示窗口內(nèi)，會顯示出新創(chuàng)建的樣式表的名稱。3“新建CSS樣式”對話框中其他各選項的含義（1）“標(biāo)簽標(biāo)簽”單選鈕：選中該單選鈕后，單選鈕：選中該單選鈕后，“名稱名稱”下拉列表框顯示為下拉列表框顯示為“標(biāo)標(biāo)簽簽”下

7、拉列表框，它提供了各種下拉列表框，它提供了各種HTML語言的標(biāo)記，可利用它對語言的標(biāo)記，可利用它對HTML標(biāo)標(biāo)記重新定義，改變其屬性。記重新定義，改變其屬性。（2）“高級高級”單選鈕：選中該單選鈕后，單選鈕：選中該單選鈕后，“名稱名稱”下拉列表框顯示為下拉列表框顯示為“選選擇器擇器”下拉列表框。下拉列表框?！斑x擇器選擇器”下拉列表框有下拉列表框有4個選項，都是針對熱字的：個選項，都是針對熱字的：link（一般鏈接）、（一般鏈接）、visited（訪問過的鏈接字）、（訪問過的鏈接字）、hover（當(dāng)前的鏈接字）和（當(dāng)前的鏈接字）和active（被激活的鏈接字）。針對這（被激活的鏈接字）。針對這4

8、種狀態(tài)，可設(shè)置它們的屬性，使鏈接種狀態(tài)，可設(shè)置它們的屬性，使鏈接字在各種狀態(tài)下有不同特性。字在各種狀態(tài)下有不同特性。（3）“定義在定義在”欄：用于確定欄：用于確定CSS樣式定義在文件（樣式定義在文件（.css）還是定義在當(dāng)前）還是定義在當(dāng)前文檔中。文檔中。 5.1.2 “CSS樣式定義樣式定義”對話框中的邊框?qū)傩詫υ捒蛑械倪吙驅(qū)傩詥螕魡螕簟癈SS樣式定義樣式定義”對話框左邊對話框左邊“分類分類”列表框中的列表框中的“邊框邊框”列表項，調(diào)列表項，調(diào)出出“邊框邊框”的樣式設(shè)置內(nèi)容的樣式設(shè)置內(nèi)容，如圖，如圖5-1-4所示。利用該對話框可以對圍繞所所示。利用該對話框可以對圍繞所有對象的邊框?qū)傩赃M行定義

9、。該對話框中各選項的作用如下。有對象的邊框?qū)傩赃M行定義。該對話框中各選項的作用如下?！斑吙蜻吙颉睓趦?nèi)有欄內(nèi)有“樣式樣式”、“寬度寬度”和和“顏色顏色”3個欄，每個欄中均有一個個欄，每個欄中均有一個“全部相同全部相同”復(fù)選框，以及復(fù)選框，以及4行選項。行選項。4行選項分別用來定義行選項分別用來定義“上上”、“右右”、“下下”和和“左左”邊框。選擇邊框。選擇“全部相同全部相同”復(fù)選框后，只有復(fù)選框后，只有“上上”欄為可用狀態(tài)，定義了欄為可用狀態(tài)，定義了“上上”邊框后，其他邊框也采用相同的定義。邊框后，其他邊框也采用相同的定義。 “樣式樣式”欄中各下拉列表框中有欄中各下拉列表框中有9個選項。其中，個

10、選項。其中，“無無”選項是取消邊框，選項是取消邊框，其他選項對應(yīng)著一種不同的邊框。邊框的最終顯示效果還與瀏覽器有關(guān)。其他選項對應(yīng)著一種不同的邊框。邊框的最終顯示效果還與瀏覽器有關(guān)。 “寬度寬度”欄的下拉列表框中有欄的下拉列表框中有4個選項。它的第一列的下拉列表框用于設(shè)個選項。它的第一列的下拉列表框用于設(shè)置邊框的寬度，第二列下拉列表框用于選擇數(shù)值的單位，只有在第一列下置邊框的寬度，第二列下拉列表框用于選擇數(shù)值的單位，只有在第一列下拉列表框中選擇了拉列表框中選擇了“（值）（值）”選項時，它才有效，否則均采用像素為單位。選項時，它才有效，否則均采用像素為單位。選擇選擇“細細”選項時，可設(shè)置細邊框；選

11、擇選項時，可設(shè)置細邊框；選擇“中中”選項時，可設(shè)置中等粗細選項時，可設(shè)置中等粗細的邊框；選擇的邊框；選擇“粗粗”選項時，可設(shè)置粗邊框；選擇選項時，可設(shè)置粗邊框；選擇“值值”選項時，可輸入選項時，可輸入邊框粗細的數(shù)值，此時其右邊的下拉列表框變?yōu)橛行?，可以選擇數(shù)值的單邊框粗細的數(shù)值，此時其右邊的下拉列表框變?yōu)橛行?，可以選擇數(shù)值的單位。位。 “顏色顏色”欄中有欄中有1個按鈕和個按鈕和1個文本框用于設(shè)置邊框的顏色。個文本框用于設(shè)置邊框的顏色。 在Dreamweaver中利用樣式表再做的“俏皮歇后語”網(wǎng)頁的顯示效果如圖5-2-1所示。使用CSS樣式表中的“類型”和“背景”屬性，即可在網(wǎng)頁中設(shè)置文字的不同

12、樣式。 圖5-2-1 再做的“俏皮歇后語”網(wǎng)頁的顯示效果 5.2.1 定義樣式表中的類型屬性定義樣式表中的類型屬性在在“CSS樣式定義樣式定義”對話框左邊的對話框左邊的“分類分類”列表框中單擊列表框中單擊“類型類型”列表項，列表項，調(diào)出調(diào)出“類型類型”屬性的設(shè)置內(nèi)容，如圖屬性的設(shè)置內(nèi)容，如圖5-2-2所示。其中各選項的含義如下。所示。其中各選項的含義如下。 圖5-2-2 “分類”屬性的設(shè)置內(nèi)容（1）“字體字體”下拉列表框：設(shè)置應(yīng)用樣式的對象所使用的字體。下拉列表框：設(shè)置應(yīng)用樣式的對象所使用的字體。（2）“大小大小”下拉列表框：設(shè)置應(yīng)用樣式的對象的字體大小，在后面的下下拉列表框：設(shè)置應(yīng)用樣式的對

13、象的字體大小，在后面的下拉列表框中可以設(shè)置使用的單位。拉列表框中可以設(shè)置使用的單位。（3）“樣式樣式”下拉列表框：設(shè)置應(yīng)用樣式的字體是否為斜體或偏斜體。下拉列表框：設(shè)置應(yīng)用樣式的字體是否為斜體或偏斜體。（4）“行高行高”下拉列表框：設(shè)置應(yīng)用樣式的對象所在行的高度。選擇下拉列表框：設(shè)置應(yīng)用樣式的對象所在行的高度。選擇“正正常常”列表項，則表示使用默認的行高；選擇列表項，則表示使用默認的行高；選擇“（值）（值）”列表項后，可以在列表項后，可以在此處輸入一個數(shù)值，在后面的下拉列表框中選擇單位。此處輸入一個數(shù)值，在后面的下拉列表框中選擇單位。（5）“粗細粗細”下拉列表框：設(shè)置網(wǎng)頁中應(yīng)用樣式的對象字體的

14、粗細程度。下拉列表框：設(shè)置網(wǎng)頁中應(yīng)用樣式的對象字體的粗細程度。其中各選項的含義如下。其中各選項的含義如下。 “正常正?！绷斜眄棧菏褂媚J的文字設(shè)置。列表項：使用默認的文字設(shè)置。 “粗體粗體”列表項：將文字設(shè)置為列表項：將文字設(shè)置為“粗體粗體”樣式。樣式。 “特粗特粗”列表項：將文字設(shè)置為列表項：將文字設(shè)置為“特粗特粗”樣式。樣式。 “細體細體”列表項：將文字設(shè)置為列表項：將文字設(shè)置為“細體細體”樣式。樣式。100到到900列表項：使用數(shù)值的方法定義文字的粗細樣式，數(shù)值越大文字也列表項：使用數(shù)值的方法定義文字的粗細樣式，數(shù)值越大文字也就越粗。就越粗。 （6）“變量變量”下拉列表框：選中下拉列表框

15、：選中“小型大寫字母小型大寫字母”列表項后，應(yīng)用樣式列表項后，應(yīng)用樣式的文字中的英文字母將按照小寫字母的大小顯示成大寫字母。的文字中的英文字母將按照小寫字母的大小顯示成大寫字母。（7）“大小寫大小寫”下拉列表框：將網(wǎng)頁中應(yīng)用樣式的文字設(shè)置為大寫、小寫下拉列表框：將網(wǎng)頁中應(yīng)用樣式的文字設(shè)置為大寫、小寫或首字母大寫樣式?；蚴鬃帜复髮憳邮?。（8）“修飾修飾”欄：設(shè)置文字的各種樣式，在欄：設(shè)置文字的各種樣式，在“修飾修飾”欄中進行設(shè)置可以制欄中進行設(shè)置可以制作出各種特殊效果的連接熱字，如圖作出各種特殊效果的連接熱字，如圖5-2-3所示。所示。 圖圖5-2-3 在在“修飾修飾”欄中進行設(shè)置后制作的欄中進

16、行設(shè)置后制作的“雙劃線鏈接雙劃線鏈接”和和“刪除線鏈接刪除線鏈接”熱字熱字 5.2.2 定義樣式表中的背景屬性定義樣式表中的背景屬性在在“CSS樣式定義樣式定義”對話框內(nèi)左邊的對話框內(nèi)左邊的“分類分類”列表框中單擊列表框中單擊“背景背景”列表項，列表項，調(diào)出調(diào)出“背景背景”屬性的設(shè)置內(nèi)容，如圖屬性的設(shè)置內(nèi)容，如圖5-2-4所示。其中各選項的含義如下。所示。其中各選項的含義如下。 圖5-2-4 “背景”屬性的設(shè)置內(nèi)容 （1）“背景顏色背景顏色”按鈕與文本框：用于給選中的對象加背景色。按鈕與文本框：用于給選中的對象加背景色。（2）“背景圖像背景圖像”下拉列表框與下拉列表框與“瀏覽瀏覽”按鈕：用于設(shè)

17、置選中對象的背景按鈕：用于設(shè)置選中對象的背景圖像。下拉列表框內(nèi)有兩個選項。圖像。下拉列表框內(nèi)有兩個選項。 “無無”選項：此選項是默認選項，表示不使用背景圖案。選項：此選項是默認選項，表示不使用背景圖案。 “URL”選項：選擇該選項或單擊選項：選擇該選項或單擊“瀏覽瀏覽”按鈕，可調(diào)出按鈕，可調(diào)出“選擇圖像源選擇圖像源”對話框，利用該對話框，可以選擇背景圖像。對話框，利用該對話框，可以選擇背景圖像。（3）“重復(fù)重復(fù)”下拉列表框：用于設(shè)置背景圖像的重復(fù)方式。包括下拉列表框：用于設(shè)置背景圖像的重復(fù)方式。包括4個選項：個選項：“不重復(fù)不重復(fù)”（只在左上角顯示一幅圖像）、（只在左上角顯示一幅圖像）、“重復(fù)

18、重復(fù)”（沿水平與垂直方向（沿水平與垂直方向重復(fù)）、重復(fù)）、“橫向重復(fù)橫向重復(fù)”（沿水平方向重復(fù)）和（沿水平方向重復(fù)）和“縱向重復(fù)縱向重復(fù)”（沿垂直方向（沿垂直方向重復(fù)）。重復(fù)）。（4）“附件附件”下拉列表框：設(shè)置圖像是否隨內(nèi)容的滾動而滾動。下拉列表框：設(shè)置圖像是否隨內(nèi)容的滾動而滾動。（5）“水平位置水平位置”下拉列表框：用于設(shè)置圖像與選定對象的水平相對位置。下拉列表框：用于設(shè)置圖像與選定對象的水平相對位置。（6）“垂直位置垂直位置”下拉列表框：用于設(shè)置圖像與選定對象的垂直相對位置。下拉列表框：用于設(shè)置圖像與選定對象的垂直相對位置。對于對于“水平位置水平位置”和和“垂直位置垂直位置”下拉列表框，

19、如果選擇了下拉列表框，如果選擇了“值值”選項，選項，則其右邊的下拉列表框變?yōu)橛行?，可用于選擇單位。則其右邊的下拉列表框變?yōu)橛行?，可用于選擇單位。 網(wǎng)頁中的文字應(yīng)該占用多大的地方，取決于這些文字的格式和大小屬性如網(wǎng)頁中的文字應(yīng)該占用多大的地方，取決于這些文字的格式和大小屬性如何設(shè)置。另外，利用樣式中的何設(shè)置。另外，利用樣式中的“區(qū)塊區(qū)塊”和和“方框方框”屬性，可以制作一些比屬性，可以制作一些比較霸道的文字（本身沒有那么大的字號，可是卻偏要占用網(wǎng)頁中的大量地較霸道的文字（本身沒有那么大的字號，可是卻偏要占用網(wǎng)頁中的大量地方，突出自己與眾不同）。方，突出自己與眾不同）。“霸道的文字霸道的文字”網(wǎng)頁的

20、顯示效果如圖網(wǎng)頁的顯示效果如圖5-3-1所示。所示。除了文字外，樣式中的除了文字外，樣式中的“區(qū)塊區(qū)塊”和和“方框方框”屬性對網(wǎng)頁中的其他對象同樣屬性對網(wǎng)頁中的其他對象同樣有效。有效。 圖5-3-1 “霸道的文字”網(wǎng)頁的顯示效果 5.3.1 定義樣式表中的區(qū)塊屬性定義樣式表中的區(qū)塊屬性在在“CSS樣式定義樣式定義”對話框左邊的對話框左邊的“分類分類”列表框中單擊列表框中單擊“區(qū)塊區(qū)塊”列表項，列表項，調(diào)出調(diào)出“區(qū)塊區(qū)塊”屬性的設(shè)置內(nèi)容，如圖屬性的設(shè)置內(nèi)容，如圖5-3-2所示。其中各選項的含義如下。所示。其中各選項的含義如下。 圖5-3-2 “分類”屬性的設(shè)置內(nèi)容 （1）“單詞間距單詞間距”下拉

21、列表框：用于設(shè)定單詞之間的間距，包括兩個選下拉列表框：用于設(shè)定單詞之間的間距，包括兩個選項，一個是項，一個是“正常正?！?，一個是，一個是“（值）（值）”。選擇。選擇“（值）（值）”選項后，可以選項后，可以輸入數(shù)值，再在其右邊的下拉列表框內(nèi)選擇數(shù)值的單位（此處可用負值）。輸入數(shù)值，再在其右邊的下拉列表框內(nèi)選擇數(shù)值的單位（此處可用負值）。選擇選擇“正常正常”選項后，單詞間距是正常的默認值。選項后，單詞間距是正常的默認值。（2）“字母間距字母間距”下拉列表框：用于設(shè)定字母間距，包括兩個選項，一個下拉列表框：用于設(shè)定字母間距，包括兩個選項，一個是是“正常正?！?，一個是，一個是“（值）（值）”。選擇。選

22、擇“（值）（值）”選項后，可以輸入數(shù)值，選項后，可以輸入數(shù)值，再在其右邊的下拉列表框內(nèi)選擇數(shù)值的單位（此處可用負值）。選擇再在其右邊的下拉列表框內(nèi)選擇數(shù)值的單位（此處可用負值）。選擇“正正常?！边x項后，字母間距是正常的默認值。選項后，字母間距是正常的默認值。（3）“垂直對齊垂直對齊”下拉列表框：用于設(shè)置選中的對象相對于上級對象或相下拉列表框：用于設(shè)置選中的對象相對于上級對象或相對所在行，在垂直方向的對齊方式。包括對所在行，在垂直方向的對齊方式。包括9個選項，各選項的作用如下。個選項，各選項的作用如下。 “基線基線”：將對象與上一級對象的基線對齊。：將對象與上一級對象的基線對齊。 “上標(biāo)上標(biāo)”：

23、使上標(biāo)對齊。：使上標(biāo)對齊。 “下標(biāo)下標(biāo)”：使下標(biāo)對齊。：使下標(biāo)對齊。 “頂部頂部”：使對象與所在行中最高對象對齊。：使對象與所在行中最高對象對齊。 “文本頂對齊文本頂對齊”：使對象與上級對象的文字頂部對齊。：使對象與上級對象的文字頂部對齊。 “中線對齊中線對齊”：使對象與所在行中對象的中線對齊。：使對象與所在行中對象的中線對齊。 “底部底部”：使對象與當(dāng)前行中最低的對象的底部對齊。：使對象與當(dāng)前行中最低的對象的底部對齊。 “文本底對齊文本底對齊”：使對象與上級對象的文字底部對齊。：使對象與上級對象的文字底部對齊。 “（值）（值）”：使用數(shù)值方式對齊。：使用數(shù)值方式對齊。（4）“文本對齊文本對齊

24、”下拉列表框：用于設(shè)置首行文字在對象中的對齊方式。下拉列表框：用于設(shè)置首行文字在對象中的對齊方式。包括包括“左對齊左對齊”、“右對齊右對齊”、“居中居中”和和“兩端對齊兩端對齊”4個選項。個選項。（5）“文字縮進文字縮進”文本框：用于輸入文字的縮進量。文本框：用于輸入文字的縮進量。（6）“空格空格”下拉列表框：用于設(shè)置文本空白的使用包括下拉列表框：用于設(shè)置文本空白的使用包括3個選項。個選項。“正常正?！保罕硎緦⑺械目瞻拙顫M。：表示將所有的空白均填滿?！氨Ａ舯Ａ簟保罕硎居捎脩糨斎霑r控制。：表示由用戶輸入時控制?！安粨Q行不換行”：表示文本只有加入標(biāo)記：表示文本只有加入標(biāo)記時才換行。時才換行。（

25、7）“顯示顯示”下拉列表框：用于設(shè)置是否顯示指定的對象，以及如何顯示下拉列表框：用于設(shè)置是否顯示指定的對象，以及如何顯示指定的對象。選擇指定的對象。選擇“無無”選項時，不顯示它被指定的對象。選項時，不顯示它被指定的對象。5.3.2 定義樣式表中的方框?qū)傩远x樣式表中的方框?qū)傩栽谠凇癈SS樣式定義樣式定義”對話框左邊的對話框左邊的“分類分類”列表框中單擊列表框中單擊“方框方框”列表項，列表項，調(diào)出調(diào)出“方框方框”屬性的設(shè)置內(nèi)容，如圖屬性的設(shè)置內(nèi)容，如圖5-3-3所示。其中各選項的含義如下。所示。其中各選項的含義如下。 圖5-3-3 “分類”屬性的設(shè)置內(nèi)容 （1）“寬寬”下拉列表框：用于設(shè)置對象的

26、寬度。包括兩個選項：下拉列表框：用于設(shè)置對象的寬度。包括兩個選項：“自動自動”和和“值值”。在其右邊的下拉列表框內(nèi)選擇數(shù)字的單位。在其右邊的下拉列表框內(nèi)選擇數(shù)字的單位。（2）“高高”下拉列表框：用于設(shè)置對象的高度。也包括下拉列表框：用于設(shè)置對象的高度。也包括“自動自動”和和“值值”兩個選項。兩個選項。（3）“浮動浮動”下拉列表框：用于設(shè)置是否允許文字環(huán)繞在選中對象的周圍。下拉列表框：用于設(shè)置是否允許文字環(huán)繞在選中對象的周圍。包括包括3個選項，個選項，“左對齊左對齊”、“右對齊右對齊”和和“無無”（即對象不移動）。（即對象不移動）。（4）“清除清除”下拉列表框：用于設(shè)定其他對象是否可以在選定對象

27、的左右。下拉列表框：用于設(shè)定其他對象是否可以在選定對象的左右。包括包括3個選項，個選項，“左對齊左對齊”、“右對齊右對齊”和和“無無”（不允許其他對象在其左（不允許其他對象在其左右）。右）。（5）“填充填充”欄：用于設(shè)置邊框與其中的內(nèi)容之間填充的空白間距，欄：用于設(shè)置邊框與其中的內(nèi)容之間填充的空白間距，4個個下拉列表框分別用來決定上、右、下和左邊框與內(nèi)容之間的間距。下拉列下拉列表框分別用來決定上、右、下和左邊框與內(nèi)容之間的間距。下拉列表框內(nèi)應(yīng)輸入數(shù)值，在其右邊的下拉列表框內(nèi)選擇數(shù)值的單位。表框內(nèi)應(yīng)輸入數(shù)值，在其右邊的下拉列表框內(nèi)選擇數(shù)值的單位。（6）“邊界邊界”欄：用于設(shè)置邊緣的空白寬度，在其

28、下拉列表框內(nèi)可輸入數(shù)欄：用于設(shè)置邊緣的空白寬度，在其下拉列表框內(nèi)可輸入數(shù)值或選擇值或選擇“自動自動”。 再做的再做的“心情隨筆心情隨筆”網(wǎng)頁的顯示效果如圖網(wǎng)頁的顯示效果如圖5-4-1所示?？梢钥闯?，網(wǎng)頁的結(jié)所示?？梢钥闯觯W(wǎng)頁的結(jié)構(gòu)及網(wǎng)頁中的對象沒有什么變化，但是網(wǎng)頁中的圖像與原來網(wǎng)頁中的圖像構(gòu)及網(wǎng)頁中的對象沒有什么變化，但是網(wǎng)頁中的圖像與原來網(wǎng)頁中的圖像相比，產(chǎn)生了一種虛化的效果。使用樣式中的相比，產(chǎn)生了一種虛化的效果。使用樣式中的“擴展擴展”屬性即可產(chǎn)生這樣屬性即可產(chǎn)生這樣的效果。的效果。 圖5-4-1 “心情隨筆”網(wǎng)頁的顯示效果 5.4.1 定義樣式表中的擴展屬性定義樣式表中的擴展屬性在

29、在“CSS樣式定義樣式定義”對話框左邊的對話框左邊的“分類分類”列表框中單擊列表框中單擊“擴展擴展”列表項，列表項，調(diào)出調(diào)出“擴展擴展”屬性的設(shè)置內(nèi)容，如圖屬性的設(shè)置內(nèi)容，如圖5-4-2所示。其中各選項的含義如下。所示。其中各選項的含義如下。 圖 5-4-2 “擴展”屬性的設(shè)置內(nèi)容 （1）“分頁分頁”欄：用于在選中的對象的前面或后面強制加入分頁符。一欄：用于在選中的對象的前面或后面強制加入分頁符。一般瀏覽器均不支持此項功能。該欄有般瀏覽器均不支持此項功能。該欄有“之前之前”和和“之后之后”兩個下拉列表框，兩個下拉列表框，其內(nèi)的選項是：其內(nèi)的選項是：“自動自動”、“始終始終”、“左對齊左對齊”和

30、和“右對齊右對齊”，用于確，用于確定分頁符的位置。定分頁符的位置。（2）視覺效果欄：利用該欄的兩個下拉列表框中的選項，可以設(shè)置特殊的）視覺效果欄：利用該欄的兩個下拉列表框中的選項，可以設(shè)置特殊的顯示效果，使頁面的顯示效果更動人。顯示效果，使頁面的顯示效果更動人。 “光標(biāo)光標(biāo)”下拉列表框：可以利用該下拉列表框中的選項，設(shè)置各種鼠標(biāo)的下拉列表框：可以利用該下拉列表框中的選項，設(shè)置各種鼠標(biāo)的形狀。低版本的瀏覽器不支持此項功能。形狀。低版本的瀏覽器不支持此項功能。 “過濾器過濾器”下拉列表框：用于對圖像進行濾鏡處理，獲得各種特殊的效果。下拉列表框：用于對圖像進行濾鏡處理，獲得各種特殊的效果。 5.4.

31、2 定義樣式表中的列表屬性和定位屬性定義樣式表中的列表屬性和定位屬性1定義樣式表中的列表屬性在“CSS樣式定義”對話框內(nèi)左邊的“分類”列表框中單擊“列表”列表項，調(diào)出“列表”屬性的設(shè)置內(nèi)容，如圖5-4-3所示。其中各選項的含義如下。 圖5-4-3 “擴展”屬性的設(shè)置內(nèi)容 （1）“類型類型”下拉列表框：用于設(shè)置列表的標(biāo)記。選擇標(biāo)記是序號（有下拉列表框：用于設(shè)置列表的標(biāo)記。選擇標(biāo)記是序號（有序列表）或符號（無序列表）。該下拉列表框內(nèi)有序列表）或符號（無序列表）。該下拉列表框內(nèi)有9個選項：個選項：“圓點圓點”、“圓圈圓圈”等。等。（2）“項目符號圖像項目符號圖像”下拉列表框和按鈕：該下拉列表框內(nèi)有兩

32、個選項，下拉列表框和按鈕：該下拉列表框內(nèi)有兩個選項，“無無”和和“（URL）”。選擇。選擇“無無”選項，不加圖像標(biāo)記；選擇選項，不加圖像標(biāo)記；選擇“（URL）”選項，單擊選項，單擊“瀏覽瀏覽”按鈕，打開按鈕，打開“選擇圖像源選擇圖像源”對話框，利對話框，利用該對話框可選擇圖像，在列表行加入小的圖標(biāo)圖案作為列表標(biāo)記。用該對話框可選擇圖像，在列表行加入小的圖標(biāo)圖案作為列表標(biāo)記。（3）“位置位置”下拉列表框：使用該下拉列表框來設(shè)置列表標(biāo)記的縮進方式。下拉列表框：使用該下拉列表框來設(shè)置列表標(biāo)記的縮進方式。2定義樣式表中的定位屬性在在“CSS樣式定義樣式定義”對話框內(nèi)左邊的對話框內(nèi)左邊的“分類分類”列表

33、框中單擊列表框中單擊“定位定位”列表項，列表項，調(diào)出調(diào)出“定位定位”屬性的設(shè)置內(nèi)容，如圖屬性的設(shè)置內(nèi)容，如圖5-4-4所示。其中各選項的含義如下。所示。其中各選項的含義如下。（1）“類型類型”下拉列表框：用于設(shè)置對象的位置。其中各選項的作用如下。下拉列表框：用于設(shè)置對象的位置。其中各選項的作用如下。 “絕對絕對”：以頁面左上角的坐標(biāo)為基點。：以頁面左上角的坐標(biāo)為基點。 “相對相對”：以母體左上角的坐標(biāo)為基點。：以母體左上角的坐標(biāo)為基點。 “靜態(tài)靜態(tài)”：按文本正常順序定位，一般與：按文本正常順序定位，一般與“相對相對”定位相同。定位相同。 圖5-4-4 “定位”屬性的設(shè)置內(nèi)容（2）“顯示顯示”下

34、拉列表框：用于設(shè)置對象的可視性。其中各選項的作用如下拉列表框：用于設(shè)置對象的可視性。其中各選項的作用如下下 “可見可見”：選中的對象是可視的。：選中的對象是可視的。 “隱藏隱藏”：選中的對象是隱藏的。：選中的對象是隱藏的。 “繼承繼承”：選中的對象繼承其母體的可視性。：選中的對象繼承其母體的可視性。（3）“Z軸軸”下拉列表框：用于設(shè)置不同層的對象的顯示次序。包括兩個下拉列表框：用于設(shè)置不同層的對象的顯示次序。包括兩個選項：選項：“自動自動”（按原顯示次序）和（按原顯示次序）和“值值”。選擇。選擇“值值”選項，可輸入數(shù)選項，可輸入數(shù)值，數(shù)值越大，顯示越靠上。值，數(shù)值越大，顯示越靠上。（4）“溢出

35、溢出”下拉列表框：用于設(shè)置當(dāng)文字超出其容器（如層）時的處理下拉列表框：用于設(shè)置當(dāng)文字超出其容器（如層）時的處理方式。方式。 “可見可見”：當(dāng)文字超出其容器時仍然可以顯示。：當(dāng)文字超出其容器時仍然可以顯示。 “隱藏隱藏”：當(dāng)文字超出其容器時，超出的內(nèi)容不能顯示。：當(dāng)文字超出其容器時，超出的內(nèi)容不能顯示。 “滾動滾動”：在母體加一個滾動條，可利用滾動條滾動顯示母體中的文字。：在母體加一個滾動條，可利用滾動條滾動顯示母體中的文字。 “自動自動”：一般默認狀態(tài)為：一般默認狀態(tài)為“隱藏隱藏”狀態(tài)。狀態(tài)。（5）“定位定位”欄：用于設(shè)置放置對象的容器的大小和位置。欄：用于設(shè)置放置對象的容器的大小和位置。（6

36、）“剪輯剪輯”欄：用于設(shè)定對象溢出母體容器部分的剪切方式。欄：用于設(shè)定對象溢出母體容器部分的剪切方式。對網(wǎng)頁中的對象應(yīng)用對網(wǎng)頁中的對象應(yīng)用“定位定位”樣式后，樣式后，Dreamweaver會自動將該對象插入會自動將該對象插入到一個層中，并將該層按照到一個層中，并將該層按照“定位定位”屬性中的內(nèi)容進行定義。屬性中的內(nèi)容進行定義。 “射門射門”網(wǎng)頁中有一個足球和一個球門，網(wǎng)頁在初始狀態(tài)下的顯示效果如網(wǎng)頁中有一個足球和一個球門，網(wǎng)頁在初始狀態(tài)下的顯示效果如圖圖5-5-1所示，瀏覽器加載網(wǎng)頁后，足球會向球門移動，直到射到球門內(nèi)，所示，瀏覽器加載網(wǎng)頁后，足球會向球門移動，直到射到球門內(nèi)，效果如圖效果如圖

37、5-5-2所示。所示。 圖5-5-2 當(dāng)足球射入到球門內(nèi)時網(wǎng)頁的顯示效果圖5-5-1 初始時“射門”網(wǎng)頁的顯示效果 5.5.1 “時間軸時間軸”面板面板“時間軸時間軸”面板是用于控制網(wǎng)頁中層的屬性隨時間變化而改變的工具。利面板是用于控制網(wǎng)頁中層的屬性隨時間變化而改變的工具。利用它可以產(chǎn)生動畫效果。執(zhí)行用它可以產(chǎn)生動畫效果。執(zhí)行“窗口窗口”“時間軸時間軸”菜單命令，或按菜單命令，或按Alt+F9鍵，即可調(diào)出鍵，即可調(diào)出“時間軸時間軸”面板，如圖面板，如圖5-5-3所示。該面板中的各個工具及其所示。該面板中的各個工具及其他項目的作用如下。他項目的作用如下。 圖5-5-3 “時間軸”面板 1“時間軸

38、”面板的工具欄（1）“時間軸時間軸”下拉列表框：列出了當(dāng)前頁面內(nèi)所有時間軸動畫的名稱，下拉列表框：列出了當(dāng)前頁面內(nèi)所有時間軸動畫的名稱，選中其中一個選項后，相應(yīng)的動畫就會在選中其中一個選項后，相應(yīng)的動畫就會在“時間軸時間軸”面板中顯示出來。面板中顯示出來。（2）“歸位歸位”按鈕：將動畫圖像移到起始位置，同時回放頭也移動到該位按鈕：將動畫圖像移到起始位置，同時回放頭也移動到該位置處。置處。（3）“回放回放”按鈕：單擊該按鈕，可以使動畫退回一個幀。按住該按鈕不按鈕：單擊該按鈕，可以使動畫退回一個幀。按住該按鈕不放，可以向相反方向播放動畫。放，可以向相反方向播放動畫。（4）“回放頭位置回放頭位置”文

39、本框：用于輸入顯示和設(shè)置文本框：用于輸入顯示和設(shè)置“回放頭回放頭”所處的時間所處的時間軸位置號。軸位置號。（5）“播放播放”按鈕：單擊該按鈕，可使動畫前進一個幀。按住該按鈕不放，按鈕：單擊該按鈕，可使動畫前進一個幀。按住該按鈕不放，可以向正常方向播放動畫?？梢韵蛘７较虿シ艅赢?。（6）“速度速度”文本框：用于輸入每秒鐘播放的幀數(shù)。文本框：用于輸入每秒鐘播放的幀數(shù)。（7）“自動播放自動播放”復(fù)選框：選中該復(fù)選框后，則在網(wǎng)上下載后會自動播放。復(fù)選框：選中該復(fù)選框后，則在網(wǎng)上下載后會自動播放。不選中該復(fù)選框時，需要在使用行為事件時才可以播放。不選中該復(fù)選框時，需要在使用行為事件時才可以播放。（8）“

40、循環(huán)循環(huán)”復(fù)選框：選中該復(fù)選框后，則循環(huán)播放動畫，否則只播放一復(fù)選框：選中該復(fù)選框后，則循環(huán)播放動畫，否則只播放一次動畫。次動畫。 2通道（1）行為通道：其左邊標(biāo)有字母）行為通道：其左邊標(biāo)有字母“B”，可以在該通道的特定幀使用行為事，可以在該通道的特定幀使用行為事件。件。（2）行為幀：加入了行為事件的幀，它在）行為幀：加入了行為事件的幀，它在“行為通道行為通道”內(nèi)。內(nèi)。（3）時間標(biāo)尺：給出了與時間對應(yīng)的幀數(shù)。）時間標(biāo)尺：給出了與時間對應(yīng)的幀數(shù)。（4）回放頭：播放動畫時，回放頭在時間標(biāo)尺上移動，好像放像機的磁頭）回放頭：播放動畫時，回放頭在時間標(biāo)尺上移動，好像放像機的磁頭一樣。用鼠標(biāo)拖曳回放頭在

41、時間標(biāo)尺上移動，當(dāng)它移到某一時間單位處時，一樣。用鼠標(biāo)拖曳回放頭在時間標(biāo)尺上移動，當(dāng)它移到某一時間單位處時，相應(yīng)的動畫畫面會出現(xiàn)在文檔窗口內(nèi)。相應(yīng)的動畫畫面會出現(xiàn)在文檔窗口內(nèi)。（5）動畫條：表示一個動畫所占的幀數(shù)，上面標(biāo)有該動畫所在層的名稱。）動畫條：表示一個動畫所占的幀數(shù)，上面標(biāo)有該動畫所在層的名稱。它的起始處和終止處各有一個小圓，表示首幀和終止幀。如果設(shè)置了關(guān)鍵它的起始處和終止處各有一個小圓，表示首幀和終止幀。如果設(shè)置了關(guān)鍵幀，則關(guān)鍵幀也會有一個小圓。幀，則關(guān)鍵幀也會有一個小圓。（6）動畫通道：由許多圖層組成，表示可以在一個頁面內(nèi)加入多個時間軸）動畫通道：由許多圖層組成，表示可以在一個頁面

42、內(nèi)加入多個時間軸動畫，但最多可以加動畫，但最多可以加32個，它的左邊標(biāo)有圖層的編號。圖層編號大的動畫個，它的左邊標(biāo)有圖層的編號。圖層編號大的動畫在圖層編號小的動畫之上。在圖層編號小的動畫之上。 5.5.2 制作直線移動動畫制作直線移動動畫（1）在頁面內(nèi)插入一個層，給該層起一個名字，例如，）在頁面內(nèi)插入一個層，給該層起一個名字，例如，Layer1。然后在層。然后在層內(nèi)插入一個圖像或輸入一些文字等。此處層中插入的是圖像，如圖內(nèi)插入一個圖像或輸入一些文字等。此處層中插入的是圖像，如圖5-5-4所所示。示。圖5-5-4 在層中插入圖像并移到動畫的起始位置（2）將插有圖像或文字的層移到動畫的起始位置。）

43、將插有圖像或文字的層移到動畫的起始位置。（3）調(diào)出）調(diào)出“時間軸時間軸”面板。面板。（4）用鼠標(biāo)將層拖曳到）用鼠標(biāo)將層拖曳到“時間軸時間軸”面板的動畫通道內(nèi)，或執(zhí)行面板的動畫通道內(nèi)，或執(zhí)行“修修改改”“時間軸時間軸”“增加對象到時間軸增加對象到時間軸”菜單命令。這時，菜單命令。這時，“時間軸時間軸”面面板的動畫通道內(nèi)會出現(xiàn)一個動畫條，如圖板的動畫通道內(nèi)會出現(xiàn)一個動畫條，如圖5-5-5所示。如果選中了所示。如果選中了“循環(huán)循環(huán)”復(fù)選框，則在動畫通道中，會同時出現(xiàn)一個復(fù)選框，則在動畫通道中，會同時出現(xiàn)一個“動作幀動作幀”。圖圖5-5-5 動畫通道內(nèi)出現(xiàn)一個動畫條動畫通道內(nèi)出現(xiàn)一個動畫條（5）選中動

44、畫條的終止幀。默認的動畫幀數(shù)是）選中動畫條的終止幀。默認的動畫幀數(shù)是15幀，如果要調(diào)整動畫的幀幀，如果要調(diào)整動畫的幀數(shù)，可用鼠標(biāo)將動畫條終止幀拖曳到希望結(jié)束的幀上面。在改變了終止幀數(shù)，可用鼠標(biāo)將動畫條終止幀拖曳到希望結(jié)束的幀上面。在改變了終止幀的位置之后，如果要編輯行為，則應(yīng)該雙擊動畫通道中最后一幀的下一幀。的位置之后，如果要編輯行為，則應(yīng)該雙擊動畫通道中最后一幀的下一幀。 圖5-5-4 在層中插入圖像并移到動畫的起始位置 圖5-5-5 動畫通道內(nèi)出現(xiàn)一個動畫條 （6）用鼠標(biāo)拖曳動畫層到目標(biāo)處，當(dāng)松開鼠標(biāo)左鍵時，會看到一條直線，）用鼠標(biāo)拖曳動畫層到目標(biāo)處，當(dāng)松開鼠標(biāo)左鍵時，會看到一條直線，表示

45、圖像移動的路徑，如圖表示圖像移動的路徑，如圖5-5-6所示。所示。 圖5-5-6 表示圖像移動路徑的一條直線（7）按住“播放”按鈕不放，即可在網(wǎng)頁編輯窗口內(nèi)看到動畫了。在上一節(jié)的在上一節(jié)的“射門射門”網(wǎng)頁中，足球是以直線運動射入球門。其實，更精彩網(wǎng)頁中，足球是以直線運動射入球門。其實，更精彩的射門應(yīng)該是沿曲線射出的的射門應(yīng)該是沿曲線射出的“香蕉球香蕉球”，在修改后的，在修改后的“射門射門”網(wǎng)頁中，足網(wǎng)頁中，足球變?yōu)榍€向球門移動，直到移到球門內(nèi)，效果如圖球變?yōu)榍€向球門移動，直到移到球門內(nèi)，效果如圖5-6-1所示。所示。 圖5-6-1 再做的“射門”網(wǎng)頁的顯示效果 5.6.1 加入關(guān)鍵幀加入關(guān)

46、鍵幀“時間軸時間軸”面板可以在用戶給出起始幀和終止幀后，自動產(chǎn)生中間過程的面板可以在用戶給出起始幀和終止幀后，自動產(chǎn)生中間過程的各幀。如果動畫的移動路徑不是直線的，中間有轉(zhuǎn)折點，則轉(zhuǎn)折點處的畫各幀。如果動畫的移動路徑不是直線的，中間有轉(zhuǎn)折點，則轉(zhuǎn)折點處的畫面就是關(guān)鍵幀。加入關(guān)鍵幀，可以使沿直線路徑移動的動畫變?yōu)檠厍€或面就是關(guān)鍵幀。加入關(guān)鍵幀，可以使沿直線路徑移動的動畫變?yōu)檠厍€或折線路徑移動的動畫，加入關(guān)鍵幀的方法如下。折線路徑移動的動畫，加入關(guān)鍵幀的方法如下。（1）選中動畫條內(nèi)要加入關(guān)鍵幀的位置，回放頭會隨之移到此時間位置，）選中動畫條內(nèi)要加入關(guān)鍵幀的位置，回放頭會隨之移到此時間位置，同時

47、產(chǎn)生一條垂直的紅線，用于指示選中的位置。同時產(chǎn)生一條垂直的紅線，用于指示選中的位置。（2）在動畫條內(nèi)，單擊鼠標(biāo)右鍵，彈出時間軸快捷菜單。再單擊該菜單內(nèi)）在動畫條內(nèi)，單擊鼠標(biāo)右鍵，彈出時間軸快捷菜單。再單擊該菜單內(nèi)的的“增加關(guān)鍵幀增加關(guān)鍵幀”菜單命令，即可在選中的位置處插入一個關(guān)鍵幀，如圖菜單命令，即可在選中的位置處插入一個關(guān)鍵幀，如圖5-6-2所示。所示。 （3）還可以通過按?。┻€可以通過按住Ctrl鍵的同時單擊要加入關(guān)鍵幀的位置來插入關(guān)鍵幀。鍵的同時單擊要加入關(guān)鍵幀的位置來插入關(guān)鍵幀。如果對關(guān)鍵幀的位置不滿意，可以用鼠標(biāo)拖曳關(guān)鍵幀上的小圓來調(diào)整其位如果對關(guān)鍵幀的位置不滿意，可以用鼠標(biāo)拖曳關(guān)鍵

48、幀上的小圓來調(diào)整其位置。置。如果要刪除關(guān)鍵幀，可以選中要刪除的關(guān)鍵幀，然后單擊鼠標(biāo)右鍵，彈出如果要刪除關(guān)鍵幀，可以選中要刪除的關(guān)鍵幀，然后單擊鼠標(biāo)右鍵，彈出時間軸快捷菜單，再單擊該菜單中的時間軸快捷菜單，再單擊該菜單中的“移除關(guān)鍵幀移除關(guān)鍵幀”菜單命令即可。菜單命令即可。 圖5-6-2 加入關(guān)鍵幀后的“時間軸”面板 5.6.2 制作沿曲線路徑移動的動畫制作沿曲線路徑移動的動畫（1）選中關(guān)鍵幀，用鼠標(biāo)拖曳動畫層到新的位置，即可確定關(guān)鍵幀圖像的）選中關(guān)鍵幀，用鼠標(biāo)拖曳動畫層到新的位置，即可確定關(guān)鍵幀圖像的位置。此時動畫移動的路徑線會變?yōu)橐粭l曲線，如圖位置。此時動畫移動的路徑線會變?yōu)橐粭l曲線，如圖5

49、-6-3所示。可以看出，所示?？梢钥闯?，路徑線的起始位置與終止位置不變。如果要改變關(guān)鍵幀的位置，可以再用路徑線的起始位置與終止位置不變。如果要改變關(guān)鍵幀的位置，可以再用鼠標(biāo)拖曳動畫層到新的位置。鼠標(biāo)拖曳動畫層到新的位置。（2）按?。┌醋　安シ挪シ拧卑粹o不放，即可在網(wǎng)頁編輯窗口內(nèi)看到沿曲線路徑移動按鈕不放，即可在網(wǎng)頁編輯窗口內(nèi)看到沿曲線路徑移動的動畫。的動畫。 圖5-6-3 調(diào)整關(guān)鍵幀動畫層的位置后產(chǎn)生的曲線路徑線 “風(fēng)景幻燈風(fēng)景幻燈”網(wǎng)頁初始時顯示為一幅風(fēng)景圖像，如圖網(wǎng)頁初始時顯示為一幅風(fēng)景圖像，如圖5-7-1所示。網(wǎng)頁加載所示。網(wǎng)頁加載后，其中的圖像會向右移動，當(dāng)移動到一定的位置后，該圖像消

50、失，在網(wǎng)后，其中的圖像會向右移動，當(dāng)移動到一定的位置后，該圖像消失，在網(wǎng)頁的左邊顯示出另外一幅圖像，并且和第一幅一樣向右移動，如圖頁的左邊顯示出另外一幅圖像，并且和第一幅一樣向右移動，如圖5-7-2所所示。交替顯示示。交替顯示4幅圖像后從第一幅圖像開始重新進行循環(huán)顯示。幅圖像后從第一幅圖像開始重新進行循環(huán)顯示。 圖圖5-7-1 “風(fēng)景幻燈風(fēng)景幻燈”網(wǎng)頁初始時的顯示效果網(wǎng)頁初始時的顯示效果 圖圖5-7-2 “風(fēng)景幻燈風(fēng)景幻燈”網(wǎng)頁中動畫的顯示效果網(wǎng)頁中動畫的顯示效果 5.7.1 動畫的刪除、復(fù)制、移動和更名動畫的刪除、復(fù)制、移動和更名1動畫的刪除（1）刪除動畫條：選中要刪除的動畫條后，再按）刪除

51、動畫條：選中要刪除的動畫條后，再按Delet鍵即可。鍵即可。（2）刪除動畫的移動路徑：選中要刪除的動畫條，再按）刪除動畫的移動路徑：選中要刪除的動畫條，再按Delet按鍵即可。按鍵即可。（3）刪除所有動畫條：單擊時間軸菜單中的）刪除所有動畫條：單擊時間軸菜單中的“刪除時間軸刪除時間軸”菜單命令即可。菜單命令即可。2動畫的復(fù)制（1）選中要復(fù)制的動畫條，再單擊時間軸菜單中的）選中要復(fù)制的動畫條，再單擊時間軸菜單中的“復(fù)制復(fù)制”菜單命令即可。菜單命令即可。（2）調(diào)整回放頭的位置，再單擊時間軸菜單中的）調(diào)整回放頭的位置，再單擊時間軸菜單中的“粘貼粘貼”菜單命令，即可菜單命令，即可在選中的動畫條的右邊復(fù)

52、制一個動畫條，而且可以將其復(fù)制到其他頁面的在選中的動畫條的右邊復(fù)制一個動畫條，而且可以將其復(fù)制到其他頁面的“時間軸時間軸”面板中。面板中。3動畫的移動（1）選中要移動的動畫條，再單擊時間軸菜單中的）選中要移動的動畫條，再單擊時間軸菜單中的“剪切剪切”菜單命令。菜單命令。（2）調(diào)整回放頭的位置，再單擊時間軸菜單中的）調(diào)整回放頭的位置，再單擊時間軸菜單中的“粘貼粘貼”菜單命令，即可菜單命令，即可將動畫條移到回放頭所處的位置處，而且可以將其移動到其他頁面的將動畫條移到回放頭所處的位置處，而且可以將其移動到其他頁面的“時時間軸間軸”面板中。面板中。 （3）可以用鼠標(biāo)拖曳一個動畫條在整個動畫通道內(nèi)移動。

53、按住）可以用鼠標(biāo)拖曳一個動畫條在整個動畫通道內(nèi)移動。按住Shift鍵的鍵的同時單擊要移動的動畫條，選中多個動畫條，鼠標(biāo)拖曳一個動畫條即可同同時單擊要移動的動畫條，選中多個動畫條，鼠標(biāo)拖曳一個動畫條即可同時移動多個動畫條。時移動多個動畫條。4動畫的更名（1）可以直接在）可以直接在“時間軸時間軸”面板的列表框內(nèi)更改動畫的名稱。面板的列表框內(nèi)更改動畫的名稱。（2）單擊時間軸菜單中的）單擊時間軸菜單中的“重命名時間軸重命名時間軸”菜單命令，調(diào)出菜單命令，調(diào)出“重命名時間重命名時間軸軸”對話框。在該對話框內(nèi)的對話框。在該對話框內(nèi)的“時間軸名稱時間軸名稱”文本框內(nèi)輸入新的名稱，再文本框內(nèi)輸入新的名稱，再單

54、擊單擊“確定確定”按鈕即可。按鈕即可。5.7.2 使用多個時間軸使用多個時間軸與用時間軸控制頁面上的所有操作相比，使用單獨的時間軸來控制頁的各與用時間軸控制頁面上的所有操作相比，使用單獨的時間軸來控制頁的各個離散部分會更容易。例如，一個頁可能包含多個互動對象，每個對象都個離散部分會更容易。例如，一個頁可能包含多個互動對象，每個對象都可以觸發(fā)不同的時間軸。可以觸發(fā)不同的時間軸。 若要管理多個時間軸，可執(zhí)行以下任意一種操作。若要管理多個時間軸，可執(zhí)行以下任意一種操作。 新建時間軸：執(zhí)行新建時間軸：執(zhí)行“修改修改”“時間軸時間軸”“添加時間軸添加時間軸”菜單命令即可。菜單命令即可。 刪除時間軸：選中

55、要刪除的時間軸，執(zhí)行刪除時間軸：選中要刪除的時間軸，執(zhí)行“修改修改”“時間軸時間軸”“刪除刪除時間軸時間軸”菜單命令，將永久刪除選中的時間軸中的所有動畫。菜單命令，將永久刪除選中的時間軸中的所有動畫。 重命名時間軸：選中要重命名的時間軸，執(zhí)行重命名時間軸：選中要重命名的時間軸，執(zhí)行“修改修改”“時間時間軸軸”“重命名時間軸重命名時間軸”菜單命令；單擊菜單命令；單擊“時間軸時間軸”面板右上角的按鈕，調(diào)面板右上角的按鈕，調(diào)出時間軸菜單，單擊該菜單中的出時間軸菜單，單擊該菜單中的“重命名時間軸重命名時間軸”菜單命令即可。菜單命令即可。 查看另一個時間軸：要在查看另一個時間軸：要在“時間軸時間軸”面板中查看另一個時間軸，可在面板中查看另一個時間軸，可在“時間軸時間軸”面板左上角的下拉列表框中直接選擇一個新的時間軸即可。面板左上角的下拉列表框中直接選擇一個新的時間軸即可。 在時間軸中插入對象：選中網(wǎng)頁文檔中的對象，再單擊在時間軸中插入對象：選中網(wǎng)頁文檔中的對象，再單擊“時間軸時間