photoshop cc 切片工具教程(2)

三、編輯切片信息

創(chuàng)建切片之后，您可以編輯切片信息通過(guò)以下兩種方式中的任一種。一種要做的就是點(diǎn)擊切片選擇工具，單擊你想編輯的切片，然后點(diǎn)擊菜單欄中>為當(dāng)前切片設(shè)置選項(xiàng)的按鈕。

另一個(gè)選擇是右鍵單擊切片，在彈出的菜單中，選擇編輯切片選項(xiàng)。

兩種選擇都將彈出如下的切片選項(xiàng)對(duì)話框。

正如您所看到的，對(duì)話框里有許多設(shè)置。

a.切片名稱：打開(kāi)網(wǎng)頁(yè)之后顯示的名稱

b.URL：點(diǎn)擊這個(gè)被編輯的圖片區(qū)域后，會(huì)跳到你輸入的目標(biāo)網(wǎng)址內(nèi)

c.目標(biāo)：指定載入的URL幀原窗口打開(kāi)，表示是在還是在新窗口打開(kāi)鏈接

d.消息文本：鼠標(biāo)移到這個(gè)塊時(shí)瀏覽器左下角顯示的內(nèi)容

e.Alt標(biāo)記：圖片的屬性標(biāo)記，鼠標(biāo)移動(dòng)到這塊時(shí)鼠標(biāo)旁的文本信息

f.切片的尺寸：設(shè)置塊的x、y軸坐標(biāo)，W、H的精確大小

四、保存網(wǎng)頁(yè)

一旦你滿意你的布局后，選擇文件>存儲(chǔ)為Web所用格式，保存圖片。

在這里，您可以為切片設(shè)置文件類型或者使用網(wǎng)頁(yè)對(duì)話框中列出默認(rèn)設(shè)置。完成設(shè)置后，單擊存儲(chǔ)按鈕。

這時(shí)會(huì)彈出一個(gè)存儲(chǔ)優(yōu)化結(jié)果的對(duì)話框，底部的對(duì)話框是幾個(gè)重要的設(shè)置。

a.格式:你有三個(gè)選擇，分別是HTML和圖像，僅限圖像和僅限HTML。

b.設(shè)置:您選擇自定，背景圖像，默認(rèn)設(shè)置，XHTML和其他。

c.切片:所有切片，所有用戶切片和選中切片。

對(duì)于本教程我使用的是HTML和圖像(一般都這么保存)，默認(rèn)設(shè)置和所有切片。完成設(shè)置后，選擇您想要保存文件的文件夾，并單擊保存按鈕。這時(shí)會(huì)創(chuàng)建一個(gè)HTML文件和一個(gè)包含六個(gè)圖像文件，它們?cè)谕粋�(gè)大文件夾中。

這是一個(gè)在Adobe Dreamweaver中的分區(qū)屏幕的HTML文件。你可以看到，代碼很簡(jiǎn)單也很好用。

五、結(jié)論

正如您可以看到的，當(dāng)你有一個(gè)大圖片時(shí)，圖像分割是非常有用的。通過(guò)將它分解成小圖，加載時(shí)小圖一個(gè)一個(gè)加載，讓用戶逐步看到更多。這對(duì)于網(wǎng)速慢的用戶很有幫助。