拖曳相對應的尺規。
上次更新時間
2021年4月27日
在 Dreamweaver 中使用視覺輔助以配置版面，包括設定尺規、設定版面導引線、將導引線用於範本、使用版面格線，和使用影像藍圖。
設定尺規
尺規 可協助您測量、組織和計劃您的版面配置。尺規可以出現 在頁面的左側和上方邊框，以像素、英寸 或公分為標記。
- 若要開啟和關閉尺規，請選取「檢視 > 設計檢視選項 > 尺規 > 顯示/隱藏」。
- 若要變更原點，請在「文件」視窗中，將「設計」檢視左上角的尺規原點圖示
拖曳到頁面上的任何位置。 - 若要將原點重設為預設的位置，請選取「檢視 > 設計檢視選項 > 尺規 > 重設原點」。
- 若要變更度量單位，請選取「檢視 > 尺規」，然後選取「像素」、「英吋」或「公分」。
設定版面導引線
Guides 是您從尺規拖曳到文件上的線條。它們可協助您更精確地放置和對齊物件。您也可以使用 Guides 來測量頁面元素的大小，或模擬網頁瀏覽器的 摺疊 (可見 區域)。
為了協助您對齊元素，您可以 將元素貼齊至 Guides，並將 Guides 貼齊至元素。(元素 必須絕對定位，貼齊功能才能運作。) 您也可以鎖定 Guides 以防止其他使用者意外移動 Guides。
建立水平或垂直 Guides
將參考線定位在「文件」視窗中並釋放滑鼠按鈕 (再次拖曳即可重新定位參考線)。
備註
依據預設，Guides 會記錄為從文件頂部或左側開始的絕對像素測量值 ，並相對於尺規原點顯示。若要將參考線記錄為百分比， 請在建立或移動參考線時按住 Shift 鍵。
顯示或隱藏導引線
選取「檢視 > 參考線 >
顯示參考線」。
將元素貼齊導引線
- 若要將元素貼齊導引線，請選取「檢視 > 設計檢視選項 > 導引線 > 貼齊導引線」。
- 若要將導引線貼齊元素，請選取「檢視 > 設計檢視選項 > 導引線 > 導引線貼齊元素」。
備註
當您重新調整元素，例如絕對定位元素 (AP 元素)、表格和影像等大小時，重新調整大小後的元素便會貼齊導引線。
鎖定或解除鎖定所有導引線
選取「檢視 > 設計檢視選項 > 導引線 > 鎖定導引線」。
檢視並移動參考線到特定位置
將滑鼠指標停留在參考線上方
即可檢視其位置。
按兩下導引線。
在「移動參考線」對話框中輸入新位置，然後
按一下「確定」。
檢視導引線之間的距離
按住 Control (Windows) 或 Command (Macintosh) 鍵
並將滑鼠指標停留在兩條參考線之間的任何位置。
備註
測量單位與尺規使用的測量單位相同。
模擬網頁瀏覽器的摺疊 (可見區域)
選取「檢視 > 設計檢視選項 > 導引線」，然後從選單中選取預設的瀏覽器大小。
移除導引線
將導引線拖曳到文件外。
變更導引線設定
選取「檢視 > 設計檢視選項 > 導引線 > 編輯導引線」，設定下列選項，然後按一下「確定」。
導引線顏色
指定導引線的顏色。 按一下色彩 色票並從檢色器中選取色彩，或在文字框中輸入十六進位 數字。
距離色彩
指定當您將滑鼠指標停留在 Guides 之間時，顯示為距離指示器的線條色彩。按一下 色彩色票並從檢色器中選取色彩，或在 文字框中輸入十六進位數字。
顯示導引線
在「設計」檢視中顯示導引線。
貼齊導引線
當您在頁面上移動元素時，使頁面元素貼齊 Guides。
鎖定導引線
將導引線鎖定在某個位置。
導引線貼齊元素
當您拖曳導引線時，讓導引線貼齊頁面上的元素。
全部清除
清除頁面上的所有導引線。
將導引線用於範本
將參考線新增至 Dreamweaver 範本時， 該範本的所有執行個體都會繼承這些參考線。但是，範本執行個體中的 Guides 會被視為可編輯區域，因此使用者可以修改它們。範本實例中修改的 Guides 會在實例使用主要範本更新時還原到原始位置。
您也可以在範本實體中加入自己的導引線， 以此方式新增的 Guides 在範本實例使用主要範本更新時不會被覆寫。
使用版面格線
拼貼會在「文件」視窗中顯示水平和垂直線條系統。它有助於精確放置物件。您可以讓絕對定位的頁面元素在移動時自動貼齊格線，並透過指定格線設定來變更格線或控制貼齊行為。無論格線是否可見，貼齊功能都會作用。
顯示或隱藏格線
選取「檢視 > 設計檢視選項 > 格線 > 顯示格線」。
啟用或停用貼齊功能
選取「檢視 > 設計檢視選項 > 格線 > 貼齊格線」。
變更格線設定
選取「檢視 > 設計檢視選項 > 格線 > 格線設定」。
設定選項，並按一下「確定」套用變更。
顏色
指定格線的顏色。 按一下色票並從檢色器中選取色彩，或在文字框中輸入十六進位制數字。
顯示格線
在「設計」檢視中顯示格線。
貼齊格線
讓頁面元素貼齊格線的線條。
間距
控制格線之間的距離。 輸入數字並從選單中選取「像素」、「英吋」或「公分」。
顯示
指定格線要以實線或點狀顯示。
備註
如果未選取「顯示格線」，格線不會出現在文件中，也不會看到任何變更。
使用影像藍圖
您可以使用影像藍圖作為指南，重新建立在 Adobe Freehand 或 Fireworks 等圖形應用程式中建立的頁面設計。
影像藍圖是放置在文件視窗背景中的 JPEG、GIF 或 PNG 影像。您可以隱藏影像、設定其不透明度並變更其位置。
影像藍圖只在 Dreamweaver 中可見；在瀏覽器中檢視頁面時不可見。當影像藍圖可見時，頁面的實際背景影像和色彩在「文件」視窗中不可見；但是，在瀏覽器中檢視頁面時，背景影像和色彩會可見。
在「文件」視窗中放置影像藍圖
執行下列其中一項作業：
選取「檢視 > 設計檢視選項 > 影像藍圖 > 載入」。
選取「檔案 > 頁面屬性」，然後在「影像藍圖」類別中按一下「瀏覽」(位於「影像藍圖」文字方塊旁邊)。
瀏覽至您的影像檔，然後按一下「確定」。
在「頁面屬性」對話框中，拖曳「影像透明度」滑桿以指定影像的透明度，然後按一下「確定」。
若要隨時切換到另一個影像藍圖，或是變更目前影像藍圖的透明度，請選取「檔案 > 頁面屬性」。
顯示或隱藏影像藍圖
選取「檢視 > 設計檢視選項 > 影像藍圖 > 顯示」。
變更影像藍圖的位置
選取「檢視 > 設計檢視選項 > 影像藍圖 > 調整位置」。
若要精確指定影像藍圖的位置，請在 X 和 Y 文字框中輸入座標值。
若要一次移動影像 1 個像素，請使用方向鍵。
若要一次移動影像 5 個像素，請按住 Shift 鍵並按方向鍵。
重設影像藍圖的位置
選取「檢視 > 設計檢視選項 > 影像藍圖 > 重設位置」。
影像藍圖會回到「文件」視窗的左上角 (0,0)。
將影像藍圖對齊選取的元素
在「文件」視窗中選取元素。
選取「檢視 > 設計檢視選項 > 影像藍圖 > 對齊選取範圍」。
影像藍圖的左上角會與 所選取元件的左上角對齊。
設定影像藍圖屬性
設定影像藍圖的屬性 (即用作設計頁面指南的影像檔案)。
請執行下列其中一項作業：
- 按一下「檔案 > 頁面屬性」
- 按一下「視窗 > 屬性」，然後按一下文字屬性檢視窗中的「頁面屬性」。
從「頁面屬性」對話方塊中，選取「影像藍圖」。 您可以從這個面板中設定下列選項：
- 影像藍圖：指定要作為複製設計指南的影像。這個影像僅供參考之用，而且當文件顯示在瀏覽器中時，並不會顯示該影像。
- 透明度：決定影像藍圖的不透明度，從完全透明到完全不透明。
