設計檢視

更新：2007 年 11 月

[設計] 檢視使用類似於 WYSIWYG 的檢視，顯示 ASP.NET Web 網頁、主版頁面 (Master Page)、內容頁面、HTML 網頁，和使用者控制項。[設計] 檢視可讓您加入文字和項目，然後調整其位置和大小，並使用特殊功能表或 [屬性] 視窗設定其屬性。

將項目加入網頁時，Visual Web Developer 會建立您也可以在 [原始碼] 檢視中編輯的對應標記。如需詳細資訊，請參閱原始碼檢視。

若要切換至 [設計] 檢視，請按一下 [HTML 設計工具] 視窗底端的 [設計] 索引標籤。

注意事項：
[設計] 檢視只會顯示文件的本文，即 <body> 和 </body> 標記之間的內容。雖然您可以使用 [文件屬性] 視窗編輯 head 項目的一些屬性 (例如文件標題)，但是必須切換至 [原始碼] 檢視，才能編輯不在 body 項目內部的項目屬性。

設計檢視與 Web 瀏覽器的檢視之差異

[設計] 檢視提供您類似 WYSIWYG 編輯的檢視，網頁的呈現方式就和在瀏覽器中顯示一樣。但是，[設計] 檢視不會完全符合網頁將呈現的樣子，所以您必須在瀏覽器 (或在多個瀏覽器) 中測試網頁，以確定網頁會以所設計的方式呈現。

同一份文件在 [設計] 檢視中顯示的內容與在 Web 瀏覽器中顯示的內容，會有下列差異：

設計介面是可編輯的。
有些在 [設計] 檢視中顯示的項目主要用於編輯，而不是要呈現在瀏覽器中，例如資料來源控制項。大多數只有在編輯時才出現的控制項，在 [設計] 檢視中會以灰色方塊呈現。
有些字元和段落格式的顯示可能會和特定瀏覽器中顯示的不一樣 (如果該 Web 瀏覽器以不同於 [設計] 檢視的方式實作該格式)。
選項性的，可以使用編輯器顯示方塊、符號，和圖示標記伺服器控制項。如需詳細資訊，請參閱選項對話方塊、HTML 設計工具、顯示。
超連結無作用。
用戶端指令碼不會執行。
伺服端程式碼未執行。
當指標移至支援替代文字的項目時 (例如影像)，工具提示中不會顯示這個替代文字。

為了協助您編輯網頁，[設計] 檢視會顯示通常在瀏覽器中看不見的某些項目，例如隱藏欄位。[設計] 檢視也會顯示在執行階段時不會呈現標記的灰色方塊或其他 ASP.NET 伺服器控制項表示，例如資料來源控制項。

此外，可以選擇顯示框線和符號，這些框線和符號可協助您使用網頁上的項目和標記。如需詳細資訊，請參閱 HOW TO：在設計檢視中顯示隱藏的資訊。

在 [設計] 檢視中使用包含 Null 字元的範本時，會截斷接在 Null 字元後面的字元。這樣不會遺失任何資料，但是 [設計] 檢視不會顯示範本中接在 Null 字元後面的字元。

網頁中的項目實際上是由上而下配置。根據預設，在瀏覽器中呈現網頁時，會以相同的由上而下順序呈現項目。您也可以使用二維方式配置項目，以水平和垂直座標將項目定位在網頁上的任何位置。這個配置選項會利用所有樣式中都可使用的位置選項。如需詳細資訊，請參閱在設計檢視中定位項目。

為了協助您在項目之間移動並選取項目，[設計] 檢視提供了下列選項：

標記導覽：標記導覽會顯示目前的項目，以及其所屬之父標記的階層架構。您可以使用標記導覽查看具有焦點 (Focus) 的項目，並從目前的項目移至階層架構中較上層的項目。如需詳細資訊，請參閱 Visual Web Developer 中的 HTML 編輯器標記巡覽。
文件大綱：[文件大綱] 視窗可以讓您找出並選取文件內的所有項目，包括不顯示的項目。如需詳細資訊，請參閱 HOW TO：在 Visual Web Developer 的 HTML 編輯器中巡覽。
屬性視窗：當您從 [屬性] 視窗頂端的下拉式清單 (Drop Down List) 選取項目時，編輯器便會在文件中選取該項目。

您可以使用下列方式，在 [設計] 檢視中將項目加入至網頁：

在 [設計] 檢視中，有許多 ASP.NET 伺服器控制項會顯示智慧標籤，可快速存取最常用於設定控制項的設定和動作。根據預設，當您第一次將控制項加入至網頁時會顯示智慧標籤。也可以隨時使用快速鍵功能表或按一下智慧標籤的符號，即可顯示智慧標籤。

您不能在 [設計] 檢視中使用 [屬性] 視窗來變更運算式的值。例如，如果在 [原始碼] 檢視中對控制項指派運算式，則無法在 [設計] 檢視中變更該運算式的值。由於運算式的值是計算而來，您應該使用 [原始碼] 檢視來變更運算式。

從 [原始碼] 檢視切換至 [設計] 檢視時，您可能需要重新整理設計工具才能看到某些類型的檔案變更。例如，已剖析主題程式碼但未編譯，因此，在 [原始碼] 檢視中對主題程式碼的變更，需要先重新整理，您才能在設計工具中看到這些變更。

若要重新整理設計工具，您可以執行下列其中一項：