第五章影像與圖片的應(yīng)用

1、第五章 影像與圖片的應(yīng)用5-1網(wǎng)頁用圖片格式與特點比較5-2插入影像5-3在dreamweaver中編輯影像圖片5-4影像與圖片屬性第五章 影像與圖片的應(yīng)用在現(xiàn)今的網(wǎng)站當(dāng)中，已經(jīng)很難看到除了文字外，沒有其他任何影像或圖案設(shè)計的網(wǎng)頁，反而是有很多令人眼花撩亂的圖片、廣告等內(nèi)容。因此在網(wǎng)頁中適度的加上影像或是生動活潑的多媒體物件，已是吸引網(wǎng)友不可或缺的重要角色，甚至還有凌駕文字而成為網(wǎng)頁主體的趨勢。5-1 網(wǎng)頁用圖片格式與特點比較目前市面上有許多影像處理軟體，要製作一些賞心悅目的影像圖片，已經(jīng)不再是困難的工作。但圖片的格式種類繁多，網(wǎng)頁中究竟使用哪一種格式比較好呢？jpg格式png格式gif格式p

2、sd轉(zhuǎn)gif格式5-2 插入影像5-2-1 插入網(wǎng)頁影像圖片格式檔案插入影像的方式可以從選單列的命令，或是從 列 標(biāo)籤的 工具鈕來執(zhí)行。不過，還是要提醒您，最好先將所要用到的影像圖片複製到網(wǎng)站的相關(guān)資料夾中(例如：images資料夾)，以免日後在進行發(fā)佈作業(yè)時，影像檔案沒有被一起傳送到網(wǎng)站伺服器。5-2 插入影像5-2-2 使用photoshop(.psd)圖檔如果您已經(jīng)使用photoshop設(shè)計了許多影像檔案(psd格式)，在dreamweaver中可以將其直接插入到編輯視窗的網(wǎng)頁中，只是在過程中需要經(jīng)由dreamweaver將這些影像檔執(zhí)行最佳化轉(zhuǎn)換成網(wǎng)站可用的影像格式(、和)。您也可以將

3、多重圖層或多重分割的photoshop影像全部或部分貼到dreamweaver的網(wǎng)頁中。5-3 在dreamweaver中編輯影像圖片5-3-1 調(diào)整圖片大小與裁切圖片有時我們插入到網(wǎng)頁中的影像，其大小可能不適合網(wǎng)頁版面，因此藉由調(diào)整大小或裁切動作，可讓設(shè)計者藉由縮小影像範(fàn)圍來編輯影像。通常我們會想要裁切影像以強調(diào)影像的主題，並移除四周不需要的部分，而留下您在影像中感興趣的範(fàn)圍。5-3在dreamweaver中編輯影像圖片5-3-2 亮度、對比與銳利化修正太暗或太亮的影像時通常會在 面板按 鈕 以便修改影像的對比或亮度(以像素為單位)，它會影響到影像的標(biāo)示、陰影和中間色調(diào)。5-4 影像圖片屬性5-4-1 常用的屬性設(shè)定加上邊框5-4影像圖片屬性5-4-1 常用的屬性設(shè)定設(shè)定替代文字5-4 影像圖片屬性5-4-1 常用的屬性設(shè)定設(shè)定低解析影像圖片5-4 影像圖片屬性5-4-1 常用的屬性設(shè)定變更影像圖片來源5-4 影像圖片屬性5-4-2 影像圖片與文字的編排在dreamweaver中影像圖片和文字一樣，可以 、，只要利用 面板中的對齊按鈕，就可控制影像圖片的水平位置。影像圖片和文字預(yù)設(shè)是以 的方式對齊，想要改變對齊的方式也十分簡單。請參考以下的操作說明。5-4 影像圖片