分割網頁

切片可將影像分割成幾個較小的影像，這些小片段可以利用 HTML 表格或 CSS 圖層在網頁上重新組合。藉由分割影像，您可以指定不同的 URL 連結以建立網頁導覽，或使用個別的最佳化設定來最佳化影像的各個片段。

您可以使用「儲存為網頁用」指令轉存及最佳化切片的影像。Photoshop 會將每一個切片儲存為個別檔案，並產生所需的 HTML 或 CSS 程式碼以顯示切片的影像。

處理切片時，請記住下列要點︰

• 您可以使用「切片」工具或藉由建立圖層式切片來建立切片。

• 建立切片後，可以使用「切片選取」工具 選取切片，然後移動它、調整它的尺寸，或是將它對齊其他切片。

• 您可以在「切片選項」對話框中設定每個切片的選項，例如切片類型、名稱和 URL。

• 您可以使用「儲存為網頁用」對話框中的不同最佳化設定，將每一個切片最佳化。

切片的分類是依據其內容類型 (表格、影像、沒有影像) 以及建立方式 (使用者、圖層式、自動)。

使用「切片」工具建立的切片稱為使用者切片；從圖層建立的切片稱為圖層式切片。當您建立新的使用者切片或圖層式切片時，也會產生額外的自動切片，以便容納影像中的其餘區域。換句話說，使用者切片或圖層式切片未定義到的影像區域，都會以自動切片填滿。每次新增或編輯使用者切片或圖層式切片時，都會重新產生自動切片。您可以將自動切片轉換成使用者切片。

使用者切片、圖層式切片和自動切片的外觀各不相同，使用者切片和圖層式切片是由實線定義，而自動切片則是由虛線定義。此外，使用者切片和圖層式切片會顯示不同的圖示。您可以選擇要顯示或隱藏自動切片，讓您較為容易檢視使用者切片和圖層式切片的工作內容。

次切片是一種自動切片，建立重疊切片時，就會產生次切片。當您儲存最佳化的檔案時，次切片會顯示出影像的分割方式。雖然次切片已加上編號並顯示切片符號，但是您不能將它們與下面的切片分開來選取或編輯。每次排列切片的堆疊順序時，都會重新產生次切片。

切片是以下列不同的方式建立：

• 自動切片會自動產生。

• 使用者切片則是由「切片」工具建立。

• 圖層式切片是以「圖層」面板建立。

將網頁切片

您可以使用切片工具直接在影像上繪製切片線段，或者是使用圖層設計圖像，然後以圖層為基礎來建立切片。

使用切片工具建立切片

自參考線建立切片

自圖層建立切片

圖層式切片會包含圖層中所有的像素資料。如果移動圖層或編輯圖層的內容，切片區域就會自動調整以包含新的像素。

和使用者切片比起來，圖層式切片較不具彈性；不過，您可以將圖層式切片轉換 (「提升」) 成使用者切片。請參閱將自動切片與圖層式切片轉換成使用者切片。

將自動切片與圖層式切片轉換成使用者切片

由於圖層式切片與圖層的像素內容連結在一起，因此將它移動、組合、分割、調整尺寸和對齊的唯一方式，就是編輯圖層，不然就是要將它轉換成使用者切片。

影像中所有的自動切片都會連結在一起，共享相同的最佳化設定，如果您想要針對某個自動切片進行不同的最佳化設定，就必須將它提升為使用者切片。

檢視切片與切片選項

您可以在 Photoshop 和「儲存為網頁用」對話框中檢視切片。下列特性可以幫助您辨識、區分不同的切片：

定義切片的邊界。實線表示該切片是使用者切片或圖層式切片；虛線則表示該切片是自動切片。

將使用者切片和圖層式切片與自動切片區分出來。依預設，使用者切片和圖層式切片有藍色符號，自動切片則有灰色符號。

此外，「儲存為網頁用」對話框還會調整顏色，將未選取的切片變成灰色。這些調整只用於顯示之用，不會影響最終影像的顏色。根據預設，自動切片的色彩調整量是使用者切片的兩倍。

切片是從影像的左上角開始，依左到右、上到下的順序從 開始編號。如果更改切片的排列方式或切片總數，就會更新切片編號反映出新的順序。

下列標誌或圖示用於表示特定狀況。

使用者切片包含影像內容。

使用者切片不包含影像內容。

切片是圖層式。

顯示或隱藏切片邊界

顯示或隱藏自動切片

顯示或隱藏切片編號

更改切片線段的顏色