項(xiàng)目四圖像和媒體-編排旅游網(wǎng)頁-PPT.ppt

Dreamweaver 8中文版 網(wǎng)頁制作基礎(chǔ),項(xiàng)目四 圖像和媒體編排旅游網(wǎng)頁,任務(wù)一 插入圖像,任務(wù)二 插入媒體,實(shí) 訓(xùn) 設(shè)置“漓江山水”網(wǎng)頁,網(wǎng)頁中的圖像和媒體，不僅可使頁面更加有聲有色，而且可以更好地配合文本傳遞信息。本項(xiàng)目以旅游網(wǎng)頁為例，介紹有關(guān)圖像和媒體的基本知識(shí)。在項(xiàng)目中，首先介紹插入圖像占位符和圖像以及設(shè)置圖像屬性的方法，然后介紹插入Flash動(dòng)畫、圖像查看器和ActiveX視頻的方法。,任務(wù)一 插入圖像,（一） 插入圖像占位符 （二） 插入圖像和設(shè)置圖像屬性,（一）插入圖像占位符,需要掌握的內(nèi)容主要有： 1、網(wǎng)頁中圖像的作用和常用格式 2、設(shè)置背景圖像 3、插入圖像占位符,網(wǎng)頁中圖像的作用基本上可分為兩種情況，一種是起裝飾的作用，如背景圖像，另一種是起傳遞信息的作用，它和文本的作用是一樣的。 在網(wǎng)頁中使用的最為普遍的圖像格式主要是GIF和JPG。GIF由于文件小、支持透明色、下載時(shí)具有從模糊到清晰的效果，成為網(wǎng)頁制作中首選的圖像格式。JPG為攝影提供了一種標(biāo)準(zhǔn)的有損耗壓縮方案，比較適合處理照片一類的圖像。,1、網(wǎng)頁中圖像的作用和常用格式,打開【頁面屬性】對(duì)話框，在【外觀】分類中單擊【瀏覽】按鈕打開【選擇圖像源文件】對(duì)話框，在【查找范圍】下拉列表框中選擇網(wǎng)頁背景圖像文件 。 在【重復(fù)】下拉列表框中有4個(gè)選項(xiàng)：“不重復(fù)”、“重復(fù)”、“橫向重復(fù)”及“縱向重復(fù)”，可以通過選擇它們來定義背景圖像的重復(fù)方式。,2、設(shè)置背景圖像,在主菜單中選擇【插入】【圖像對(duì)像】【圖像占位符】命令或在【插入】【常用】面板的【圖像】下拉菜單中單擊 （圖像占位符）按鈕打開【圖像占位符】對(duì)話框，進(jìn)行設(shè)置即可。,3、插入圖像占位符,（二） 插入圖像和設(shè)置圖像屬性,需要掌握的內(nèi)容主要有： 1、插入圖像 2、設(shè)置圖像屬性 3、圖文混排,在網(wǎng)頁中，插入圖像的方法通常有3種： （1）在主菜單中選擇【插入】【圖像】命令。 （2）在【插入】【常用】面板的【圖像】下拉菜單中單擊 （圖像）按鈕。 （3）在【文件】【文件】面板中用鼠標(biāo)選中文件，然后拖到文檔中適當(dāng)位置。,1、插入圖像,在圖像【屬性】面板中，比較常設(shè)置的參數(shù)有：【寬】和【高】、【替換】【垂直邊距】、【水平邊距】、【邊框】等。,2、設(shè)置圖像屬性,在網(wǎng)頁中，經(jīng)常出現(xiàn)文本和圖像混排的現(xiàn)象。在學(xué)習(xí)表格等網(wǎng)頁布局技術(shù)之前，要做到這一點(diǎn)就需要用到【屬性】面板的【對(duì)齊】選項(xiàng)，【對(duì)齊】選項(xiàng)調(diào)整的是圖像周圍的文本或其他對(duì)象與圖像的位置關(guān)系。在【對(duì)齊】下拉列表中共有10個(gè)選項(xiàng)，其中經(jīng)常用到的是“左對(duì)齊”和“右對(duì)齊”兩個(gè)選項(xiàng)。,3、圖文混排,任務(wù)二 插入媒體,（一） 插入Flash動(dòng)畫 （二） 插入圖像查看器 （三） 插入ActiveX視頻,（一）插入Flash動(dòng)畫,需要掌握的內(nèi)容主要有： 1、插入Flash動(dòng)畫 2、設(shè)置Flash動(dòng)畫屬性,1、插入Flash動(dòng)畫,插入Flash動(dòng)畫的方法通常有3種： （1）在主菜單中選擇【插入】/【媒體】/【Flash】命令。 （2）在【插入】/【常用】/【媒體】面板中單擊 （Flash）圖標(biāo)。 （3）在【文件】【文件】面板中用鼠標(biāo)選中文件，然后拖到文檔中。,2、設(shè)置Flash動(dòng)畫屬性,在【屬性】面板的【寬】和【高】文本框中分別輸入寬度和高度，勾選【循環(huán)】和【自動(dòng)播放】選項(xiàng)，還可以根據(jù)需要設(shè)置其他參數(shù)。,需要掌握插入圖像查看器的過程。 1、插入圖像查看器Flash占位符 2、設(shè)置Flash占位符屬性 3、修改圖像文件路徑,（二）插入圖像查看器,在主菜單中選擇【插入】/【媒體】/【圖像查看器】命令，打開【保存Flash元素】對(duì)話框，為新的Flash動(dòng)畫命名。,1、插入圖像查看器Flash占位符,在Flash占位符 【屬性】面板中定義寬度和高度等參數(shù)。,2、設(shè)置Flash占位符屬性,右鍵單擊Flash占位符，在彈出的菜單中選擇【編輯標(biāo)簽】命令，打開【標(biāo)簽編輯器Object】對(duì)話框，切換至【替代內(nèi)容】選項(xiàng)，然后在文本框內(nèi)找到默認(rèn)的圖像文件路徑名，修改圖像文件路徑，使其可以顯示預(yù)先準(zhǔn)備好的圖像。,3、修改圖像文件路徑,（三）插入ActiveX視頻,需要掌握的內(nèi)容主要有： 1、在網(wǎng)頁中播放WMV視頻文件 2、在網(wǎng)頁中播放RM視頻文件,1、在網(wǎng)頁中播放WMV視頻文件,（1）在主菜單中選擇【插入】/【媒體】/【ActiveX】命令，系統(tǒng)自動(dòng)在文檔中插入一個(gè)ActiveX占位符。 （2）在【屬性】面板的【ClassID】列表文本框中添加“CLSID:22D6f312-b0f6-11d0-94ab-0080c74c7e95”，然后按下Enter鍵。 （3）選擇【嵌入】選項(xiàng)，然后在【屬性】面板中打開【參數(shù)】對(duì)話框，添加參數(shù)。,（4）最后設(shè)置寬度和高度等屬性。,2、在網(wǎng)頁中播放RM視頻文件,（1）在主菜單中選擇【插入】/【媒體】/【ActiveX】命令，系統(tǒng)自動(dòng)在文檔中插入一個(gè)ActiveX占位符。 （2）在【屬性】面板的【ClassID】選項(xiàng)中選擇“RealPlayer/clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA”。 （3）選擇【嵌入】選項(xiàng)，然后在【屬性】面板中打開【參數(shù)】對(duì)話框添加參數(shù)。 （4）最后設(shè)置【寬】和【高】為固定尺寸。,實(shí)訓(xùn) 設(shè)置“漓江山水”網(wǎng)頁,本項(xiàng)目主要介紹了在網(wǎng)頁中插入圖像和媒體的基本方法，本實(shí)訓(xùn)將讓讀者進(jìn)一步鞏固所學(xué)的基本知識(shí)。 要求：把“項(xiàng)目實(shí)訓(xùn)素材”文件夾下的內(nèi)容復(fù)制到站點(diǎn)根文件夾下，然后在網(wǎng)頁文檔中插入圖像和圖像查看器。,制作“送孟浩然之廣陵”網(wǎng)頁,制作“送孟浩然之廣陵”網(wǎng)頁,小結(jié),本項(xiàng)目主要介紹了圖像和媒體在網(wǎng)頁中的應(yīng)用和設(shè)置方法，概括起來主要有以下幾點(diǎn)。 （1）通過【頁面屬性】對(duì)話框設(shè)置網(wǎng)頁背景圖像的方法。 （2）在網(wǎng)頁中插入圖