Dreamweaver 8和Flash 8案例教程表單、樣式表與網(wǎng)頁中的其他對象

1、 【案例案例11 11】“電腦配置調(diào)查表電腦配置調(diào)查表”網(wǎng)網(wǎng)頁頁4.1 【案例案例1212】“硬盤的性能指標(biāo)硬盤的性能指標(biāo)”網(wǎng)網(wǎng)頁頁4.2【案例案例1313】“WordWord操作演示操作演示”網(wǎng)頁網(wǎng)頁4.3【案例案例1414】“電子市場圖片秀電子市場圖片秀”網(wǎng)網(wǎng)頁頁4.44.1.1 學(xué)習(xí)目標(biāo)學(xué)習(xí)目標(biāo) “電腦配置調(diào)查表電腦配置調(diào)查表”網(wǎng)頁的顯示效果網(wǎng)頁的顯示效果如圖如圖4-1-1所示。在該網(wǎng)頁中，以表單的方所示。在該網(wǎng)頁中，以表單的方式列出了電腦主要配件的調(diào)查信息，只需式列出了電腦主要配件的調(diào)查信息，只需在頁面中按照提示進行選擇或輸入后，單在頁面中按照提示進行選擇或輸入后，單擊擊“提交提交”按

2、鈕，即可將網(wǎng)頁中的信息提按鈕，即可將網(wǎng)頁中的信息提交到服務(wù)器的數(shù)據(jù)庫中。交到服務(wù)器的數(shù)據(jù)庫中。圖圖4-1-1 “電腦配置調(diào)查表電腦配置調(diào)查表”網(wǎng)頁的顯示效果網(wǎng)頁的顯示效果 表單是用戶利用瀏覽器對表單是用戶利用瀏覽器對Web站點數(shù)站點數(shù)據(jù)庫進行查詢和添加的一種界面，用戶利據(jù)庫進行查詢和添加的一種界面，用戶利用表單可以輸入信息或選擇選項等，然后用表單可以輸入信息或選擇選項等，然后將這些信息提交給服務(wù)器進行處理，這種將這些信息提交給服務(wù)器進行處理，這種查詢方式叫做交互的或者雙向的。這些表查詢方式叫做交互的或者雙向的。這些表單對象包括文本域、下拉列表框、復(fù)選框單對象包括文本域、下拉列表框、復(fù)選框和單選

3、按鈕等。和單選按鈕等。 表單對象是讓用戶輸入信息的地方，表單對象是讓用戶輸入信息的地方，表單域是放置表單對象的區(qū)域，只有表單表單域是放置表單對象的區(qū)域，只有表單域內(nèi)的表單對象，才可以將它的信息傳送域內(nèi)的表單對象，才可以將它的信息傳送出去。出去。4.1.2 操作過程操作過程1創(chuàng)建表單域和插入表單對象創(chuàng)建表單域和插入表單對象（1）創(chuàng)建與刪除表單域）創(chuàng)建與刪除表單域創(chuàng)建表單域：將光標(biāo)移到要插入表單域創(chuàng)建表單域：將光標(biāo)移到要插入表單域的位置，單擊的位置，單擊“插入插入”（表單）欄內(nèi)的（表單）欄內(nèi)的“表單表單”按鈕按鈕 ，即可在網(wǎng)頁編輯窗口，即可在網(wǎng)頁編輯窗口內(nèi)創(chuàng)建一個表單域，如圖內(nèi)創(chuàng)建一個表單域，如圖

4、4-1-2所示。所示。圖圖4-1-2 創(chuàng)建的表單域創(chuàng)建的表單域 單擊表單域內(nèi)部，將光標(biāo)移到表單域單擊表單域內(nèi)部，將光標(biāo)移到表單域內(nèi)，按回車鍵，即可將表單域調(diào)大。按內(nèi)，按回車鍵，即可將表單域調(diào)大。按BackSpace鍵，可使表單域縮小。表單域鍵，可使表單域縮小。表單域在瀏覽器內(nèi)是看不到的。在瀏覽器內(nèi)是看不到的。顯示表單域：在表單域創(chuàng)建后，若看不顯示表單域：在表單域創(chuàng)建后，若看不到表單域的矩形紅線，可以單擊選中到表單域的矩形紅線，可以單擊選中“查查看看”“可視化助理可視化助理”“不可見元素不可見元素”菜單命令，即可將表單域的矩形紅線顯示菜單命令，即可將表單域的矩形紅線顯示出來。出來。刪除表單域：單

5、擊表單域的邊線處，選刪除表單域：單擊表單域的邊線處，選中表單域，按中表單域，按Delete鍵，即可刪除表單域。鍵，即可刪除表單域。 （2）設(shè)置表單域的屬性）設(shè)置表單域的屬性 選中表單域，此時表單域選中表單域，此時表單域“屬性屬性”欄欄如圖如圖4-1-3所示。所示。圖圖4-1-3 表單域表單域“屬性屬性”欄欄 “表單名稱表單名稱”文本框：在該文本框內(nèi)，輸文本框：在該文本框內(nèi)，輸入表單域的名字。表單域的名字可用于入表單域的名字。表單域的名字可用于JavaScript和和VBScript等腳本語言中，這些等腳本語言中，這些腳本語言可以控制表單域的屬性。腳本語言可以控制表單域的屬性。 “動作動作”文本

6、框和按鈕：利用它們可以文本框和按鈕：利用它們可以輸入腳本程序或含有腳本程序的輸入腳本程序或含有腳本程序的HTML文文件。件。 “方法方法”下拉列表框：用來選擇客戶端下拉列表框：用來選擇客戶端與服務(wù)器之間傳送數(shù)據(jù)采用的方式。與服務(wù)器之間傳送數(shù)據(jù)采用的方式。3個選個選項是項是“默認(rèn)默認(rèn)”、“GET”（獲得，即追加（獲得，即追加表單值到表單值到URL，并發(fā)送服務(wù)器，并發(fā)送服務(wù)器GET請求）請求）和和“POST”（傳遞，在消息正文中發(fā)送表（傳遞，在消息正文中發(fā)送表單的值，并發(fā)送服務(wù)器單的值，并發(fā)送服務(wù)器POST請求）。請求）。 “類類”下拉列表框：其中有下拉列表框：其中有“重命名重命名”、“管理樣式管

7、理樣式”和創(chuàng)建的和創(chuàng)建的CSS樣式名稱等多樣式名稱等多個選項，可以用來選擇個選項，可以用來選擇CSS樣式、給樣式、給CSS樣式更名和創(chuàng)建新的樣式更名和創(chuàng)建新的CSS樣式等。樣式等。（3）插入表單對象的方法）插入表單對象的方法 將光標(biāo)移到要插入表單對象的表單中，將光標(biāo)移到要插入表單對象的表單中，再插入表單對象。插入表單對象的方法與再插入表單對象。插入表單對象的方法與插入表單的方法一樣。插入表單的方法一樣。 將光標(biāo)移到要插入表單對象的位置，將光標(biāo)移到要插入表單對象的位置，然后單擊然后單擊“插入插入”（表單）欄中的相應(yīng)按（表單）欄中的相應(yīng)按鈕，即可在光標(biāo)處插入一個相應(yīng)的表單對鈕，即可在光標(biāo)處插入一個

8、相應(yīng)的表單對象。另外，單擊象。另外，單擊“插入插入”“表單表單”菜單菜單命令，彈出它的下一級菜單。命令，彈出它的下一級菜單。 根據(jù)要插入的表單對象類別，單擊菜根據(jù)要插入的表單對象類別，單擊菜單內(nèi)的菜單命令也可插入表單對象。單內(nèi)的菜單命令也可插入表單對象。表單對象的表單對象的“屬性屬性”欄中都有一個名稱文欄中都有一個名稱文本框，用來輸入表單對象的名稱，該名稱本框，用來輸入表單對象的名稱，該名稱可在程序中使用，以指定表單對象。可在程序中使用，以指定表單對象。（1）文本域?qū)傩缘脑O(shè)置：文本域也）文本域?qū)傩缘脑O(shè)置：文本域也叫做文本字段，表單中經(jīng)常使用文本叫做文本字段，表單中經(jīng)常使用文本域。它可以是單行，

9、也可以是多行，域。它可以是單行，也可以是多行，用于接收文本、數(shù)字和字符。文本域用于接收文本、數(shù)字和字符。文本域的的“屬性屬性”欄如圖欄如圖4-1-4所示，各選項所示，各選項的作用如下。的作用如下。圖圖4-1-4 文本域文本域的的“屬性屬性”欄欄“字符寬度字符寬度”文本框：文本域的寬度，即文本框：文本域的寬度，即可顯示字符的最多個數(shù)?？娠@示字符的最多個數(shù)。 “類型類型”欄：該欄有欄：該欄有3個單選項，用來選個單選項，用來選擇擇“單行單行”、“多行多行”或或“密碼密碼”文本域。文本域。密碼文本域的特點是：當(dāng)用戶輸入文字時，密碼文本域的特點是：當(dāng)用戶輸入文字時，密碼文本域內(nèi)顯示的不是這些文字，而是密

10、碼文本域內(nèi)顯示的不是這些文字，而是一行一行“*”。選擇。選擇“多行多行”單選項時，其單選項時，其“屬性屬性”欄會發(fā)生變化：欄會發(fā)生變化：“初始值初始值”文本文本框變?yōu)閹L動條的多行文本框，同時框變?yōu)閹L動條的多行文本框，同時“換換行行”下拉列表框變?yōu)橛行В吕斜砜蜃優(yōu)橛行?，“字符寬度字符寬度”文本框變?yōu)槲谋究蜃優(yōu)椤靶袛?shù)行數(shù)”文本框，用來輸入文文本框，用來輸入文本框的行數(shù)。本框的行數(shù)。“初始值初始值”文本框：用來輸入文本框的初文本框：用來輸入文本框的初始內(nèi)容。始內(nèi)容。 “換行換行”下拉列表框：只有在選擇了下拉列表框：只有在選擇了“多行多行”類型后它才有效。類型后它才有效?！皳Q行換行”下拉下拉列

11、表框內(nèi)有列表框內(nèi)有4個選項，它們的含義如下。個選項，它們的含義如下。“默認(rèn)默認(rèn)”：采用瀏覽器的默認(rèn)值。：采用瀏覽器的默認(rèn)值。 “關(guān)關(guān)”：當(dāng)輸入的文字超過文本框的寬：當(dāng)輸入的文字超過文本框的寬度時不換行，但是會出現(xiàn)滾動條。度時不換行，但是會出現(xiàn)滾動條。 “虛擬虛擬”：當(dāng)輸入文字超過文本框?qū)挾龋寒?dāng)輸入文字超過文本框?qū)挾葧r會自動換行，向服務(wù)器傳輸數(shù)據(jù)時無回時會自動換行，向服務(wù)器傳輸數(shù)據(jù)時無回車符。車符。 “實體實體”：當(dāng)輸入的文字超過文本框的：當(dāng)輸入的文字超過文本框的寬度時，會自動加入回車符并換行。寬度時，會自動加入回車符并換行。（2）復(fù)選框?qū)傩缘脑O(shè)置：復(fù)選框）復(fù)選框?qū)傩缘脑O(shè)置：復(fù)選框 有選中和未選

12、中兩種狀態(tài)，多個復(fù)選有選中和未選中兩種狀態(tài)，多個復(fù)選框允許多選。它的框允許多選。它的“屬性屬性”欄如圖欄如圖4-1-5所示，各選項的作用如下。所示，各選項的作用如下。圖圖4-1-5 復(fù)選框的復(fù)選框的“屬性屬性”欄欄 “選定值選定值”文本框：用來輸入復(fù)選框選中文本框：用來輸入復(fù)選框選中時的數(shù)值，通常為時的數(shù)值，通常為1或或0。 “初始狀態(tài)初始狀態(tài)”欄：它有兩個單選項，用欄：它有兩個單選項，用來設(shè)置復(fù)選框的初始狀態(tài)。來設(shè)置復(fù)選框的初始狀態(tài)。（3）單選按鈕屬性的設(shè)置：單選按）單選按鈕屬性的設(shè)置：單選按鈕鈕 也叫做單選項，一組單選按鈕也叫做單選項，一組單選按鈕中同一時間只允許選中一個，它的中同一時間只

13、允許選中一個，它的“屬性屬性”欄如圖欄如圖4-1-6所示。該所示。該“屬性屬性”欄中的選項與復(fù)選框欄中的選項與復(fù)選框“屬性屬性”欄中相欄中相應(yīng)選項的作用一樣。應(yīng)選項的作用一樣。圖圖4-1-6 單選按鈕的單選按鈕的“屬性屬性”欄欄（4）單選按鈕組屬性的設(shè)置：單選）單選按鈕組屬性的設(shè)置：單選按鈕組按鈕組 也叫做單選項組。單擊也叫做單選項組。單擊“插入插入”（表單）欄中的（表單）欄中的“單選按鈕單選按鈕組組”按鈕按鈕 ，可彈出，可彈出“單選按鈕組單選按鈕組”對話框，如圖對話框，如圖4-1-7所示。所示。圖圖4-1-7 “單選按鈕組單選按鈕組”對話框?qū)υ捒?利用該對話框可以設(shè)置單選按鈕利用該對話框可以

14、設(shè)置單選按鈕組中單選按鈕的個數(shù)、名稱和初始值。組中單選按鈕的個數(shù)、名稱和初始值。如果要增加選項，可單擊如果要增加選項，可單擊 按鈕；按鈕；如果要刪除選項，可選中要刪除的選如果要刪除選項，可選中要刪除的選項，再單擊項，再單擊 按鈕。如果要調(diào)整選按鈕。如果要調(diào)整選項的顯示次序，可選中要移動的選項，項的顯示次序，可選中要移動的選項，再單擊再單擊 或或 按鈕。單選按鈕組按鈕。單選按鈕組的的“屬性屬性”欄如圖欄如圖4-1-6所示。所示。（5）按鈕屬性的設(shè)置：按鈕）按鈕屬性的設(shè)置：按鈕 用來用來制作制作“提交提交”和和“重置重置”按鈕，還可按鈕，還可以調(diào)用函數(shù)，它的以調(diào)用函數(shù)，它的“屬性屬性”欄如圖欄如圖

15、4-1-8所示，各選項的作用如下。所示，各選項的作用如下。 “標(biāo)簽標(biāo)簽”文本框：用來輸入按鈕上的文字。文本框：用來輸入按鈕上的文字。 “動作動作”欄：它有欄：它有3個單選項，用來選個單選項，用來選擇單擊該選項后引起的動作類型。擇單擊該選項后引起的動作類型。 “提交表單提交表單”：選中它后，可以向服務(wù)：選中它后，可以向服務(wù)器提交整個表單。器提交整個表單。 “重設(shè)表單重設(shè)表單”：選中它后，可以取消前面：選中它后，可以取消前面的輸入，復(fù)位表單。的輸入，復(fù)位表單。 “無無”：選中它后，表示是一般按鈕，：選中它后，表示是一般按鈕，可用來調(diào)用腳本程序?？捎脕碚{(diào)用腳本程序。圖圖4-1-8 按鈕的按鈕的“屬性

16、屬性”欄欄 （6）列表）列表/菜單屬性的設(shè)置：列表菜單屬性的設(shè)置：列表/菜菜單單 的作用是將一些選項放在一個的作用是將一些選項放在一個帶滾動條的列表框內(nèi)，它的帶滾動條的列表框內(nèi)，它的“屬性屬性”欄如圖欄如圖4-1-9所示，各選項的作用如下。所示，各選項的作用如下。圖圖4-1-9 列表列表/菜單的菜單的“屬性屬性”欄欄 “類型類型”欄：它有欄：它有“菜單菜單”和和“列表列表”兩兩個單選項。個單選項。“菜單菜單”就是下拉列表框；選就是下拉列表框；選擇擇“列表列表”選項后，其右邊的各選項會變選項后，其右邊的各選項會變?yōu)榭蛇x項，此時的列表框右邊會產(chǎn)生滾動為可選項，此時的列表框右邊會產(chǎn)生滾動條。條。 “

17、高度高度”文本框：用來輸入列表的高度文本框：用來輸入列表的高度值，即可以顯示的行數(shù)。值，即可以顯示的行數(shù)。 “選定范圍選定范圍”復(fù)選框：選中它后，表示復(fù)選框：選中它后，表示列表中的各選項可以同時選擇多項。列表中的各選項可以同時選擇多項。 “初始化時選定初始化時選定”列表框：用來設(shè)置第列表框：用來設(shè)置第一次彈出該菜單時，菜單中默認(rèn)的選中項。一次彈出該菜單時，菜單中默認(rèn)的選中項。 “列表值列表值”按鈕：單擊該按鈕，可彈出一按鈕：單擊該按鈕，可彈出一個個“列表值列表值”對話框，與圖對話框，與圖4-1-7相似，使相似，使用方法基本相同。利用該對話框可以輸入用方法基本相同。利用該對話框可以輸入菜單或列表

18、內(nèi)顯示的選項內(nèi)容（在菜單或列表內(nèi)顯示的選項內(nèi)容（在“標(biāo)簽標(biāo)簽”欄內(nèi)），以及輸入此選項提交后的返回值欄內(nèi)），以及輸入此選項提交后的返回值（在（在“值值”欄內(nèi)）。欄內(nèi)）。（7）跳轉(zhuǎn)菜單屬性的設(shè)置：跳轉(zhuǎn)菜）跳轉(zhuǎn)菜單屬性的設(shè)置：跳轉(zhuǎn)菜單單 采用下拉列表框的方式來實現(xiàn)采用下拉列表框的方式來實現(xiàn)鏈接跳轉(zhuǎn)，其外觀與列表鏈接跳轉(zhuǎn)，其外觀與列表/菜單菜單 一一樣，是菜單的另外一種形式。用戶單樣，是菜單的另外一種形式。用戶單擊該菜單的某一個選項時，當(dāng)前頁面擊該菜單的某一個選項時，當(dāng)前頁面或框架會跳轉(zhuǎn)到其他的頁面。創(chuàng)建跳或框架會跳轉(zhuǎn)到其他的頁面。創(chuàng)建跳轉(zhuǎn)菜單的操作方法如下。轉(zhuǎn)菜單的操作方法如下。 單擊單擊“跳轉(zhuǎn)菜單

19、跳轉(zhuǎn)菜單”按鈕按鈕 ，屏幕會彈，屏幕會彈出一個出一個“插入跳轉(zhuǎn)菜單插入跳轉(zhuǎn)菜單”對話框，如圖對話框，如圖4-1-10所示。在所示。在“文本文本”文本框內(nèi)輸入菜單文本框內(nèi)輸入菜單命令的說明文字，在命令的說明文字，在“菜單項菜單項”列表框內(nèi)列表框內(nèi)會隨之顯示出來。其中各選項的作用如下。會隨之顯示出來。其中各選項的作用如下。、 、 和和 按鈕的作用與圖按鈕的作用與圖4-1-7所示按鈕的作用一樣。所示按鈕的作用一樣。在在“選擇時，轉(zhuǎn)到選擇時，轉(zhuǎn)到URL”文本框內(nèi)輸入要文本框內(nèi)輸入要跳轉(zhuǎn)的文件路徑與文件名字。也可以單擊跳轉(zhuǎn)的文件路徑與文件名字。也可以單擊“瀏覽瀏覽”按鈕，彈出按鈕，彈出“選擇文件選擇文件

20、”對話框，對話框，選擇鏈接的文件。選擇鏈接的文件。在在“打開打開URL于于”下拉列表框內(nèi)選擇在下拉列表框內(nèi)選擇在何處打開文件。何處打開文件。在在“菜單名稱菜單名稱”文本框內(nèi)輸入跳轉(zhuǎn)菜單文本框內(nèi)輸入跳轉(zhuǎn)菜單的名稱。的名稱?！斑x項選項”欄有兩個復(fù)選框。選中欄有兩個復(fù)選框。選中“菜單之菜單之后插入前往按鈕后插入前往按鈕”復(fù)選框后，在菜單的右復(fù)選框后，在菜單的右邊會增加一個邊會增加一個“前往前往”按鈕。選中按鈕。選中“更改更改URL后選擇第一個項目后選擇第一個項目”復(fù)選框后，可設(shè)復(fù)選框后，可設(shè)置跳轉(zhuǎn)后重新定義菜單第一個選項為默認(rèn)置跳轉(zhuǎn)后重新定義菜單第一個選項為默認(rèn)選項。選項。 單擊單擊“確定確定”按鈕

21、，可退出該對話框，按鈕，可退出該對話框，頁面會顯示一個跳轉(zhuǎn)菜單。按照圖頁面會顯示一個跳轉(zhuǎn)菜單。按照圖4-1-10所示進行設(shè)置后，瀏覽器中顯示的跳轉(zhuǎn)菜所示進行設(shè)置后，瀏覽器中顯示的跳轉(zhuǎn)菜單如圖單如圖4-1-11所示。所示。 圖圖4-1-10 “插入跳轉(zhuǎn)菜單插入跳轉(zhuǎn)菜單”對話框?qū)υ捒?圖圖4-1-11 在頁面內(nèi)的跳轉(zhuǎn)菜單在頁面內(nèi)的跳轉(zhuǎn)菜單 選中創(chuàng)建的跳轉(zhuǎn)菜單后，其選中創(chuàng)建的跳轉(zhuǎn)菜單后，其“屬性屬性”欄與圖欄與圖4-1-9基本一樣。基本一樣。4.2.1 學(xué)習(xí)目標(biāo)學(xué)習(xí)目標(biāo) “硬盤的性能指標(biāo)硬盤的性能指標(biāo)”網(wǎng)頁的顯示效果網(wǎng)頁的顯示效果如圖如圖4-2-1所示。在該網(wǎng)頁中，使用樣式表所示。在該網(wǎng)頁中，使用樣

22、式表對其中的文字進行樣式設(shè)置。對其中的文字進行樣式設(shè)置。圖圖4-2-1 “硬盤的性能指標(biāo)硬盤的性能指標(biāo)”網(wǎng)頁的顯示效果網(wǎng)頁的顯示效果 在以前各章節(jié)中，對頁面對象的各種在以前各章節(jié)中，對頁面對象的各種屬性都是一個一個獨立設(shè)置的，例如，選屬性都是一個一個獨立設(shè)置的，例如，選中本章案例中的標(biāo)題文字，將它選中并復(fù)中本章案例中的標(biāo)題文字，將它選中并復(fù)制到剪貼板中，再粘貼到記事本中，可得制到剪貼板中，再粘貼到記事本中，可得到它的到它的HTML標(biāo)識語句：標(biāo)識語句：電腦配置調(diào)查表電腦配置調(diào)查表 可以看出，對于文字可以看出，對于文字“電腦配置調(diào)查電腦配置調(diào)查表表”的字體、大小、顏色等屬性在該的字體、大小、顏色等

23、屬性在該HTML語句中進行了定義。如果網(wǎng)頁中有語句中進行了定義。如果網(wǎng)頁中有許多處的文字都采用同樣的屬性設(shè)置，那許多處的文字都采用同樣的屬性設(shè)置，那么每處文字也都需要進行相同的屬性設(shè)置，么每處文字也都需要進行相同的屬性設(shè)置，這無疑會給網(wǎng)頁制作帶來許多重復(fù)性的工這無疑會給網(wǎng)頁制作帶來許多重復(fù)性的工作，同時也使網(wǎng)頁的作，同時也使網(wǎng)頁的HTML文件龐大，造文件龐大，造成網(wǎng)頁傳輸和下載速度變慢。成網(wǎng)頁傳輸和下載速度變慢。 為了解決該問題，可以對頁面中經(jīng)常為了解決該問題，可以對頁面中經(jīng)常出現(xiàn)的相同或相近屬性的對象進行整體屬出現(xiàn)的相同或相近屬性的對象進行整體屬性的設(shè)置，即建立樣式表。性的設(shè)置，即建立樣式表

24、。1996年發(fā)明的年發(fā)明的層疊式樣式表（層疊式樣式表（Cascading Style Sheet，CSS）可以對頁面布局、背景、字體大小、）可以對頁面布局、背景、字體大小、顏色、表格等屬性進行統(tǒng)一的設(shè)置，然后顏色、表格等屬性進行統(tǒng)一的設(shè)置，然后再用于頁面各個相應(yīng)的對象。再用于頁面各個相應(yīng)的對象。4.2.2 操作過程操作過程1創(chuàng)建創(chuàng)建CSS樣式表樣式表（1）CSS樣式表編輯器樣式表編輯器 CSS樣式表可以對頁面布局、背景、樣式表可以對頁面布局、背景、字體大小、顏色和表格等屬性進行統(tǒng)一的字體大小、顏色和表格等屬性進行統(tǒng)一的設(shè)置，然后再應(yīng)用于頁面各個相應(yīng)的對象。設(shè)置，然后再應(yīng)用于頁面各個相應(yīng)的對象。

25、單擊單擊“窗口窗口”“CSS樣式樣式”菜單命令，菜單命令，彈出彈出“CSS樣式樣式”面板（也叫做面板（也叫做CSS樣式樣式表編輯器），如圖表編輯器），如圖4-2-2所示。其中各選項所示。其中各選項的作用如下。的作用如下。顯示窗口：顯示所有樣式表的名稱，顯示窗口：顯示所有樣式表的名稱，“（未定義樣式）（未定義樣式）”表示沒有樣式。表示沒有樣式。 “附加樣式表附加樣式表”按鈕按鈕 ：單擊它，可：單擊它，可以彈出一個以彈出一個“鏈接外部樣式表鏈接外部樣式表”對話框，對話框，如圖如圖4-2-5所示。再單擊所示。再單擊“瀏覽瀏覽”按鈕，可按鈕，可彈出彈出“選擇樣式表文件選擇樣式表文件”對話框，用來導(dǎo)對話

26、框，用來導(dǎo)入外部的樣式表（文件的擴展名為入外部的樣式表（文件的擴展名為.CSS）。）。圖圖4-2-5 “鏈接外部樣式表鏈接外部樣式表”對話框?qū)υ捒?“新建新建CSS規(guī)則規(guī)則”按鈕（也叫做按鈕（也叫做“新建新建CSS樣式樣式”按鈕）按鈕） ：單擊它，可以彈出：單擊它，可以彈出一個一個“新建新建CSS規(guī)則規(guī)則”對話框，如圖對話框，如圖4-2-3所示。利用該對話框可以建立新的樣式。所示。利用該對話框可以建立新的樣式。 “編輯樣式編輯樣式”按鈕按鈕 ：在：在“CSS樣式樣式”面面板中選中一種樣式后，它才有效。單擊它，板中選中一種樣式后，它才有效。單擊它，可彈出一個能進行樣式表編輯的對話框可彈出一個能進

27、行樣式表編輯的對話框（例如（例如“.style1的的CSS規(guī)則定義規(guī)則定義”對話框，對話框，如圖如圖4-2-4所示），利用該對話框可以所示），利用該對話框可以對對.style1樣式進行編輯。樣式進行編輯?！皠h除刪除CSS規(guī)則規(guī)則”按鈕（也叫做按鈕（也叫做“刪除刪除CSS樣式樣式”按鈕）按鈕） ：單擊它，可以刪除：單擊它，可以刪除選中的樣式。選中的樣式。（2）創(chuàng)建）創(chuàng)建CSS樣式表樣式表打開如圖打開如圖4-2-3所示的所示的“新建新建CSS規(guī)則規(guī)則”對對話框，選中話框，選中“選擇器類型選擇器類型”欄內(nèi)的第欄內(nèi)的第1個單個單選項，在選項，在“名稱名稱”下拉列表框內(nèi)輸入一個下拉列表框內(nèi)輸入一個樣式表

28、的名字，名字必須以樣式表的名字，名字必須以“.”開始，例開始，例如，如，“.style1”。單擊該對話框中的。單擊該對話框中的“確定確定”按鈕，即可退出該對話框，彈出按鈕，即可退出該對話框，彈出“CSS規(guī)規(guī)則定義則定義”對話框，如圖對話框，如圖4-2-4所示。所示。利用利用“CSS規(guī)則定義規(guī)則定義”對話框進行樣式表對話框進行樣式表內(nèi)各個對象屬性的定義。內(nèi)各個對象屬性的定義。定義完成后，單擊定義完成后，單擊“確定確定”按鈕，即可按鈕，即可完成樣式表的定義。此時，在完成樣式表的定義。此時，在“CSS樣式樣式”面板內(nèi)會顯示出新創(chuàng)建的樣式表的名稱。面板內(nèi)會顯示出新創(chuàng)建的樣式表的名稱。（1）定義文字屬性

29、）定義文字屬性 單擊圖單擊圖4-2-4所示的所示的“CSS規(guī)則定義規(guī)則定義”對話框左邊對話框左邊“分類分類”欄內(nèi)的欄內(nèi)的“類型類型”選項，選項，此時的對話框如圖此時的對話框如圖4-2-4所示。利用該對話所示。利用該對話框可以設(shè)置框可以設(shè)置CSS樣式的字體、大小、樣式樣式的字體、大小、樣式和顏色等。單擊和顏色等。單擊“應(yīng)用應(yīng)用”按鈕，可將設(shè)置按鈕，可將設(shè)置的樣式應(yīng)用到頁面中。的樣式應(yīng)用到頁面中。（2）定義背景屬性）定義背景屬性 單擊圖單擊圖4-2-4所示對話框內(nèi)左邊所示對話框內(nèi)左邊“分類分類”欄內(nèi)的欄內(nèi)的“背景背景”選項，此時的選項，此時的“CSS規(guī)則規(guī)則定義定義”對話框內(nèi)的對話框內(nèi)的“背景背景

30、”欄如圖欄如圖4-2-6所所示。利用示。利用“背景背景”欄的欄的“背景顏色背景顏色”和和“背景圖像背景圖像”按鈕與文本框可以定義背景按鈕與文本框可以定義背景顏色和背景圖像。其他選項的作用如下。顏色和背景圖像。其他選項的作用如下。圖圖4-2-6 “背景背景”欄欄 “重復(fù)重復(fù)”下拉列表框：用來設(shè)置背景圖像下拉列表框：用來設(shè)置背景圖像的重復(fù)方式。它有的重復(fù)方式。它有4個選項：個選項：“不重復(fù)不重復(fù)”（只在左上角顯示一幅圖像）、（只在左上角顯示一幅圖像）、“重復(fù)重復(fù)”（沿水平與垂直方向重復(fù)）、（沿水平與垂直方向重復(fù)）、“橫向重復(fù)橫向重復(fù)”（沿水平方向重復(fù)）和（沿水平方向重復(fù)）和“縱向重復(fù)縱向重復(fù)”（沿

31、（沿垂直方向重復(fù)）。垂直方向重復(fù)）。 “附件附件”下拉列表框：設(shè)置圖像是否隨下拉列表框：設(shè)置圖像是否隨內(nèi)容的滾動而滾動。內(nèi)容的滾動而滾動。 “水平位置水平位置”和和“垂直位置垂直位置”下拉列表下拉列表框：用來設(shè)置圖像與選定對象的水平和垂框：用來設(shè)置圖像與選定對象的水平和垂直相對位置。如果選擇了直相對位置。如果選擇了“值值”選項，則選項，則其右邊的下拉列表框變?yōu)橛行?，可用來選其右邊的下拉列表框變?yōu)橛行?，可用來選擇單位。擇單位。（3）定義區(qū)塊屬性）定義區(qū)塊屬性 單擊圖單擊圖4-2-4所示對話框內(nèi)左邊所示對話框內(nèi)左邊“分類分類”欄內(nèi)的欄內(nèi)的“區(qū)塊區(qū)塊”選項，此時對話框內(nèi)的選項，此時對話框內(nèi)的“區(qū)塊區(qū)

32、塊”欄如圖欄如圖4-2-7所示。其中各選項的所示。其中各選項的作用如下。作用如下。 圖圖4-2-7 “區(qū)塊區(qū)塊”欄欄“單詞間距單詞間距”下拉列表框：用來設(shè)定單詞下拉列表框：用來設(shè)定單詞間距。選擇間距。選擇“值值”選項后，可以輸入數(shù)值，選項后，可以輸入數(shù)值，再在其右邊的下拉列表框內(nèi)選擇數(shù)值的單再在其右邊的下拉列表框內(nèi)選擇數(shù)值的單位。此處可以用負(fù)值。位。此處可以用負(fù)值。 “字母間距字母間距”下拉列表框：用來設(shè)定字下拉列表框：用來設(shè)定字母間距。選擇母間距。選擇“（值）（值）”選項后，可以輸選項后，可以輸入數(shù)值，再在其右邊的下拉列表框內(nèi)選擇入數(shù)值，再在其右邊的下拉列表框內(nèi)選擇數(shù)值的單位。此處可以用負(fù)值

33、。數(shù)值的單位。此處可以用負(fù)值。 “垂直對齊垂直對齊”下拉列表框：用它可以設(shè)下拉列表框：用它可以設(shè)置選中的對象相對于上級對象或相對所在置選中的對象相對于上級對象或相對所在行在垂直方向的對齊方式。行在垂直方向的對齊方式?！拔谋緦R文本對齊”下拉列表框：用來設(shè)置首行下拉列表框：用來設(shè)置首行文字在對象中的對齊方式。文字在對象中的對齊方式。 “文字縮進文字縮進”文本框：用來輸入文字的文本框：用來輸入文字的縮進量?？s進量。 “空格空格”下拉列表框：用來設(shè)置文本空下拉列表框：用來設(shè)置文本空白的使用方式。它有白的使用方式。它有“正常正常”（將所有的（將所有的空白均填滿）、空白均填滿）、“保留保留”（由用戶輸入

34、時（由用戶輸入時控制）和控制）和“不換行不換行”（在加入（在加入標(biāo)記時標(biāo)記時才換行）選項。才換行）選項。（4）定義方框?qū)傩裕┒x方框?qū)傩?單擊圖單擊圖4-2-4所示對話框內(nèi)左邊所示對話框內(nèi)左邊“分類分類”欄內(nèi)的欄內(nèi)的“方框方框”選項，此時的對話框內(nèi)右選項，此時的對話框內(nèi)右邊的邊的“方框方框”欄如圖欄如圖4-2-8所示。其中各選所示。其中各選項的作用如下。項的作用如下。圖圖4-2-8 “方框方框”欄欄“寬寬”和和“高高”下拉列表框：用來設(shè)置對下拉列表框：用來設(shè)置對象的寬度和高度。它們都有象的寬度和高度。它們都有“自動自動”（由（由對象自身大小決定）和對象自身大小決定）和“值值”（由輸入的（由輸入

35、的數(shù)值決定）數(shù)值決定）2個選項。在其右邊的下拉列表個選項。在其右邊的下拉列表框內(nèi)選擇數(shù)字的單位?？騼?nèi)選擇數(shù)字的單位。 “浮動浮動”下拉列表框：用來設(shè)置是否允下拉列表框：用來設(shè)置是否允許文字環(huán)繞在選中對象的周圍。許文字環(huán)繞在選中對象的周圍。 “清除清除”下拉列表框：用來設(shè)定其他對象下拉列表框：用來設(shè)定其他對象是否可以在選定對象的左右。是否可以在選定對象的左右。 “填充填充”欄：用來設(shè)置邊框與其中的內(nèi)欄：用來設(shè)置邊框與其中的內(nèi)容之間填充的空白間距，下拉列表框內(nèi)應(yīng)容之間填充的空白間距，下拉列表框內(nèi)應(yīng)輸入數(shù)值，在其右邊的下拉列表框內(nèi)選擇輸入數(shù)值，在其右邊的下拉列表框內(nèi)選擇數(shù)值的單位。數(shù)值的單位。 “邊

36、界邊界”欄：用來設(shè)置邊緣的空白寬度，欄：用來設(shè)置邊緣的空白寬度，下拉列表框內(nèi)可輸入數(shù)值或選擇下拉列表框內(nèi)可輸入數(shù)值或選擇“自動自動”。（5）定義邊框?qū)傩裕┒x邊框?qū)傩?單擊圖單擊圖4-2-4所示對話框內(nèi)左邊所示對話框內(nèi)左邊“分類分類”欄內(nèi)的欄內(nèi)的“邊框邊框”選項，此時對話框內(nèi)右邊選項，此時對話框內(nèi)右邊的的“邊框邊框”欄如圖欄如圖4-2-9所示。它用來對圍所示。它用來對圍繞所有對象的邊框?qū)傩赃M行設(shè)置。繞所有對象的邊框?qū)傩赃M行設(shè)置。圖圖4-2-9 “邊框邊框”欄欄設(shè)置邊框的寬度與顏色：該對話框內(nèi)有設(shè)置邊框的寬度與顏色：該對話框內(nèi)有4行選項，分別為上、右、下和左邊框。每行選項，分別為上、右、下和左邊

37、框。每行有行有3個下拉列表框和個下拉列表框和1個按鈕與文本框。個按鈕與文本框。第第1列的下拉列表框用來設(shè)置邊框的樣式，列的下拉列表框用來設(shè)置邊框的樣式，第第2列的下拉列表框用來設(shè)置邊框的寬度，列的下拉列表框用來設(shè)置邊框的寬度，第第3列的下拉列表框用來選擇數(shù)值的單位，列的下拉列表框用來選擇數(shù)值的單位，按鈕和后面的文本框用來設(shè)置邊框的顏色。按鈕和后面的文本框用來設(shè)置邊框的顏色。 邊框的寬度下拉列表框內(nèi)的選項有邊框的寬度下拉列表框內(nèi)的選項有4個，個，選擇選擇“值值”時，可以輸入邊框粗細的數(shù)值，時，可以輸入邊框粗細的數(shù)值，此時其右邊的下拉列表框變?yōu)橛行?，可以此時其右邊的下拉列表框變?yōu)橛行В梢赃x擇單位

38、。選擇單位。 “樣式樣式”下拉列表框：在此下拉列表框下拉列表框：在此下拉列表框中有中有9個選項。其中，個選項。其中，“無無”選項是取消邊選項是取消邊框，其他選項各對應(yīng)著一種不同的邊框?？?，其他選項各對應(yīng)著一種不同的邊框。邊框的最終顯示效果還與瀏覽器有關(guān)。邊框的最終顯示效果還與瀏覽器有關(guān)。（6）定義列表屬性）定義列表屬性 單擊圖單擊圖4-2-4所示對話框內(nèi)左邊所示對話框內(nèi)左邊“分類分類”欄內(nèi)的欄內(nèi)的“列表列表”選項，此時該對話框右邊選項，此時該對話框右邊的的“列表列表”欄如圖欄如圖4-2-10所示。其中各選所示。其中各選項的作用如下。項的作用如下。圖圖4-2-10 “列表列表”欄欄“類型類型”下

39、拉列表框：用來設(shè)置列表的標(biāo)下拉列表框：用來設(shè)置列表的標(biāo)記。選擇標(biāo)記是序號（有序列表）或符號記。選擇標(biāo)記是序號（有序列表）或符號（無序列表）。該下拉列表框內(nèi)有（無序列表）。該下拉列表框內(nèi)有9個選項，個選項，包括包括“圓點圓點”、“圓圈圓圈”等。等。 “項目符號圖像項目符號圖像”下拉列表框和按鈕：下拉列表框和按鈕：該下拉列表框內(nèi)有該下拉列表框內(nèi)有“無無”和和“（URL）”兩個選項。選擇兩個選項。選擇“無無”選項后，不加圖像選項后，不加圖像標(biāo)記；選擇標(biāo)記；選擇“（URL）”選項后，單擊選項后，單擊“瀏覽瀏覽”按鈕，打開按鈕，打開“選擇圖像源文件選擇圖像源文件”對話框，利用它可以選擇圖像，在列表行對話

40、框，利用它可以選擇圖像，在列表行加入小的圖標(biāo)圖案作為列表標(biāo)記。加入小的圖標(biāo)圖案作為列表標(biāo)記。 “位置位置”下拉列表框：用來設(shè)置列表標(biāo)下拉列表框：用來設(shè)置列表標(biāo)記的縮進方式。記的縮進方式。（7）定義定位屬性）定義定位屬性 單擊圖單擊圖4-2-4所示對話框內(nèi)左邊所示對話框內(nèi)左邊“分類分類”欄中的欄中的“定位定位”選項，此時該對話框內(nèi)右選項，此時該對話框內(nèi)右邊的邊的“定位定位”欄如圖欄如圖4-2-11所示。其中各所示。其中各選項的作用如下。選項的作用如下。圖圖4-2-11 “定位定位”欄欄“類型類型”下拉列表框：用來設(shè)置對象的位下拉列表框：用來設(shè)置對象的位置。各選項的作用如下。置。各選項的作用如下。

41、 “溢出溢出”下拉列表框：用來設(shè)置當(dāng)文字下拉列表框：用來設(shè)置當(dāng)文字超出其容器時的處理方式。各選項的作用超出其容器時的處理方式。各選項的作用如下。如下。（8）定義擴展屬性）定義擴展屬性 單擊圖單擊圖4-2-4所示對話框內(nèi)左邊所示對話框內(nèi)左邊“分類分類”欄內(nèi)的欄內(nèi)的“擴展擴展”選項，此時該對話框內(nèi)右選項，此時該對話框內(nèi)右邊的邊的“擴展擴展”欄如圖欄如圖4-2-12所示。該對話所示。該對話框中各選項的作用如下?？蛑懈鬟x項的作用如下。圖圖4-2-12 “擴展擴展”欄欄“分頁分頁”欄：用來在選定的對象的前面或欄：用來在選定的對象的前面或后面強制加入分頁符。一般瀏覽器均不支后面強制加入分頁符。一般瀏覽器均

42、不支持此項功能。該欄有持此項功能。該欄有“之前之前”和和“之后之后”兩個下拉列表框，其內(nèi)的選項有兩個下拉列表框，其內(nèi)的選項有“自動自動”、“總是總是”、“左對齊左對齊”和和“右對齊右對齊”，它，它們用來確定分頁符的位置。們用來確定分頁符的位置。 “視覺效果視覺效果”欄：利用該欄內(nèi)的下拉列表欄：利用該欄內(nèi)的下拉列表框的選項，可使頁面的顯示效果更好?？虻倪x項，可使頁面的顯示效果更好。 “光標(biāo)光標(biāo)”（即鼠標(biāo)指針）下拉列表框：（即鼠標(biāo)指針）下拉列表框：可以利用該下拉列表框中的選項設(shè)置各種可以利用該下拉列表框中的選項設(shè)置各種鼠標(biāo)的形狀。對于低版本的瀏覽器，不支鼠標(biāo)的形狀。對于低版本的瀏覽器，不支持此項功

43、能。持此項功能。 “過濾器過濾器”下拉列表框：用來對圖像進下拉列表框：用來對圖像進行濾鏡處理，獲得各種特殊的效果。行濾鏡處理，獲得各種特殊的效果。 定義了定義了CSS樣式后，可以將這些樣式后，可以將這些CSS樣式應(yīng)用于網(wǎng)頁中的文本、圖像、樣式應(yīng)用于網(wǎng)頁中的文本、圖像、Flash等等對象。具體的方法如下。對象。具體的方法如下。（1）利用）利用“CSS樣式樣式”面板面板 利用利用“CSS樣式樣式”面板將面板將CSS樣式應(yīng)樣式應(yīng)用于網(wǎng)頁中對象的方法如下。用于網(wǎng)頁中對象的方法如下。選中要應(yīng)用選中要應(yīng)用CSS樣式的對象，可以是文本、樣式的對象，可以是文本、圖像和圖像和Flash等對象。等對象。鼠標(biāo)右鍵單

44、擊鼠標(biāo)右鍵單擊“CSS樣式樣式”面板中相應(yīng)的面板中相應(yīng)的樣式名稱，彈出它的快捷菜單，再單擊該樣式名稱，彈出它的快捷菜單，再單擊該菜單中的菜單中的“套用套用”菜單命令。菜單命令。（2）利用）利用“屬性屬性”欄欄 利用利用“屬性屬性”欄將欄將CSS樣式應(yīng)用于網(wǎng)樣式應(yīng)用于網(wǎng)頁中對象的方法如下。頁中對象的方法如下。 選中要應(yīng)用選中要應(yīng)用CSS樣式的文本對象，在樣式的文本對象，在其其“屬性屬性”欄的欄的“樣式樣式”下拉列表框中選下拉列表框中選擇需要的擇需要的CSS樣式名稱，即可將選中的樣式名稱，即可將選中的CSS樣式應(yīng)用于選中的文本對象。樣式應(yīng)用于選中的文本對象。 選中要應(yīng)用選中要應(yīng)用CSS樣式的圖像或

45、樣式的圖像或Flash等等對象，在其對象，在其“屬性屬性”欄的欄的“類類”下拉列表下拉列表框中選擇需要的框中選擇需要的CSS樣式名稱，即可將選樣式名稱，即可將選中的中的CSS樣式應(yīng)用于選中的圖像或樣式應(yīng)用于選中的圖像或Flash等等對象。對象。4.3.1 學(xué)習(xí)目標(biāo)學(xué)習(xí)目標(biāo) “Word操作演示操作演示”網(wǎng)頁的顯示效果如網(wǎng)頁的顯示效果如圖圖4-3-1所示。所示。Flash是原是原Macromedia公司公司開發(fā)的另一個著名產(chǎn)品，它是一個優(yōu)秀的開發(fā)的另一個著名產(chǎn)品，它是一個優(yōu)秀的矢量繪圖和動畫制作軟件。矢量繪圖和動畫制作軟件。圖圖4-3-1 “Word操作演示操作演示”網(wǎng)頁的顯示效果網(wǎng)頁的顯示效果

46、Flash可以制作出一種擴展名為可以制作出一種擴展名為.swf的的動畫文件，這種文件可以插入到動畫文件，這種文件可以插入到HTML中，中，也可以單獨成為網(wǎng)頁。它不但可以制作出也可以單獨成為網(wǎng)頁。它不但可以制作出一般的動畫，還可以制作出帶有背景聲音，一般的動畫，還可以制作出帶有背景聲音，具有較強的交互性能的動畫。具有較強的交互性能的動畫。 Flash制作的這種動畫可以在所有安裝制作的這種動畫可以在所有安裝了了Shockwave Flash插件的瀏覽器中播放，插件的瀏覽器中播放，這也是它之所以快速廣泛流行的一個重要這也是它之所以快速廣泛流行的一個重要原因。原因。 另外，另外，1998年年Macro

47、media公司公布了公司公布了Flash動畫格式文件的全部代碼，方便了眾動畫格式文件的全部代碼，方便了眾多軟件開發(fā)公司和其設(shè)計人員用它開發(fā)相多軟件開發(fā)公司和其設(shè)計人員用它開發(fā)相關(guān)產(chǎn)品，從而加快了它的推廣與應(yīng)用。各關(guān)產(chǎn)品，從而加快了它的推廣與應(yīng)用。各個公司和個人推出的可以制作個公司和個人推出的可以制作.swf文件的文件的軟件越來越多。軟件越來越多。4.3.2 操作過程操作過程1Flash動畫的動畫的“屬性屬性”欄欄 Flash動畫的動畫的“屬性屬性”欄如圖欄如圖4-3-4所示，所示，前面沒有介紹的各選項的作用如下。前面沒有介紹的各選項的作用如下。圖圖4-3-4 Flash動畫的動畫的“屬性屬性”

48、欄欄“源文件源文件”文本框與文件夾按鈕文本框與文件夾按鈕 ：用：用來選擇來選擇FLA格式的格式的Flash影片源文件。影片源文件。 “編輯編輯”按鈕：單擊它，可以彈出按鈕：單擊它，可以彈出Flash 8，并對，并對Flash文件進行編輯。文件進行編輯。 “重設(shè)大小重設(shè)大小”按鈕：單擊它，可使按鈕：單擊它，可使Flash影片恢復(fù)原大小。影片恢復(fù)原大小?！把h(huán)循環(huán)”復(fù)選框：選中它后，可循環(huán)播放。復(fù)選框：選中它后，可循環(huán)播放。 “自動播放自動播放”復(fù)選框：選中它后，可自復(fù)選框：選中它后，可自動播放。動播放。 “品質(zhì)品質(zhì)”下拉列表框：用來設(shè)置圖像的下拉列表框：用來設(shè)置圖像的質(zhì)量。質(zhì)量。 “比例比例”下

49、拉列表框：用來選擇縮放參下拉列表框：用來選擇縮放參數(shù)。數(shù)?！安迦氩迦隖lash按鈕按鈕”對話框如圖對話框如圖4-3-3所示，所示，其中各選項的含義如下。其中各選項的含義如下。 “范例范例”顯示框：用來顯示所選的顯示框：用來顯示所選的“Flash按鈕按鈕”的效果，這里的顯示效果和的效果，這里的顯示效果和在瀏覽器中的顯示效果相同，并且可以用在瀏覽器中的顯示效果相同，并且可以用鼠標(biāo)測試鼠標(biāo)測試“單擊單擊”時的顯示效果。時的顯示效果。 “樣式樣式”列表框：該列表框中列出所有可列表框：該列表框中列出所有可以使用的以使用的Flash按鈕的樣式，可以從里面選按鈕的樣式，可以從里面選擇相應(yīng)的樣式進行編輯。擇相

50、應(yīng)的樣式進行編輯。 “字體字體”下拉列表框：用來選擇文本的下拉列表框：用來選擇文本的字體。字體。 “大小大小”文本框：設(shè)置顯示文本的大小。文本框：設(shè)置顯示文本的大小?！版溄渔溄印蔽谋究颍涸谖谋究蛑休斎胄枰溛谋究颍涸谖谋究蛑休斎胄枰溄拥奈募夸浐臀募?，也可以單擊接的文件目錄和文件名，也可以單擊“瀏瀏覽覽”按鈕，彈出按鈕，彈出“選擇文件選擇文件”對話框，在對話框，在該對話框中選擇需要鏈接的文件，設(shè)置鏈該對話框中選擇需要鏈接的文件，設(shè)置鏈接。接。 “目標(biāo)目標(biāo)”下拉列表框：用來設(shè)置鏈接的下拉列表框：用來設(shè)置鏈接的網(wǎng)頁的打開方式，其中各選項作用如下：網(wǎng)頁的打開方式，其中各選項作用如下： “背景色背

51、景色”按鈕：用來設(shè)置按鈕：用來設(shè)置Flash按鈕的背按鈕的背景顏色。景顏色。 “另存為另存為”文本框：用來輸入要保存到文本框：用來輸入要保存到的目錄及文件名，或單擊的目錄及文件名，或單擊“瀏覽瀏覽”按鈕，按鈕，彈出彈出“選擇文件選擇文件”對話框，利用它選擇要對話框，利用它選擇要保存的路徑和文件名，默認(rèn)目錄為網(wǎng)頁文保存的路徑和文件名，默認(rèn)目錄為網(wǎng)頁文檔所在的目錄。檔所在的目錄。（1）單擊）單擊“插入插入”（常用）欄中的（常用）欄中的“媒體媒體”快捷菜單中的快捷菜單中的“Flash文本文本”按鈕按鈕 ，彈出，彈出“插入插入Flash文本文本”對對話框，如圖話框，如圖4-3-2所示。所示。（2）在）

52、在“插入插入Flash文本文本”對話框中對話框中進行文字各種屬性的設(shè)置后，在進行文字各種屬性的設(shè)置后，在“文文本本”文本框中輸入文字；在文本框中輸入文字；在“目標(biāo)目標(biāo)”文本框中輸入要鏈接的文件；在文本框中輸入要鏈接的文件；在“另另存為存為”文本框中輸入存儲的文件名稱。文本框中輸入存儲的文件名稱。然后單擊然后單擊“確定確定”按鈕，即可在網(wǎng)頁按鈕，即可在網(wǎng)頁中插入中插入Flash文本。文本。（1）單擊）單擊“插入插入”（常用）欄中的（常用）欄中的“媒體媒體”快捷菜單中的快捷菜單中的“Flash Video”按鈕按鈕 ，彈出，彈出“插入插入Flash視頻視頻”對話框，如圖對話框，如圖4-3-5左圖所

53、示（還沒有左圖所示（還沒有設(shè)置）。設(shè)置）。圖圖4-3-5 “插入插入Flash視頻視頻”對話框設(shè)置對話框設(shè)置（2）在）在“視頻類型視頻類型”下拉列表框內(nèi)選下拉列表框內(nèi)選擇一種下載視頻的類型，選擇擇一種下載視頻的類型，選擇“流視流視頻頻”選項后的選項后的“插入插入Flash視頻視頻”對話對話框如圖框如圖4-3-5右圖所示。此處選擇右圖所示。此處選擇“累累進式下載進式下載”選項。選項。（3）單擊）單擊“URL”欄的欄的“瀏覽瀏覽”按鈕，按鈕，彈出彈出“選擇文件選擇文件”對話框，如圖對話框，如圖4-3-6所示。利用該對話框選擇一個所示。利用該對話框選擇一個Flash視視頻文件（擴展名為頻文件（擴展名

54、為.FLV）。）。圖圖4-3-6 “選擇文件選擇文件”對話框?qū)υ捒颍?）在）在“外觀外觀”下拉列表框內(nèi)選擇下拉列表框內(nèi)選擇一種播放器的樣式。在它下邊的顯示一種播放器的樣式。在它下邊的顯示框內(nèi)可以看到選中的播放器的外觀圖框內(nèi)可以看到選中的播放器的外觀圖像。像。（5）在）在“寬度寬度”和和“高度高度”文本框文本框內(nèi)分別輸入視頻的寬度和高度，單位內(nèi)分別輸入視頻的寬度和高度，單位像素。像素。（6）選中）選中“限制寬高比限制寬高比”、“自動自動播放播放”和和“自動重新播放自動重新播放”復(fù)選框。復(fù)選框。 設(shè)置完后，單擊設(shè)置完后，單擊“確定確定”按鈕，即可按鈕，即可在網(wǎng)頁光標(biāo)處插入一個在網(wǎng)頁光標(biāo)處插入一個F

55、lash視頻，如圖視頻，如圖4-3-7所示。所示。圖圖4-3-7 網(wǎng)頁編輯狀態(tài)下的網(wǎng)頁編輯狀態(tài)下的Flash視頻視頻 在本節(jié)在本節(jié)“操作過程操作過程”中已經(jīng)介紹了一中已經(jīng)介紹了一種插入種插入Flash動畫的方法。另外，采用下述動畫的方法。另外，采用下述方法也可以插入方法也可以插入Flash動畫。動畫。（1）單擊）單擊“插入插入”（常用）欄中的（常用）欄中的“媒體媒體”快捷菜單中的快捷菜單中的“FlashPaper”按鈕按鈕 ，彈出，彈出“插入插入FlashPaper”對對話框，如圖話框，如圖4-3-8所示。所示。圖圖4-3-8 “插入插入FlashPaper”對話框?qū)υ捒颍?）單擊）單擊“瀏覽

56、瀏覽”按鈕，可彈出按鈕，可彈出“選擇文件選擇文件”對話框，如圖對話框，如圖4-3-6所示。所示。在在“選擇文件選擇文件”對話框中選擇要導(dǎo)入對話框中選擇要導(dǎo)入的的SWF文件，單擊文件，單擊“確定確定”按鈕，回按鈕，回到到“插入插入FlashPaper”對話框。對話框。（3）在）在“插入插入FlashPaper”對話框內(nèi)對話框內(nèi)的的2個文本框中輸入高度與寬度數(shù)值，個文本框中輸入高度與寬度數(shù)值，再單擊再單擊“確定確定”按鈕，也可以導(dǎo)入按鈕，也可以導(dǎo)入Flash動畫文件。動畫文件。4.4.1 學(xué)習(xí)目標(biāo)學(xué)習(xí)目標(biāo) “電子市場圖片秀電子市場圖片秀”網(wǎng)頁的顯示效果網(wǎng)頁的顯示效果如圖如圖4-4-1所示。在該網(wǎng)頁

57、中，使用了所示。在該網(wǎng)頁中，使用了Java Applet特效實現(xiàn)網(wǎng)頁中不同圖像的動態(tài)切特效實現(xiàn)網(wǎng)頁中不同圖像的動態(tài)切換效果。換效果。圖圖4-4-1 “電子市場圖片秀電子市場圖片秀”網(wǎng)頁的顯示效果網(wǎng)頁的顯示效果 Java是個面向網(wǎng)絡(luò)的程序設(shè)計語言，是個面向網(wǎng)絡(luò)的程序設(shè)計語言，用來讓程序員創(chuàng)建應(yīng)用程序，用它可以編用來讓程序員創(chuàng)建應(yīng)用程序，用它可以編寫許多動人的動畫，在寫許多動人的動畫，在Internet上應(yīng)用。這上應(yīng)用。這些應(yīng)用程序可以通過網(wǎng)絡(luò)下載，而且可在些應(yīng)用程序可以通過網(wǎng)絡(luò)下載，而且可在任何計算平臺上安全地運行。如果再加上任何計算平臺上安全地運行。如果再加上萬維網(wǎng)和公司內(nèi)部網(wǎng)體系，將會擁有一

58、個萬維網(wǎng)和公司內(nèi)部網(wǎng)體系，將會擁有一個標(biāo)準(zhǔn)的網(wǎng)絡(luò)計算環(huán)境。標(biāo)準(zhǔn)的網(wǎng)絡(luò)計算環(huán)境。 Java作為一個分布式的、面向?qū)ο蟮淖鳛橐粋€分布式的、面向?qū)ο蟮某绦蛟O(shè)計語言，可以讓位于任何地方的任程序設(shè)計語言，可以讓位于任何地方的任何計算機應(yīng)用網(wǎng)絡(luò)上的應(yīng)用程序。何計算機應(yīng)用網(wǎng)絡(luò)上的應(yīng)用程序。4.4.2 操作過程操作過程1插入插入Java Applet Applet是是Java的小型應(yīng)用程序。的小型應(yīng)用程序。Java Applet可以嵌入到可以嵌入到HTML程序中，通過主程序中，通過主頁發(fā)布到頁發(fā)布到Internet上?？梢詮木W(wǎng)上下載上?？梢詮木W(wǎng)上下載Java Applet程序文件及有關(guān)文件，存放在本地程序文件

59、及有關(guān)文件，存放在本地站點的一個子目錄下。站點的一個子目錄下。（1）插入）插入Applet的方法的方法 單擊單擊“插入插入”（常用）面板中的（常用）面板中的“媒體媒體”快捷菜單中的快捷菜單中的“Applet”按按鈕鈕 ，即可彈出，即可彈出“選擇文件選擇文件”對話框。對話框。利用該對話框可以調(diào)入擴展名為利用該對話框可以調(diào)入擴展名為“.class”的的Java Applet程序文件。程序文件。 使用使用Java Applet程序時應(yīng)閱讀程序時應(yīng)閱讀Java Applet程序作者給出的說明，再按照說明程序作者給出的說明，再按照說明進行操作。進行操作。 插入文件后，網(wǎng)頁文檔窗口內(nèi)會顯示插入文件后，網(wǎng)頁文檔窗口內(nèi)會顯示一個一個Java Applet圖標(biāo)。單擊選中它后，可圖標(biāo)。單擊選中它后，可以用鼠標(biāo)拖曳插件圖標(biāo)的黑色控制柄，來以用鼠標(biāo)拖曳插件圖標(biāo)的黑色控制柄，來調(diào)整它