在 Dreamweaver 中插入及編輯影像

在「文件」視窗中將插入點置於您想要影像出現的地方，然後執行下列其中一項作業：

• 在「插入」面板中，從下拉式清單中選取「HTML」。按一下「影像」。按兩下圖示或將它拖曳到「文件」視窗 (如果您正使用程式碼工作，則拖曳到「程式碼」檢視視窗)。

• 選取「插入 > 影像」。

• 將影像從「資源」面板 (「視窗 > 資源」) 拖曳到「文件」視窗中想要的位置；然後跳到步驟 3。

• 將影像從「檔案」面板拖曳到「文件」視窗中想要的位置；然後跳到步驟 3。

• 將影像從桌面拖曳到「文件」視窗中想要的位置；然後跳到步驟 3。

• 在「即時」檢視中，從「Extract」面板或「圖層」索引標籤中拖曳影像。根據即時導引線，將所拖曳的元素放到某個元素的上、下、左或右方。或者，您可以按一下 </> 並使用「元素快速檢視」，將所拖曳的元素放到文件結構中精確的位置。

以瀏覽方式選取您要插入的影像或內容來源。

如果您是在未儲存的文件中工作，Dreamweaver 會產生一個 file:// 影像檔參考。當您將文件儲存在網站中的任何位置時，Dreamweaver 會將這個參考轉換為文件的相對路徑。

按一下「確定」。

若要檢視所選取影像的「屬性」檢視窗，請按一下該影像並選取「視窗 > 屬性」。

在縮圖影像下方的文字方塊中，輸入名稱。在使用 Dreamweaver 行為 (例如「調換影像」) 或使用指令碼語言 (例如 JavaScript 或 VBScript) 時，您就可以使用此名稱來指出該影像。

以像素為單位的影像寬度和高度。當您將影像插入頁面時，Dreamweaver 會自動以影像原始的尺寸來更新這些文字方塊。

如果您將「寬」和「高」設定成無法對應至影像實際寬度和高度的值，影像在瀏覽器中會無法正確顯示。若要恢復原始值，請按一下「寬」和「高」文字方塊標籤，或按一下出現在「寬」和「高」文字方塊右邊的「重設」影像大小按鈕。

會指定影像的原始檔案。請按一下資料夾圖示來選擇原始檔案，或輸入路徑。

會指定影像的超連結。請將「指向檔案」圖示拖曳到「檔案」面板中的檔案。按一下資料夾圖示來瀏覽至網站上的文件，或手動輸入 URL。

會指定在純文字瀏覽器或設定成手動下載影像的瀏覽器中，要出現在這個影像位置上的替代文字。對於配合純文字瀏覽器使用語音合成器的視障用戶，這些文字會大聲地唸出來。在某些瀏覽器中，當指標滑過影像時這個文字也會出現。

可讓您標示及建立用戶端影像地圖。

目標視窗  會指定要載入所連結頁面的頁框或視窗。如果影像沒有連結到另一個檔案，此選項就無法使用。目前頁框組中所有頁框的名稱都會出現在「目標視窗」清單中。您也可以從下列保留的目標視窗名稱中選擇：

• _blank 會在未命名的新瀏覽器視窗中載入連結的檔案。
• _new 會在新的瀏覽器視窗中載入連結的檔案。
• _parent 會在上一層頁框組或包含連結的頁框之視窗中載入連結的檔案。如果包含連結的頁框不是巢狀的，則會在完整的瀏覽器視窗中載入連結的檔案。
• _self 會在與連結相同的頁框或視窗中載入連結的檔案。此目標視窗是預設的目標視窗。您不需要明確指定這個值。
• _top 會在完整的瀏覽器視窗中載入連結的檔案，然後移除所有頁框。

會啟動您在「外部編輯器」偏好設定中指定的影像編輯器，並且開啟選取的影像。

會開啟「影像最佳化」對話方塊，讓您將影像最佳化。

當 Dreamweaver 頁面上的影像和原始的 Photoshop 檔案不同步時，Dreamweaver 會偵測到原始檔案已更新。應用程式會將「智慧型物件」圖示的其中一個箭頭以紅色顯示。當您在「設計」檢視中選取該網頁影像，並在「屬性」檢視窗中按一下「從原始檔更新」按鈕時，影像便會自動更新。更新的影像會反映您對原始的 Photoshop 檔案所做的變更。

可讓您修剪影像大小，或從選取的影像移除不需要的區域。

可讓您重新取樣調整過大小的影像，依其新的大小及形狀改善影像品質。

可調整影像的亮度和對比設定。

可調整影像的銳利度。

在「文件」視窗中，按一下影像或在程式碼中選取影像標籤。

請執行下列其中一項作業，在「替代文字」方塊中，輸入名稱或影像的簡短描述，不可超過 50 個字元。螢幕閱讀程式會朗讀您在這裡輸入的資訊。 

• 在「程式碼」檢視中編輯適當的影像屬性。

• 在「即時」檢視中，使用快速屬性檢視窗來編輯影像屬性。

• 在「屬性」檢視窗中編輯「替代」值。

調整大小控制點會出現在元素的底部、右邊和右下角。如果調整大小控制點沒有出現，請在元素的外部按一下，然後重新選取它。或者，您也可以按一下標籤選取器中的適當標籤來選取此元素。

• 若要調整元素的寬度，請拖曳右邊的選取範圍控點。

• 若要調整元素的高度，請拖曳底部的選取範圍控點。

• 若要同時調整元素的寬度和高度，請拖曳角落的選取範圍控點。

• 若要在調整元素尺寸時保存它的比例 (它的寬高比)，請按住 Shift 並拖曳角落的選取範圍控點。

• 若要將元素的寬度和高度調整為特定的大小 (例如 1 x 1 像素)，請使用「屬性」檢視窗。在「寬」和「高」欄位中輸入數值。您可以用目視方式將元素大小調整成最小 8 x 8 像素。

若要將調整過大小的元素還原成原來的尺寸，請在「屬性」檢視窗中刪除「寬」和「高」欄位中的值。您也可以按一下影像「屬性」檢視窗中的「重設大小」按鈕。

調整影像大小，如調整影像大小一節中所述。

按一下影像「屬性」檢視窗中的「重新取樣」按鈕 。

選取「編輯 > 影像」。您可以設定下列的 Dreamweaver 影像編輯功能：

選取預設集，指定檔案格式，然後指定品質等級。當移動品質等級的滑桿時，您可以在對話方塊中看到影像的檔案大小。完成後，請按一下「確定」。

會增加或減少已調整大小之 JPEG 與 GIF 影像檔的像素，以盡量符合原始影像的外觀。 重新取樣影像會縮減影像檔的大小，使得下載效能改善。

在 Dreamweaver 中調整影像大小時，您可以進行「重新取樣」以容納其新的尺寸。當重新取樣點陣圖物件時，會在影像中增加或移除像素，以使其變大或縮小。將影像重新取樣提高解析度，基本上會損失些微的品質。然而將影像重新取樣降低解析度，就一定會造成資料流失，品質通常也會降低。

可藉由縮小影像區域來編輯影像。您可以使用裁切來強調影像的主題，並移除四周不需要的部分，而留下您感興趣的部分。

可修改影像中像素的對比或亮度。亮度和對比會影響到影像的亮部、陰影和中間色調。修正太暗或太亮的影像時，您通常會使用「亮度/對比」。

可藉由增加影像內輪廓邊緣的對比來調整影像焦點。當您掃描影像或拍攝數位相片時，大部分影像拍攝軟體的預設動作都是柔化影像中物件的邊緣。掃描可避免過度精緻的細節在數位影像的組成像素中遺失。然而，要在數位影像檔中帶出細節，通常需要銳利化影像。使用「銳利化」選項可增加邊緣對比，並使影像顯得更銳利。

開啟包含所要裁切的影像的頁面，選取該影像，然後執行下列其中一項作業：

• 按一下影像「屬性」檢視窗中的「裁切工具」圖示 。

• 選取「編輯 > 影像 > 裁切」。

• 裁切控制點會出現在選取影像的周圍。

這時會出現一個對話方塊，通知您磁碟上正在裁切的影像檔將會變更。按一下「確定」。

這時會移除在邊界方框外所選取點陣圖中的每一個像素，但文件中的其他物件則維持不變。

請預覽此影像，並確定它能符合您預期的樣子。如果不是這樣，請選取「編輯 > 還原裁切」以回復至原來的影像。

開啟包含了您希望最佳化的影像的頁面。選取該影像，並執行下列其中一項作業：

• 按一下影像「屬性」檢視窗中的「編輯影像設定」按鈕。

• 選取「編輯 > 影像 > 最佳化」。

在「影像預覽」對話方塊中進行編輯，然後按一下「確定」。

• 按一下影像屬性檢視窗中的「銳利化」按鈕。

• 選取「編輯 > 影像 > 銳利化」。

若要指定 Dreamweaver 套用至影像的銳利化程度，請拖曳滑桿控制項。您也可以在文字方塊中輸入介於 0 到 10 的值。使用「銳利化」對話方塊調整影像的銳利度時，您可以預覽影像的變更。

請選取「檔案 > 儲存」來儲存您的變更，或是選取「編輯 > 還原銳利化」來回復至原始的影像。

• 按一下影像「屬性」檢視窗中的「亮度和對比」按鈕。

• 選取「編輯 > 影像 > 亮度/對比」。

• 在「插入」面板中，從下拉式清單中選取「HTML」。從選項清單中選取「滑鼠變換影像」。

• 選取「插入 > HTML > 滑鼠變換影像」。

在「插入滑鼠變換影像」對話方塊中，選取該影像，然後設定滑鼠變換影像的屬性。您可以設定下列屬性：

滑鼠變換影像的名稱。

要在頁面載入時顯示的影像。請在文字方塊中輸入路徑，或按一下「瀏覽」選取影像。

要在指標滑過原始影像時顯示的影像。請輸入路徑，或按一下「瀏覽」選取影像。

會將影像預先載入瀏覽器的快取中，讓用戶指標滑過影像時不會發生延遲。

(選擇性) 向使用純文字瀏覽器的檢視者描述影像的文字。

在用戶按一下滑鼠變換影像時要開啟的檔案。請輸入路徑，或按一下「瀏覽」選取檔案。

若要預覽滑鼠變換影像，請選取「檔案 > 即時預覽」或按 F12。

若要開啟外部編輯器，請執行下列其中一項作業：

• 按兩下您要編輯的影像。

• 以滑鼠右鍵按一下 (Windows) 或 Control+按一下 (Macintosh) 所要編輯的影像。然後，按一下「編輯程式 > 瀏覽」，並選取編輯器。

• 選取您要編輯的影像，然後按一下「屬性」檢視窗中的「編輯」。

• 在「檔案」面板中按兩下影像檔，啟動主要影像編輯器。如果您還沒有指定影像編輯器，則 Dreamweaver 會啟動這個檔案類型的預設編輯器。

如果回到 Dreamweaver 視窗時看不到更新的影像，請選取該影像，然後按一下「屬性」檢視窗中的「重新整理」按鈕。

選取「編輯 > 偏好設定」(Windows) 或「Dreamweaver > 偏好設定」(macOS)，然後從左窗格的「分類」清單中選取「檔案類型/編輯器」。

在「副檔名」清單中，選取您要設定外部編輯器的副檔名。

在「選取一個外部編輯程式」對話方塊中，瀏覽至您要針對這種檔案類型啟動的編輯器應用程式。

在「偏好設定」對話方塊中，如果您要此編輯器成為這種檔案類型的主要編輯器，請按一下「設為主要的」。

當您要編輯這種影像類型時，Dreamweaver 會自動使用主要編輯器。您也可以在「文件」視窗中，從影像的快顯選單中選取其他列出的編輯器。

選取「編輯 > 偏好設定」(Windows) 或「Dreamweaver > 偏好設定」(macOS)，然後從左窗格的「分類」清單中選取「檔案類型/編輯器」。

在「檔案類型/編輯器偏好設定」對話方塊中，按一下「副檔名」清單上方的「新增」(+) 按鈕。

「副檔名」清單中就會出現一個文字方塊。

選取您要設定編輯器之檔案類型的副檔名。

若要針對這個檔案類型選取外部編輯器，請按一下「編輯器」清單上方的「新增」(+) 按鈕。

在出現的對話方塊中，選取您要用來編輯此影像類型的應用程式。

如果您要這個編輯器成為此影像類型的主要編輯器，請按一下「設為主要的」。

選取「編輯 > 偏好設定」(Windows) 或「Dreamweaver > 偏好設定」(macOS)，然後從左窗格的「分類」清單中選取「檔案類型/編輯器」。

在「檔案類型/編輯器」偏好設定對話方塊中，於「副檔名」清單中選取您要變更以在現有編輯器中檢視的檔案類型。

在「編輯器」清單中，選取您要影響的編輯器，然後執行下列其中一項作業：

• 若要新增或移除編輯器，請按一下「編輯器」清單上方的「新增」(+) 或「刪除」(–) 按鈕。

• 若要變更編輯時預設要啟動的編輯器，請按一下「設為主要的」按鈕。