Dreamweaver 工作區

Dreamweaver 入門

安裝 Dreamweaver 後，當您首次啟動應用程式時，螢幕上會出現 QuickStart 選單，詢問您三項問題，協助您根據需求個人化 Dreamweaver 工作區。

根據您對這些問題的回答，Dreamweaver 會在 Developer workspace (以程式碼為主的極簡配置) 或 Standard workspace (具有視覺工具和應用程式內預覽功能的分割配置) 中開啟。 

選擇工作區之後，請選擇想要的顏色主題。 然後您就可以開始使用。

改善的首頁畫面

Dreamweaver 中的首頁畫面讓您快速存取最近使用的檔案、檔案類型和初學者範本。

根據您的訂閱狀態，「開始」工作區也可依照需求顯示客製化內容。

Dreamweaver 會在啟動時或沒有開啟文件時顯示首頁畫面。

Dreamweaver 開始體驗中的選項

按一下「學習」即可從此畫面立即存取 Dreamweaver 教學課程。

按一下顯示的任何檔案類型，即可開始在 Dreamweaver 中建立文件。

開啟其中一個 Dreamweaver 內建的入門範本。 

按一下「首頁」返回開始畫面。 

您可以在開始畫面中檢視您最近處理過的檔案。 如果您沒有任何最近使用的檔案，此標籤為空白。

您也可以透過此畫面右上角的「搜尋」圖示，使用搜尋功能。 當您輸入搜尋查詢時，應用程式會顯示符合搜尋查詢的最近使用檔案、Creative Cloud 資產、說明連結和素材庫圖片。

您可以按一下「新建」，開始建立新的 Dreamweaver 檔案。 如果您的系統中已有檔案，請按一下「開啟」。 如需在 Dreamweaver 中建立和開啟文件的相關資訊，請參閱建立和開啟檔案。

工作區概覽

Dreamweaver 工作區可讓您檢視文件和物件屬性。 工作區的工具列中也放置了許多最常用的作業選項，因此，您可以快速地變更文件。

工作區元素總覽

Workspace 包含下列元素：

位於應用程式視窗的頂端，包含工作區切換器、選單 (僅限 Windows) 和其他應用程式控制項。

包含按鈕，提供文件視窗不同檢視的選項 (例如設計檢視、Live 檢視和程式碼檢視)。

如果要顯示「標準」工具列，請選取「視窗 > 工具列 > 標準」。 工具列包含來自檔案和編輯選單的常用操作按鈕：新增、開啟、儲存、全部儲存、列印程式碼、剪下、複製、貼上、還原和重做。

位於應用程式視窗的左側，包含視圖專用按鈕。

會在您建立及編輯目前文件時顯示它。

讓您檢視和變更已選取的物件或文字之各種屬性。 每個物件都有不同的屬性。

位於「文件」視窗底部的狀態列中， 會顯示目前選取範圍左右標籤的階層。 按一下階層中的任何標籤就能選取該標籤及其所有內容。

協助您監控和修改作品。 例如「插入」面板、「CSS 設計工具」面板和「檔案」面板。 若要展開某個面板，請按兩下它的索引標籤。

可讓您上傳及檢視在 Creative Cloud 上的 PSD 檔案。 使用此面板，您可以從 PSD 合成圖擷取 CSS、文字、影像、字體、色彩、漸層和測量值到您的文件中。

包含將各種物件 (如影像、表格和媒體元素) 插入文件中所需的按鈕。 每個物件都是片段的 HTML 程式碼，當您將它插入文件時可在其中設定各種屬性。 例如，您可以按一下「插入」面板中的「表格」按鈕來插入表格。 如果您想要的話，可以利用「插入」選單而非「插入」面板來插入物件。

讓您不論檔案和資料夾是屬於 Dreamweaver 網站或是在遠端伺服器上，都可以管理檔案和資料夾。 「檔案」面板也可讓您存取本機磁碟上的所有檔案。 如需更多資訊，請參閱管理檔案和資料夾。

可讓您在不同的網頁、不同的網站和不同的 Dreamweaver 安裝 (使用同步設定) 中，儲存並重複使用您的程式碼片段。 如需詳細資訊，請參閱「利用片段重複使用程式碼」。

是 CSS 屬性檢視器，可讓您「視覺化地」建立 CSS 樣式、檔案和設定屬性，以及媒體查詢。

文件視窗總覽

「文件」視窗會顯示目前的文件。 若要切換文件的檢視，請使用文件工具列上的檢視選項。 

您也可以使用「檢視」選單中的「檢視」選項來切換檢視。

以真實的方式來呈現，就像在瀏覽器中看到的文件一樣，並可讓您與文件互動，就像在瀏覽器中一樣。 您可以直接在「即時檢視」中編輯 HTML 元素，並可立即在相同檢視中預覽變更。 如需在 Live 檢視中編輯的詳細資訊，請參閱在 Live 檢視中編輯 HTML 元素。

是一種設計環境，可用來開發視覺頁面版面、視覺編輯及快速應用程式。 在這種檢視中，Dreamweaver 會以視覺化表示顯示文件 (類似您在瀏覽器中檢視頁面時所看到的樣子)，並且具有完整的編輯功能。

是用於撰寫和編輯 HTML、JavaScript 以及任何其他類型程式碼的手動編碼環境。

是 Code 檢視的分割版本，可讓您捲動以同時處理文件的不同區段。 

可讓您在單一視窗中同時查看相同文件的程式碼檢視和即時檢視。

可讓您在單一視窗中同時查看相同文件的 Code 檢視和 Design 檢視。

顯示瀏覽器用來執行頁面的實際程式碼，並可在您與 Live 檢視中的頁面互動時動態變更。

當「文件」視窗最大化時 (預設值)，「文件」視窗的頂端會出現索引標籤，顯示所有開啟文件的檔案名稱。 如果您有尚未儲存的變更，Dreamweaver 會在檔案名稱後顯示星號。

Dreamweaver 也會在文件的索引標籤下方顯示「相關檔案」工具列 (如果您以個別視窗檢視多個文件，則是顯示在文件的標題列下方)。 相關文件是與目前的檔案 (例如 CSS 檔案或 JavaScript 檔案) 相關聯的文件。 若要在「文件」視窗中開啟其中一個相關檔案，請在「相關檔案」工具列中按一下該檔案的名稱。

在檢視間切換

請使用「文件」工具列在不同檢視之間快速切換。 如需更多資訊，請參閱文件工具列概觀。

您也可以使用「檢視」選單中的下列選項來切換檢視：

• 僅限程式碼檢視：選取「程式碼」
• 分割檢視：選取「分割」並選取任何分割選項
• 檢視模式：在即時和設計檢視之間切換
• 切換檢視：從一個檢視切換到另一個檢視。

重疊顯示、並排顯示或重新排列文件視窗

如果您一次開啟多份文件，則可重疊顯示或並排顯示這些文件。

若要重疊顯示文件視窗：選取「視窗 > 排列 > 重疊顯示」。

若要並排顯示文件視窗：

• (Windows) 選取「視窗 > 排列 > 水平並排」或「垂直並排」。
• (Macintosh) 選取「視窗 > 排列 > 並排」。

當您開啟多個檔案時，「文件」視窗會加上標籤。 如果要重新排列加上索引標籤的「文件」視窗，請將視窗的標籤拖曳到群組中的新位置。

調整文件視窗大小

狀態列會顯示「文件」視窗的目前尺寸 (以像素為單位)。 若要設計擁有特定最佳大小的頁面，您可以將「文件」視窗調整為任何預先決定的大小、編輯這些預先決定的大小或建立新的大小。

當您在「設計」或「即時檢視」中變更了頁面的檢視大小時，只會變更檢視大小的尺寸。 文件大小會保持不變。

除了預先決定與自訂的大小外，Dreamweaver 也會列出媒體查詢中指定的大小。 當您選取與媒體查詢對應的大小時，Dreamweaver 會使用媒體查詢來顯示頁面。 您也可以變更頁面方向，以預覽行動裝置的頁面，在行動裝置中，頁面版面通常會根據裝置握持的方式變更。

若要調整文件視窗大小，請從「文件」視窗底部的「視窗大小」快顯選單中選取其中一個大小。

顯示出來的視窗大小反映出瀏覽器視窗內不含邊框的尺寸；監視器大小或行動裝置會列在右側。

變更視窗大小彈出式選單中所列的值

在視窗大小彈出式選單中加入新的大小

文件工具列總覽

「文件」工具列包含的按鈕可讓您快速切換不同的文件檢視。 工具列還包含一些常用命令和選項，這些命令和選項都是與檢視文件、在本機和遠端網站之間傳送文件有關。

下列選項出現在「文件」工具列中：

只會在「文件」視窗中顯示「程式碼」檢視。

將「文件」視窗分割為「程式碼」和「即時/設計」檢視。 流體格線文件無法使用「設計檢視」選項。

是互動式預覽，準確地即時呈現 HTML5 專案和更新，在您進行變更時顯示這些變更。 您也可以在「即時檢視」中編輯 HTML 元素。 「即時」選項旁的下拉式清單可讓您在「即時」與「設計」檢視之間切換。 流體格線文件無法使用此下拉式清單。

顯示文件的展現方案，呈現使用者在網頁瀏覽器中檢視文件的方式。 

標準工具列總覽

如果要顯示「標準」工具列，請選取「視窗 > 工具列 > 標準」。 工具列包含來自檔案和編輯選單常見操作的按鈕：開新檔案、開啟、儲存、全部儲存、列印代碼、剪下、複製、貼上、復原和重做。

瀏覽器導覽工具列總覽

在「即時」檢視中，「瀏覽器導覽」工具列會變成作用中狀態 (您必須先透過選取「視窗 -> 工具列 -> 標準」予以啟用)，並且為您顯示目前在「文件」視窗中查看之頁面的位址。 「即時」檢視的行為就如同一般瀏覽器，因此即使您瀏覽至本機網站以外的網站 (例如 http://www.adobe.com)，Dreamweaver 仍會在「文件」視窗中載入該頁面。

根據預設，在「即時」檢視中，連結不會處於作用中狀態。 使用非作用中連結可讓您在「文件」視窗中選取或按一下連結文字，而不會被帶往另一個頁面。 若要在 Live 檢視中測試連結，您可以選擇「檢視 > Live View 選項 > 追隨連結 (Ctrl+按一下連結)」或「持續追隨連結」來啟用單次按一下或持續按一下。

工具列總覽

工具列會垂直顯示在「文件」視窗左側，而且所有檢視中都會出現 -「程式碼」、「即時」和「設計」。 工具列上的按鈕是檢視特有的，而且只有在適用於您正在使用的檢視時才會出現。 例如，如果您在 Live 檢視中工作，則不會顯示程式碼檢視特定選項 (如格式化原始程式碼)。 

自訂工具列

您可以透過增加選單選項，或從工具列中移除不需要的選單選項，根據需求自訂此工具列。

若要自訂工具列，請執行以下作業：

若要還原預設工具列按鈕，請在「自訂工具列」對話框中按一下「還原預設」。

狀態列總覽

「文件」視窗底部的狀態列會提供現在所建立文件的其他資訊。

標籤選取器

會顯示目前選取範圍左右標籤的階層。 按一下階層中的任何標籤就能選取該標籤及其所有內容。 按一下 <body> 可選取整個文件的內文。 若要在標籤選取器中設定標籤的 class 或 ID 屬性，請以滑鼠右鍵按一下 (Windows) 或 Control+按一下 (Macintosh) 該標籤，並從快顯選單中選取類別或 ID。

輸出面板

按一下此圖示以顯示 Output 面板，該面板會顯示文件中的程式碼錯誤。

程式碼標色

(僅適用於程式碼檢視)

從此快顯選單中選取任一程式碼語言，以變更程式碼的著色，根據程式語言顯示。

插入及覆寫切換

(僅適用於程式碼檢視)

可讓您在程式碼檢視中工作時，在插入和覆寫模式之間切換。

行號和欄號

(僅適用於 程式碼檢視。)

顯示游標所在的行號和欄號。

屬性檢視窗總覽

屬性檢視窗 (「視窗 > 屬性」) 可讓您檢查和編輯目前選取頁面元素的最常見屬性，例如文字或插入的物件。

「屬性檢視窗」的內容會隨著選取的元素而不同。 例如，如果您選取頁面上的影像，「屬性檢視窗」會變更為顯示影像的屬性 (比如說，若有的話會顯示影像的檔案路徑、影像的寬度和高度、影像周圍的邊框等等)。

「屬性檢視窗」預設位於工作區的下緣，但是您可以將它解除鎖定，讓它成為工作區中的浮動面板。

若要取得特定「屬性」檢視窗的說明，請按一下「屬性」檢視窗右上角的「說明」按鈕，或從「屬性」檢視窗的「選項」選單選取「說明」。

檢視及變更頁面元素的屬性

快顯選單

快顯選單會針對與您所使用之物件或視窗相關的最常用命令以及屬性，提供便捷的存取方式。 快顯選單僅列出適用於目前選取範圍的指令。

若要開啟快顯選單，請在程式碼檢視中的程式碼區段上按一下滑鼠右鍵 (Windows) 或 Ctrl+按一下 (Mac)，或在 Live 或設計檢視中的物件上按一下。

在 Dreamweaver 中重新排列面板

您可以根據需求自訂所有 Dreamweaver 面板的位置和外觀。

鎖定及解除鎖定面板

• 若要固定面板，請將面板的標籤拖移到固定區域中，可放在頂端、底部或其他面板之間。
• 若要固定面板群組，請將面板群組的標題列 (標籤上方的實心空白列) 拖移到固定區域中。
• 若要移除面板或面板群組，請將面板的標籤或面板群組的標題列拖移出固定區域。 您可以將面板拖移到另一個固定區域中，或是將其變成可自由浮動。

移動面板

當您移動面板時，會看見藍色標示的放置區域，那些就是您可以移動面板的區域。 例如，您可以在固定區域中，將面板拖移到另一個面板上方或下方的狹窄藍色放置區域中，就可以將面板向上或向下移動。 如果是拖移到非放置區域，面板就可以在工作區中自由浮動。

• 若要移動面板，請拖曳面板的標籤。
• 若要移動面板群組，請拖曳標題列。

新增和移除面板

如果移除固定區域中的所有面板，固定區域就會消失。 您可以將面板移到工作區的右邊緣，直到放置區域出現為止，利用這種方式建立固定區域。

• 如果要移除面板，請用滑鼠右鍵按一下 (Windows) 或按住 Control 並按一下 (Mac) 它的索引標籤，然後選取「關閉」，或從「視窗」選單將它取消選取。
• 若要新增面板，請在「視窗」選單中選取面板，並將它固定在您想要的任何位置。

操作面板群組

• 若要將面板移動到群組中，請將面板的標籤拖移到群組反白標示的放置區域中。
• 若要重新排列群組中的面板，請將面板的標籤拖移到群組中的新位置。
• 若要移除群組中的面板，使其可自由浮動，請將面板的標籤拖移到群組外面。
• 若要移動群組，請拖曳其標題列 (位於索引標籤上方的區域)。

堆疊浮動面板

如果您將面板拖移到固定區域外而未放入放置區域，該面板即可自由浮動。 浮動面板讓您能夠將其定位於工作區中的任何地方。 您可以將浮動面板或面板群組堆疊在一起，這樣當您拖曳最頂端的標題列時，就可以讓它們一起移動。

• 若要堆疊浮動面板，請將面板的索引標籤拖曳到另一個面板底部的放置區域。
• 若要變更堆疊順序，請將面板的標籤向上或向下拖移。
• 若要移除堆疊中的面板或面板群組，使其可單獨自由浮動，請將面板的標籤或面板群組的標題列拖移到堆疊外面。

重新調整面板尺寸

• 若要將某個面板、面板群組或一疊面板最大化或最小化，請按兩下索引標籤。 您也可以按兩下索引標籤區域 (索引標籤旁的空白區域)。
• 如果要調整面板的尺寸，請拖曳面板的任何一邊。 

收合和展開面板圖示

您可以將面板收合為圖示，減少工作區的雜亂。 在某些情況下，面板會在預設工作區中收合為圖示。

• 若要收合或展開某一欄中的所有面板圖示，請按一下固定區域頂端的雙箭頭。
• 若要展開單一面板圖示，請按一下該圖示。
• 如果要調整面板圖示的尺寸，只要看到圖示而不看到索引標籤，請調整固定區域的寬度，直到文字出現為止。 如果要再次顯示圖示文字請，將固定區域加寬一些。
• 若要將已展開的面板重新收合為圖示，請按一下面板的標籤、圖示或面板標題列中的雙箭頭。

建立自訂工作區

您可以根據您的需求新增或移除面板，來自訂您的工作區。 接著可以將這些變更儲存到工作區，以便稍後從「文件」工具列的「Workspace 切換器」存取。

只要將面板的目前大小和位置另存為具名工作區，即使您移動或關閉面板，仍然可以復原該工作區。

若要儲存自訂工作區：

1. 選擇「視窗 > Workspace 配置 > 新增 Workspace」。
2. 輸入工作區的名稱。

工作區已儲存，並且可以在「文件」工具列的工作區切換器中看到。

若要刪除自訂工作區：

從「應用程式」列的工作區切換器中選取「管理工作區」，以開啟「管理工作區」對話方塊。 選取 Workspace，然後按一下「刪除」。

顯示或切換工作區

從文件工具列中的工作區切換器選取工作區。

在多用戶系統中自訂 Dreamweaver

即使在多使用者作業系統 (如 Windows XP 或 Mac OS X) 中，您也可以自訂 Dreamweaver 以符合您的需求。

Dreamweaver 可防止任何用戶的自訂設定影響任何其他用戶的自訂設定。 為了達到這項目標，Dreamweaver 初次在可辨識的任一多用戶作業系統上執行時，此應用程式會建立多種不同設定檔的複本。 這些使用者設定檔會儲存在屬於您的資料夾中。

如果您重新安裝或升級 Dreamweaver，Dreamweaver 會自動為現有的使用者設定檔案建立備份副本，因此即使您手動自訂了這些檔案，仍可存取您所做的變更。

顯示加上索引標籤的文件 (僅限 Mac)

使用索引標籤來識別每份文件，您便可在單一文件視窗中檢視多份文件。 您也可以將這些文件顯示為浮動工作區的一部分，在該工作區中每份文件會出現在它自己的視窗中。

在另一個視窗中開啟外框包圍的檔案

Control+按一下索引標籤，然後從快顯選單中選取「移至新視窗」。

變更外框包圍的檔案預設值

1. 選取「Dreamweaver ＞ 偏好設定」，然後選取「一般」類別。
2. 選取或取消選取「在索引標籤中開啟文件」，然後按一下「確定」。

當您變更偏好設定時，Dreamweaver 並不會改變目前已開啟的文件顯示方式。 但是，在您選取新的偏好設定後，隨後開啟的文件都將依據選取的偏好設定來顯示。

啟動 Dreamweaver 且沒有開啟任何文件時，便會出現「歡迎畫面」。 您可以選擇隱藏「歡迎畫面」，並於稍後再顯示它。 當隱藏「歡迎畫面」且沒有開啟文件時，「文件」視窗便會是空白的。

常用的 Dreamweaver 面板

您會在 Dreamweaver 中使用許多面板。 此處說明一些常用的面板。

插入面板總覽

「插入」面板 (「視窗 > 插入」) 包含用於建立和插入物件 (如表格、影像和連結) 的按鈕。 按鈕分為數個類別，您可以從頂端的下拉式清單中選取所需的類別來切換。

部分類別的按鈕含有彈出式選單。 當您從彈出式選單中選取某一選項後，該選項便會成為該按鈕的預設動作。 例如，如果您從 字元按鈕的快顯選單中選取 換行符號，下次按一下 字元按鈕時，Dreamweaver 會插入換行符號。每當您從彈出式選單中選取新的選項後，按鈕的預設動作就會變更。

「插入」面板會以下列類別組織：

讓您建立和插入最常用的 HTML 元素 (如 div 標記) 和物件 (如影像和表格)。

包含用於建立表單和插入表單元素 (如搜尋、月份和密碼) 的按鈕。

讓您將文件另存為範本，並將特定區域標記為可編輯、選用、重複或可編輯選用區域。

包含 Bootstrap 元件，提供導覽、容器、下拉式選單等，您可以在回應式專案中使用。

包含用於建置使用 jQuery Mobile 的網站的按鈕。

讓您插入 jQuery UI 元素，例如 Accordion、滑桿和按鈕。

可讓您將最常用的「插入」面板按鈕加以群組並排列組織在一個常用的地方。

插入物件

若要使用「插入」面板插入物件：

編輯插入面板偏好設定

在插入面板的最愛類別中新增、刪除或管理項目

檔案面板總覽

使用 檔案面板檢視和管理您 Dreamweaver 網站上的檔案。

您可以使用「檔案」面板來檢視檔案和資料夾 (檢查它們是否與 Dreamweaver 網站相關聯)，並執行標準檔案維護作業，例如開啟和移動檔案。

「檔案」面板也可幫助您管理檔案並在遠端伺服器間往來傳送檔案。 

如需有關「檔案」面板所有功能的詳細資訊，請參閱 管理檔案和資料夾。

CSS 設計工具

CSS Designer 面板 (視窗 > CSS Designer) 是 CSS 屬性檢視器，可讓您「視覺化」建立 CSS 樣式、檔案和設定屬性，以及媒體查詢。

您可以使用 Ctrl/Cmd+Z 還原或使用 Ctrl/Cmd+Y 重做，您在 CSS 設計工具中執行的所有動作。 這些變更會自動反映在「即時檢視」中，而且相關聯的 CSS 檔案也會進行重新整理。 為了讓您知道相關檔案已變更，受影響檔案的索引標籤會短暫反白標示 (大約 8 秒)。

CSS Designer 面板包含下列窗格和選項：

全部：列出與目前文件相關聯的所有 CSS、媒體查詢和選取器。 您可以篩選所需的 CSS 規則及修改屬性。 您也可以使用此模式開始建立選擇器或媒體查詢。

這個模式與選取內容無關。 這表示當您選取頁面上的元素時，CSS Designer 中不會醒目提示相關的選擇器、媒體查詢或 CSS。

目前：列出目前文件的「設計」或「即時」檢視中任一所選元素的所有已計算樣式。 當您在「程式碼」檢視中對 CSS 檔案使用此模式時，會顯示焦點選擇器的所有屬性。

此模式為內容感應式。 使用此選項來編輯文件中所選元素相關選擇器的屬性。

來源：列出所有與文件相關的 CSS 樣式表。 您可使用此窗格建立 CSS 並將其附加到文件，或在文件內定義樣式。

@媒體：列出「來源」窗格中所選來源的所有媒體查詢。 如果您未選取特定的 CSS，則此窗格會顯示所有與文件相關的媒體查詢。

選取器：列出「來源」窗格中所選來源的所有選取器。 如果您也選取了一個媒體查詢，則此窗格會針對該媒體查詢縮減選取器清單。 如果未選取任何 CSS 或媒體查詢，則此窗格會顯示文件中的所有選取器。

當您在「@Media」窗格中選取「全域」時，會顯示所選來源的媒體查詢中未包含的所有選擇器。

屬性：顯示您可以為指定的選取器設定的屬性。 如需更多資訊，請參閱設定屬性。

如果您收合或展開 CSS 設計工具中的窗格，窗格的大小會記憶在工作階段內。 「來源」和「媒體」窗格會保持自訂的大小，直到您再次變更其大小為止。

注意：當您選取頁面元素時，會在「選取器」窗格中選取最特定的選取器。 若要檢視特定選擇器的屬性，請在窗格中按一下該選擇器的名稱。

如果要檢視所有選取器，您可以在「來源」窗格中選擇「所有來源」。 若要檢視在所選來源中不屬於任何媒體查詢的選擇器，請按一下「@Media」窗格中的「全域」。

視覺輔助總覽

Dreamweaver 提供數種視覺輔助工具，協助您設計文件並大致預測其在瀏覽器中的顯示效果。您可以執行下列任何 操作：

• 將「文件」視窗立即貼齊到想要的視窗大小，以便查看元素是否適合頁面的尺寸。

• 使用影像藍圖做為頁面背景，可協助您複製以插圖或影像編輯應用程式 (如 Adobe® Photoshop® 或 Adobe® Fireworks®) 所建立的設計。

• 使用尺規和導引線來提供精準定位及調整頁面元素大小的視覺提示。

• 使用格線以便精確定位及調整絕對定義元素 (AP 元素) 大小。

  頁面上的格線標記可協助您對齊 AP 元素，而且在啟用貼齊功能時，AP 元素會在移動或調整大小時自動貼齊最接近的格線點 (其他物件不會貼齊格線，如影像和段落)。 無論是否顯示格線，貼齊功能都有作用。

放大和縮小顯示頁面

Dreamweaver 可讓您在「文件」視窗中增加顯示比例 (放大顯示)，以便您能檢查圖形的像素精確度、更輕易地選取小項目、設計含有小型文字的頁面，或設計大型頁面等等。

若要放大或縮小頁面，請選取「檢視 > 設計檢視選項 > 縮放」，然後選擇任何可用的縮放選項。

您可以從各種顯示比例選項中選擇。 您也可以選擇：

• 符合選取項目 - 選取物件或文字，然後選擇此選項，以選取項目填滿「文件」視窗。
• 全部符合 - 以整個頁面填滿「文件」視窗
• 符合寬度 - 以頁面的整個寬度填滿「文件」視窗

設定 Dreamweaver 的一般偏好設定

在 Dreamweaver 中設定文件的字體偏好設定

文件的編碼方式會決定文件出現在瀏覽器的方式。 Dreamweaver 字體偏好設定讓您以偏好的字體和大小來檢視指定的編碼方式。 不過，您在「字體偏好設定」對話方塊中選取的字體只會影響 Dreamweaver 顯示字體的方式，並不會影響瀏覽者的瀏覽器顯示文件的方式。 若要變更瀏覽器顯示字體的方式，必須使用「屬性」檢視窗或套用 CSS 規則來更改文字。

如需有關為新文件設定預設編碼的資訊，請參閱建立和開啟文件。

自訂 Dreamweaver 反白標示顏色

使用「醒目提示」偏好設定來自訂用於識別範本區域、程式庫項目、第三方標記、配置元素及 Dreamweaver 中程式碼的色彩。

更多類似項目

• 開啟相關檔案
• 有關在 Dreamweaver 中撰寫程式碼的一般資訊
• 設定程式碼撰寫偏好設定
• 檢視和編輯檔頭內容
• 使用視覺輔助以配置版面
• 預覽頁面
• 使用檔案面板中的檔案