網(wǎng)站建設(shè)與管理之簡單網(wǎng)頁設(shè)計

1、網(wǎng)站建設(shè)與管理之簡單網(wǎng)頁設(shè)計內(nèi)容提要內(nèi)容提要 4.1 插入文本插入文本 4.2 格式化文本格式化文本 4.3 項目列表的應(yīng)用項目列表的應(yīng)用 4.4 標尺和網(wǎng)格標尺和網(wǎng)格 4.5 在網(wǎng)頁中添加圖像在網(wǎng)頁中添加圖像 4.6 創(chuàng)建超級鏈接創(chuàng)建超級鏈接 4.7 插入多媒體插入多媒體4.1 插入文本插入文本 插入普通文本插入普通文本 插入特殊字符插入特殊字符 在字符之間添加空格在字符之間添加空格 插入其他文本插入其他文本插入普通文本插入普通文本 將插入點定位在文檔編輯區(qū)中，直接輸入將插入點定位在文檔編輯區(qū)中，直接輸入文本即可。文本即可。 在在Word等文本編輯軟件中編輯好文本之后，等文本編輯軟件中編輯好

2、文本之后，將其復(fù)制到剪貼板上，然后在將其復(fù)制到剪貼板上，然后在Dreamweaver 8中將插入點定位到文檔編中將插入點定位到文檔編輯區(qū)中，粘貼剪貼板中的文本亦可。輯區(qū)中，粘貼剪貼板中的文本亦可。插入特殊字符插入特殊字符 在在Dreamweaver 8中編輯文本時，中編輯文本時，往往會遇到一些無往往會遇到一些無法通過鍵盤直接輸法通過鍵盤直接輸入的特殊字符，如入的特殊字符，如版權(quán)符號版權(quán)符號、注冊、注冊商標符號商標符號等，這等，這時可通過插入特殊時可通過插入特殊字符的功能進行插字符的功能進行插入。入。在字符之間添加空格在字符之間添加空格 Dreamweaver 8中的文檔格式都是以中的文檔格式都

3、是以HTML編碼形式存在的編碼形式存在的，而，而HTML編碼中只編碼中只允許字符之間包含一個空格允許字符之間包含一個空格，所以在，所以在Dreamweaver 8中無論按多少次空格鍵都中無論按多少次空格鍵都只會輸入一個空格。只會輸入一個空格。 Ctrl+Shift+空格空格 可以插入空格可以插入空格插入水平線插入水平線 在文檔編輯區(qū)將插入點定位到所需位置，選擇在文檔編輯區(qū)將插入點定位到所需位置，選擇插插入入 HTML 水平線水平線菜單命令或單擊菜單命令或單擊“插入插入”欄欄中的中的“HTML”選項卡在其中單擊選項卡在其中單擊 按鈕即可添加按鈕即可添加水平線。水平線。修改水平線修改水平線 初始繪

4、制的水平線的格式往往不能滿足實初始繪制的水平線的格式往往不能滿足實際需要，此時可通過屬性面板對其進行修際需要，此時可通過屬性面板對其進行修改。改。插入日期插入日期 在制作網(wǎng)頁時，有時需要插入當(dāng)前的日期，在制作網(wǎng)頁時，有時需要插入當(dāng)前的日期，Dreamweaver 8提供了快速插入日期和時提供了快速插入日期和時間的功能。間的功能。4.2 格式化文本格式化文本設(shè)置字體外觀設(shè)置字體外觀 設(shè)置字體大小設(shè)置字體大小 設(shè)置顏色設(shè)置顏色 設(shè)置字體樣式設(shè)置字體樣式 設(shè)置對齊方式設(shè)置對齊方式 設(shè)置標題格式設(shè)置標題格式 設(shè)置樣式設(shè)置樣式設(shè)置字體外觀設(shè)置字體外觀 用戶也可對屬性面板的用戶也可對屬性面板的“字體字體”

5、下拉列表下拉列表框中的字體列表重新編輯。框中的字體列表重新編輯。設(shè)置字體大小設(shè)置字體大小 在屬性面板的在屬性面板的“大小大小”下拉列表框中選擇下拉列表框中選擇相應(yīng)的選項，并選擇其后的相應(yīng)的選項，并選擇其后的“單位單位”下拉下拉列表框中相應(yīng)的單位選項，即可設(shè)置所選列表框中相應(yīng)的單位選項，即可設(shè)置所選文本的字體大小。文本的字體大小。 字體的度量單位有像素（字體的度量單位有像素（px）、厘米（）、厘米（cm）等，可根據(jù)具體情況進行選擇，但一般都等，可根據(jù)具體情況進行選擇，但一般都以像素為單位。以像素為單位。 設(shè)置顏色設(shè)置顏色 單擊屬性面板中的單擊屬性面板中的 按鈕，在彈出的顏色按鈕，在彈出的顏色列表

6、框中選擇相應(yīng)的選項可設(shè)置所選文本列表框中選擇相應(yīng)的選項可設(shè)置所選文本的字體顏色，在其后的文本框中可直接輸?shù)淖煮w顏色，在其后的文本框中可直接輸入顏色的英文名（如入顏色的英文名（如Red、Green等）或以等）或以“#”開頭的十六進制顏色代碼（如開頭的十六進制顏色代碼（如#ff0000、00ff00）設(shè)置所選文本的顏色。）設(shè)置所選文本的顏色。設(shè)置字體樣式設(shè)置字體樣式粗體粗體 根據(jù)在根據(jù)在“首選參數(shù)首選參數(shù)”對話框的對話框的“常規(guī)常規(guī)”選選項中設(shè)置的樣式參數(shù)選擇，將項中設(shè)置的樣式參數(shù)選擇，將或或標簽應(yīng)用于選定的文本，即對所選文本加粗。標簽應(yīng)用于選定的文本，即對所選文本加粗。單擊按鈕即可設(shè)置單擊按鈕即

7、可設(shè)置“加粗加粗”設(shè)置，再次單擊按設(shè)置，再次單擊按鈕可取消鈕可取消“加粗加粗”設(shè)置。設(shè)置。斜體斜體 根據(jù)在根據(jù)在“首選參數(shù)首選參數(shù)”對話框的對話框的“常規(guī)常規(guī)”選選項中設(shè)置的樣式參數(shù)選擇，將項中設(shè)置的樣式參數(shù)選擇，將或或標簽標簽應(yīng)用于選定的文本，即對所選文本進行傾斜設(shè)應(yīng)用于選定的文本，即對所選文本進行傾斜設(shè)置。選中按鈕即可將所選的文本應(yīng)用置。選中按鈕即可將所選的文本應(yīng)用“傾斜傾斜”。再次單擊按鈕可取消再次單擊按鈕可取消“傾斜傾斜”設(shè)置。設(shè)置。設(shè)置對齊方式設(shè)置對齊方式 通過屬性面板中的通過屬性面板中的“左對齊左對齊”按鈕、按鈕、“居中對齊居中對齊”按鈕、按鈕、“右對齊右對齊”按鈕和按鈕和“兩端對

8、齊兩端對齊”按鈕可設(shè)按鈕可設(shè)置文本的對齊方式。置文本的對齊方式。設(shè)置標題格式設(shè)置標題格式 在屬性欄的在屬性欄的“格式格式”下拉列表框中可設(shè)置標題下拉列表框中可設(shè)置標題格式，其中格式，其中“段落段落”是應(yīng)用是應(yīng)用標簽的默認格標簽的默認格式，式，“標題標題 1”選項應(yīng)用選項應(yīng)用標簽，設(shè)置該選標簽，設(shè)置該選項可以將所選的文本設(shè)置成各種標題。標題號項可以將所選的文本設(shè)置成各種標題。標題號越小，字體越大。越小，字體越大。設(shè)置樣式設(shè)置樣式 屬性面板中的屬性面板中的“樣式樣式”下拉列表框可用于下拉列表框可用于顯示當(dāng)前應(yīng)用于所選文本的樣式。顯示當(dāng)前應(yīng)用于所選文本的樣式。4.3 項目列表的應(yīng)用項目列表的應(yīng)用有序

9、列表有序列表無序列表無序列表定義列表定義列表 為現(xiàn)有文本創(chuàng)建列表為現(xiàn)有文本創(chuàng)建列表 創(chuàng)建嵌套列表創(chuàng)建嵌套列表 設(shè)置項目列表屬性設(shè)置項目列表屬性有序列表有序列表 有序列表又稱為編號列表，是有一定排列有序列表又稱為編號列表，是有一定排列順序的列表，一般前面有數(shù)字前導(dǎo)字符，順序的列表，一般前面有數(shù)字前導(dǎo)字符，其中前導(dǎo)字符可以是阿拉伯?dāng)?shù)字、英文字其中前導(dǎo)字符可以是阿拉伯?dāng)?shù)字、英文字母或羅馬數(shù)字等。母或羅馬數(shù)字等。 無序列表無序列表 無序列表又稱為項目列表，是一系列無順無序列表又稱為項目列表，是一系列無順序級別關(guān)系的項目文本組成的列表，一般序級別關(guān)系的項目文本組成的列表，一般前面是用項目符號作為前導(dǎo)字符

10、。前面是用項目符號作為前導(dǎo)字符。定義列表定義列表 定義列表不使用項目符號或數(shù)字這樣的前定義列表不使用項目符號或數(shù)字這樣的前導(dǎo)字符，通常用在詞匯表或說明書中導(dǎo)字符，通常用在詞匯表或說明書中為現(xiàn)有文本創(chuàng)建列表為現(xiàn)有文本創(chuàng)建列表 除了先創(chuàng)建列表項再輸入文本外，還除了先創(chuàng)建列表項再輸入文本外，還可以先輸入文本，然后再設(shè)置列表項?？梢韵容斎胛谋荆缓笤僭O(shè)置列表項。創(chuàng)建嵌套列表創(chuàng)建嵌套列表 嵌套列表是包含在其他列表中的列表嵌套列表是包含在其他列表中的列表設(shè)置項目列表屬性設(shè)置項目列表屬性 使用使用“列表屬性列表屬性”對話框可以設(shè)置列表項對話框可以設(shè)置列表項的外觀，包括編號樣式、項目符號樣式等。的外觀，包括編

11、號樣式、項目符號樣式等。標尺和網(wǎng)格標尺和網(wǎng)格 標尺分為水平標尺和垂直標尺，分別顯示在標尺分為水平標尺和垂直標尺，分別顯示在Dreamweaver 8文檔編輯區(qū)的上方和左側(cè)。標尺文檔編輯區(qū)的上方和左側(cè)。標尺的單位包括像素、厘米和英寸，在默認狀態(tài)下使的單位包括像素、厘米和英寸，在默認狀態(tài)下使用像素為單位。用像素為單位。網(wǎng)格網(wǎng)格 網(wǎng)格與標尺都是定位工具，但在網(wǎng)頁布局網(wǎng)格與標尺都是定位工具，但在網(wǎng)頁布局中使用網(wǎng)格更方便。文檔編輯區(qū)中顯示了中使用網(wǎng)格更方便。文檔編輯區(qū)中顯示了網(wǎng)格后，就可以對網(wǎng)頁元素進行準確的定網(wǎng)格后，就可以對網(wǎng)頁元素進行準確的定位了。位了。4.5 在網(wǎng)頁中添加圖像在網(wǎng)頁中添加圖像 網(wǎng)頁

12、圖像的格式及來源網(wǎng)頁圖像的格式及來源 插入圖像插入圖像 設(shè)置圖像屬性設(shè)置圖像屬性 圖像高級設(shè)置圖像高級設(shè)置網(wǎng)頁圖像的格式及來源網(wǎng)頁圖像的格式及來源 GIF格式格式 JPEG格式格式 PNG格式格式 網(wǎng)頁圖像來源網(wǎng)頁圖像來源GIF格式格式 GIF全稱為全稱為“Graphics Interchange Format”，意為可交換圖像格式，它是第一個支持網(wǎng)頁的圖意為可交換圖像格式，它是第一個支持網(wǎng)頁的圖像格式，在像格式，在PC機和蘋果機上都能被正確識別。機和蘋果機上都能被正確識別。 GIF文件占用空間小，最多支持文件占用空間小，最多支持256種顏色。種顏色。GIF圖像可以在網(wǎng)頁中以透明方式顯示，還可

13、以包含圖像可以在網(wǎng)頁中以透明方式顯示，還可以包含動態(tài)信息，即動態(tài)信息，即GIF動畫。動畫。JPEG格式格式 JPEG全稱為全稱為“Joint Photographic Experts Group”，意為聯(lián)合圖像專家組，意為聯(lián)合圖像專家組，它可以高效地壓縮圖片，丟失人眼不易察它可以高效地壓縮圖片，丟失人眼不易察覺的部分圖像，使文件容量在變小的同時覺的部分圖像，使文件容量在變小的同時基本不失真，通常用來顯示顏色豐富的精基本不失真，通常用來顯示顏色豐富的精美圖像。美圖像。PNG格式格式 PNG全稱為全稱為“Portable Network Graphics”，意為便攜網(wǎng)絡(luò)圖像，它是逐，意為便攜網(wǎng)絡(luò)圖

14、像，它是逐漸流行的網(wǎng)絡(luò)圖像格式。漸流行的網(wǎng)絡(luò)圖像格式。PNG格式既融合格式既融合了了GIF能透明顯示的特點，又具有能透明顯示的特點，又具有JPEG處處理精美圖像的優(yōu)勢，且可以包含圖層等信理精美圖像的優(yōu)勢，且可以包含圖層等信息，常常用于制作網(wǎng)頁效果圖。息，常常用于制作網(wǎng)頁效果圖。網(wǎng)頁圖像來源網(wǎng)頁圖像來源 網(wǎng)頁圖像的素材有很多來源，如可以使用網(wǎng)頁圖像的素材有很多來源，如可以使用圖形處理軟件（如圖形處理軟件（如Photoshop、Fireworks和和FreeHand等軟件）制作；可等軟件）制作；可以購買網(wǎng)頁素材光盤；可以從網(wǎng)絡(luò)上下載以購買網(wǎng)頁素材光盤；可以從網(wǎng)絡(luò)上下載等。等。插入圖像插入圖像 直接

15、插入直接插入 占位符插入占位符插入 圖像的放大顯示圖像的放大顯示直接插入直接插入 選擇選擇插入插入 圖像圖像菜單命令。菜單命令。 單擊插入欄的單擊插入欄的“常用常用”選項卡中的按鈕。選項卡中的按鈕。 按按【Ctrl+Alt+I】鍵。鍵。占位符插入占位符插入 制作網(wǎng)頁時還未選定需插入的圖像，但確制作網(wǎng)頁時還未選定需插入的圖像，但確定了圖像大小的時候，可以使用占位符來定了圖像大小的時候，可以使用占位符來代替圖像的方式插入到文檔中。代替圖像的方式插入到文檔中。 將圖像確定后雙擊占位符，在打開的對話將圖像確定后雙擊占位符，在打開的對話框中設(shè)置后插入即可?？蛑性O(shè)置后插入即可。圖像的放大顯示圖像的放大顯示

16、 Dreamweaver 8新增的放大鏡功能可以讓新增的放大鏡功能可以讓用戶更方便地進行對齊圖像、選擇較小的用戶更方便地進行對齊圖像、選擇較小的對象以及查看較小的文本、動畫或網(wǎng)頁元對象以及查看較小的文本、動畫或網(wǎng)頁元素等操作。素等操作。設(shè)置圖像屬性設(shè)置圖像屬性 在網(wǎng)頁中插入圖像后可通過屬性面板對其屬性在網(wǎng)頁中插入圖像后可通過屬性面板對其屬性進行修改等設(shè)置。進行修改等設(shè)置。圖像命名 圖像大小 編輯圖片 源文件設(shè)置 文本說明 圖像與文本的對齊 圖像邊距 圖像邊框 圖像命名圖像命名 為了在使用為了在使用Dreamweaver行為（如交換圖行為（如交換圖像）或腳本撰寫語言（如像）或腳本撰寫語言（如Ja

17、vaScript或或VBScript）時可以引用該圖像，可在屬性）時可以引用該圖像，可在屬性面板的面板的“圖像圖像”文本框中為圖像命名。文本框中為圖像命名。圖像大小圖像大小 在在Dreamweaver 8中插入圖像后系統(tǒng)會自中插入圖像后系統(tǒng)會自動將圖像的原始大小顯示在動將圖像的原始大小顯示在“寬寬”和和“高高”文本框（以像素為單位）中。文本框（以像素為單位）中。編輯圖片編輯圖片 在網(wǎng)頁中選擇圖像之在網(wǎng)頁中選擇圖像之后，單擊屬性面板中后，單擊屬性面板中的按鈕，打開圖像處的按鈕，打開圖像處理軟件，對圖像進行理軟件，對圖像進行處理。如果安裝了處理。如果安裝了Fireworks，那么，那么Firewo

18、rks將被默認為將被默認為圖像處理軟件。如果圖像處理軟件。如果沒有安裝，用戶也可沒有安裝，用戶也可自己設(shè)置使用其他軟自己設(shè)置使用其他軟件中處理圖像件中處理圖像源文件設(shè)置源文件設(shè)置 在屬性面板的在屬性面板的“源文件源文件”文本框中顯示了文本框中顯示了圖像的保存路徑，如果要重新插入一幅新圖像的保存路徑，如果要重新插入一幅新圖像，可以在選取圖像后的屬性面板中的圖像，可以在選取圖像后的屬性面板中的“源文件源文件”文本框中重新輸入要插入圖像文本框中重新輸入要插入圖像的地址，或單擊右側(cè)后的的地址，或單擊右側(cè)后的 按鈕，在打開按鈕，在打開的的“選擇圖像源文件選擇圖像源文件”對話框中重新選擇對話框中重新選擇需

19、要的圖像。需要的圖像。文本說明文本說明 在選取圖像后的屬性面板的在選取圖像后的屬性面板的“替換替換”下拉下拉列表框中可以輸入圖像的文本說明。列表框中可以輸入圖像的文本說明。圖像與文本的對齊圖像與文本的對齊 選取圖像后，在屬性面板的選取圖像后，在屬性面板的“對齊對齊”下拉下拉列表框中可設(shè)置處于同一行上的圖像與文列表框中可設(shè)置處于同一行上的圖像與文本的對齊方式。本的對齊方式。圖像邊距圖像邊距 選取圖像在屬性面板的選取圖像在屬性面板的“垂直邊距垂直邊距”和和“水平邊距水平邊距”文本框中可以設(shè)置圖像與頁文本框中可以設(shè)置圖像與頁面上方和左側(cè)之間的距離，也可以設(shè)置圖面上方和左側(cè)之間的距離，也可以設(shè)置圖像與

20、其他網(wǎng)頁元素之間的距離。像與其他網(wǎng)頁元素之間的距離。圖像邊框圖像邊框 選取圖像后，在屬性面板的選取圖像后，在屬性面板的“邊框邊框”文本文本框中可以設(shè)置圖像邊框的寬度，單位為像框中可以設(shè)置圖像邊框的寬度，單位為像素，素，“0”表示無邊框。表示無邊框。圖像高級設(shè)置圖像高級設(shè)置 鼠標經(jīng)過圖像設(shè)置鼠標經(jīng)過圖像設(shè)置 插入插入Fireworks HTML對象對象鼠標經(jīng)過圖像設(shè)置鼠標經(jīng)過圖像設(shè)置 鼠標經(jīng)過圖像是一種在瀏覽器中查看網(wǎng)頁鼠標經(jīng)過圖像是一種在瀏覽器中查看網(wǎng)頁時，鼠標光標經(jīng)過該圖像時，圖像發(fā)生變時，鼠標光標經(jīng)過該圖像時，圖像發(fā)生變化的動態(tài)圖像?；膭討B(tài)圖像。插入插入Fireworks HTML對象對

21、象 Macromedia公司的圖形處理軟件公司的圖形處理軟件Fireworks優(yōu)化后的圖像和優(yōu)化后的圖像和HTML文件。使文件。使用用Dreamweaver可直接插入保存到所需的可直接插入保存到所需的Dreamweaver站點文件夾中。站點文件夾中。4.6 創(chuàng)建超級鏈接創(chuàng)建超級鏈接 創(chuàng)建文本超級鏈接創(chuàng)建文本超級鏈接 創(chuàng)建錨鏈接創(chuàng)建錨鏈接 創(chuàng)建空鏈接創(chuàng)建空鏈接 創(chuàng)建電子郵件超級鏈接創(chuàng)建電子郵件超級鏈接 創(chuàng)建圖像超級鏈接創(chuàng)建圖像超級鏈接 創(chuàng)建導(dǎo)航條創(chuàng)建導(dǎo)航條創(chuàng)建文本超級鏈接創(chuàng)建文本超級鏈接 文本超級鏈接是最常見的超級鏈接，通過文本超級鏈接是最常見的超級鏈接，通過使用鼠標點擊文本即可從一個網(wǎng)頁跳轉(zhuǎn)到

22、使用鼠標點擊文本即可從一個網(wǎng)頁跳轉(zhuǎn)到另一個網(wǎng)頁。另一個網(wǎng)頁。創(chuàng)建錨鏈接創(chuàng)建錨鏈接 創(chuàng)建命名錨記創(chuàng)建命名錨記 鏈接命名錨記鏈接命名錨記創(chuàng)建命名錨記創(chuàng)建命名錨記 在制作網(wǎng)頁時，為了達到跳轉(zhuǎn)到網(wǎng)頁固定位置的在制作網(wǎng)頁時，為了達到跳轉(zhuǎn)到網(wǎng)頁固定位置的目的，可以使用錨鏈接。通過對網(wǎng)頁中指定位置目的，可以使用錨鏈接。通過對網(wǎng)頁中指定位置的命名，利用超級鏈接打開目標網(wǎng)頁時可直接跳的命名，利用超級鏈接打開目標網(wǎng)頁時可直接跳轉(zhuǎn)到相應(yīng)的命名位置上。轉(zhuǎn)到相應(yīng)的命名位置上。鏈接命名錨記鏈接命名錨記 創(chuàng)建好錨記之后，必須創(chuàng)建對應(yīng)的超級鏈創(chuàng)建好錨記之后，必須創(chuàng)建對應(yīng)的超級鏈接源端點。接源端點。創(chuàng)建空鏈接創(chuàng)建空鏈接 要想對

23、文本設(shè)置行為，首先必須為文本建立空超要想對文本設(shè)置行為，首先必須為文本建立空超級鏈接（空超級鏈接是一個未指派目標的超級鏈級鏈接（空超級鏈接是一個未指派目標的超級鏈接），這樣行為才會有效。接），這樣行為才會有效。 為文本建立空超級鏈接時，只要先在文檔窗口中為文本建立空超級鏈接時，只要先在文檔窗口中選中需要建立空超級鏈接的文本，然后在屬性面選中需要建立空超級鏈接的文本，然后在屬性面板的板的“鏈接鏈接”文本框中輸入一個文本框中輸入一個“#”符號即可。符號即可。建立空超級鏈接的目的只是為了應(yīng)用行為，其他建立空超級鏈接的目的只是為了應(yīng)用行為，其他情況下不必建立。情況下不必建立。創(chuàng)建電子郵件超級鏈接創(chuàng)建電

24、子郵件超級鏈接 電子郵件在網(wǎng)絡(luò)應(yīng)用中十分廣泛，在網(wǎng)頁電子郵件在網(wǎng)絡(luò)應(yīng)用中十分廣泛，在網(wǎng)頁中建立電子郵件超級鏈接可方便網(wǎng)頁瀏覽中建立電子郵件超級鏈接可方便網(wǎng)頁瀏覽者與設(shè)計者之間的聯(lián)系。者與設(shè)計者之間的聯(lián)系。創(chuàng)建圖像超級鏈接創(chuàng)建圖像超級鏈接 為一般圖像創(chuàng)建超級鏈接為一般圖像創(chuàng)建超級鏈接 創(chuàng)建圖像熱點超級鏈接創(chuàng)建圖像熱點超級鏈接為一般圖像創(chuàng)建超級鏈接為一般圖像創(chuàng)建超級鏈接創(chuàng)建圖像熱點超級鏈接創(chuàng)建圖像熱點超級鏈接 要在一幅比較大的圖片中添加許多超級鏈接時，要在一幅比較大的圖片中添加許多超級鏈接時，應(yīng)該將圖片化整為零，分割成較小的圖片，然后應(yīng)該將圖片化整為零，分割成較小的圖片，然后分別為這些小圖像上建立

25、超級鏈接來達到目的，分別為這些小圖像上建立超級鏈接來達到目的，但這時整幅圖片就不能對齊，利用但這時整幅圖片就不能對齊，利用Dreamweaver 8的圖像熱點超級鏈接功能就能避免這個問題。的圖像熱點超級鏈接功能就能避免這個問題。創(chuàng)建導(dǎo)航條創(chuàng)建導(dǎo)航條 插入導(dǎo)航條插入導(dǎo)航條 編輯導(dǎo)航條編輯導(dǎo)航條插入導(dǎo)航條插入導(dǎo)航條 導(dǎo)航條一般由圖像或圖像組組成，這些圖導(dǎo)航條一般由圖像或圖像組組成，這些圖像的顯示內(nèi)容隨用戶的操作不同而進行相像的顯示內(nèi)容隨用戶的操作不同而進行相應(yīng)的變化。導(dǎo)航條為訪問者瀏覽不同網(wǎng)頁應(yīng)的變化。導(dǎo)航條為訪問者瀏覽不同網(wǎng)頁提供了一條捷徑。提供了一條捷徑。編輯導(dǎo)航條編輯導(dǎo)航條上機實戰(zhàn)上機實戰(zhàn)

26、制作如下圖所示導(dǎo)航條。制作如下圖所示導(dǎo)航條。4.7 插入多媒體插入多媒體 （1）插入）插入Flash對象對象 （2）插入音頻文件）插入音頻文件 （3）插入視頻文件）插入視頻文件 （4）插入）插入Java Applet插入插入flash對象對象 插入插入Flash動畫動畫 插入插入Flash文本文本 圖像查看器圖像查看器 插入插入Flash按鈕按鈕 插入插入Flashpaper 插入插入Flash視頻視頻 插入插入flash動畫動畫p 在在Dreamweaver中，可以直接插入發(fā)布后的中，可以直接插入發(fā)布后的Flash動畫，動畫，其具體操作步驟如下：其具體操作步驟如下：p （1）將光標定位在要插

27、入將光標定位在要插入flash動畫的位置動畫的位置p （2）選擇選擇“插入插入”|“媒體媒體”|“flash”命令，或單擊命令，或單擊“常常用用”工具欄工具欄 按鈕，在彈出的下拉菜單中選擇按鈕，在彈出的下拉菜單中選擇flash命令，彈命令，彈出出“選擇文件選擇文件”對話框。對話框。p （3）在在“查找范圍查找范圍”下拉列表框中選擇需要插入的下拉列表框中選擇需要插入的flash動畫文件。動畫文件。p （4）單擊確定按鈕，會在網(wǎng)頁中出現(xiàn)單擊確定按鈕，會在網(wǎng)頁中出現(xiàn)flash標志。如果標志。如果插入的插入的flash文件不在站點文件夾下，系統(tǒng)會提示復(fù)制該文件不在站點文件夾下，系統(tǒng)會提示復(fù)制該flas

28、h文件到站點文件夾下。文件到站點文件夾下。插入插入flash動畫動畫p（5）選擇插入到網(wǎng)頁中的）選擇插入到網(wǎng)頁中的flash動畫元件，可以在動畫元件，可以在“屬性屬性”面板中設(shè)置它的高度和寬度。可以點擊面板中設(shè)置它的高度和寬度?？梢渣c擊“屬屬性性”面板上的面板上的“播放播放”按鈕來預(yù)覽效果。按鈕來預(yù)覽效果。p（6）其他屬性設(shè)置為寬和高：用于以像素為單位指）其他屬性設(shè)置為寬和高：用于以像素為單位指定定Flash對象的寬度和高度。因為對象的寬度和高度。因為Flash使用的是矢使用的是矢量圖形，所以改變高度和寬度時不會影響動畫的質(zhì)量。量圖形，所以改變高度和寬度時不會影響動畫的質(zhì)量。還可以指定英寸、毫

29、米、厘米等等單位。還可以指定英寸、毫米、厘米等等單位。插入插入flash動畫動畫文件：顯示文件：顯示Flash文件的路徑。單擊后面的瀏覽按鈕可以指定新的動文件的路徑。單擊后面的瀏覽按鈕可以指定新的動畫文件。畫文件。編輯：此按鈕用于啟動編輯：此按鈕用于啟動Macromedia Flash MX以編輯以編輯Flash文件。如文件。如果計算機上沒有加載果計算機上沒有加載Macromedia Flash MX，此按鈕將被禁用。，此按鈕將被禁用。重設(shè)大?。夯謴?fù)到重設(shè)大?。夯謴?fù)到Flash文件默認尺寸。文件默認尺寸。自動播放：選中后自動播放：選中后Flash電影會自動播放。電影會自動播放。垂直邊距與水平邊

30、距：設(shè)置垂直邊距與水平邊距：設(shè)置Flash文件垂直與水平方向上的空白區(qū)域。文件垂直與水平方向上的空白區(qū)域。品質(zhì)：此下拉列表框用于在對象播放期間控制抗失真。設(shè)置越高，效品質(zhì)：此下拉列表框用于在對象播放期間控制抗失真。設(shè)置越高，效果越好。果越好。比例：此下拉列表框用于指定對象如何在設(shè)置好的寬度和高度尺寸下比例：此下拉列表框用于指定對象如何在設(shè)置好的寬度和高度尺寸下顯示。顯示。 “默認值默認值”設(shè)置顯示整個對象。設(shè)置顯示整個對象。對齊：此下拉列表框用于指定對象在頁面上的對齊方式。對齊：此下拉列表框用于指定對象在頁面上的對齊方式。背景顏色：用于指定對象的背景顏色。背景顏色：用于指定對象的背景顏色。參數(shù)

31、：可設(shè)定參數(shù)：可設(shè)定ActiveX參數(shù)，這些參數(shù)用于參數(shù)，這些參數(shù)用于ActiveX控件之間的數(shù)據(jù)控件之間的數(shù)據(jù)交換。交換。 插入插入flash文本文本p 用戶如果希望制作一個有用戶如果希望制作一個有Flash動畫效果的文字。在動畫效果的文字。在Dreamweaver中很容易實現(xiàn)。將光標放在要插入中很容易實現(xiàn)。將光標放在要插入Flash文字的位文字的位置，然后在置，然后在“常用常用”插入工具欄中單擊插入工具欄中單擊“媒體媒體”按鈕旁的下拉按按鈕旁的下拉按鈕，在打開的鈕，在打開的“媒體媒體”下拉列表中選擇下拉列表中選擇“Flash文本文本”。此時將打。此時將打開開“插入插入Flash文本文本”對

32、話框。對話框。 圖像查看器圖像查看器p選擇選擇“插入插入”菜單菜單|“媒體媒體”|“圖像查看器圖像查看器”，可以自動創(chuàng)建一個用于瀏覽多幅圖像的可以自動創(chuàng)建一個用于瀏覽多幅圖像的Flash動畫。動畫。插入插入Flash按鈕按鈕 在編輯的文檔中如要插入在編輯的文檔中如要插入Flash按鈕，先將光標放在要插按鈕，先將光標放在要插入的位置上，然后在入的位置上，然后在“常用常用”插入工具欄中單擊媒體按鈕插入工具欄中單擊媒體按鈕旁的下拉按鈕，在打開的媒體下拉列表中選擇旁的下拉按鈕，在打開的媒體下拉列表中選擇“Flash按按鈕鈕“。 插入插入Flashpaper Flashpaper是一種特殊的是一種特殊的

33、Flash動畫文件，可以通過動畫文件，可以通過Flashpaper軟件制作，安裝軟件制作，安裝Flashpaper后，系統(tǒng)會自動后，系統(tǒng)會自動增加一個名為增加一個名為Macromedia Flashpaper的打印機，在任的打印機，在任意軟件中使用該打印機進行打印，即可制作出一個意軟件中使用該打印機進行打印，即可制作出一個Flashpaper文檔，這樣就可以輕松地將文檔，這樣就可以輕松地將Word 、AutoCAD等文檔或圖象的內(nèi)容添加到網(wǎng)頁中了。等文檔或圖象的內(nèi)容添加到網(wǎng)頁中了。 利用插入利用插入Flashpaper功能可以在網(wǎng)頁中插入功能可以在網(wǎng)頁中插入Macromedia Flashpa

34、per文檔，這樣在瀏覽器中打開包含文檔，這樣在瀏覽器中打開包含F(xiàn)lashpaper文檔的頁面時，用戶就可以瀏覽文檔的頁面時，用戶就可以瀏覽Flashpaper文檔中所有文檔中所有的頁面信息，而無須加載新的網(wǎng)頁。同時用戶也可以搜索、的頁面信息，而無須加載新的網(wǎng)頁。同時用戶也可以搜索、打印和縮放該文檔。打印和縮放該文檔。 插入插入Flashpaper將光標定位到插入將光標定位到插入Flashpaper的位置。的位置。選擇選擇“插入插入”|“媒體媒體”|“Flashpaper”命令，或命令，或單擊單擊“常用常用”工具欄中工具欄中”媒體媒體”按鈕下的按鈕下的“Flashpaper”命令，彈出命令，彈出

35、“插入插入Flashpaper”對話框。對話框。單擊單擊“源源”文本框后的文本框后的“瀏覽瀏覽”按鈕，在彈出按鈕，在彈出的的“選擇文件選擇文件”對話框中選擇要顯示的對話框中選擇要顯示的Flashpaper文檔。文檔。在在“寬度寬度”和和“高度高度”文本框中輸入文本框中輸入Flashpaper文檔在網(wǎng)頁中顯示范圍的寬度和高文檔在網(wǎng)頁中顯示范圍的寬度和高度，單擊確定按鈕即可插入度，單擊確定按鈕即可插入Flashpaper文件。文件。插入插入FlashVideo FLV流媒體格式是一種新的視頻格式，全稱為流媒體格式是一種新的視頻格式，全稱為Flash Video。Flash Video只能播放只能播

36、放*.flv格式的格式的視頻文件，若是其他格式的文件可以通過視頻文件，若是其他格式的文件可以通過Macromedia Flash8 Video Encoder將其轉(zhuǎn)換為將其轉(zhuǎn)換為*.flv格式。格式。 插入插入FlashVideo將光標定位到要插入將光標定位到要插入FlashVideo的位置。的位置。選擇選擇“插入插入”|“媒體媒體”|“FlashVideo”命令，或單擊命令，或單擊“常用常用”工具欄中工具欄中“媒體媒體”按鈕下的按鈕下的”Flash Video”命命令，彈出令，彈出“插入插入FlashVideo”對話框。對話框。在在“視頻類型視頻類型“下拉列表框中選擇視頻類型。下拉列表框中選擇視頻類型。單擊單擊“URL”文本框后面的文本框后面的“瀏覽瀏覽”按鈕，在彈出的按鈕，在彈