手把手:ImageReady切片教程

2023-11-19 17:35:50 來源/作者: / 己有:5人學(xué)習(xí)過
手把手:ImageReady切片教程1.拖出參考線,這時(shí)可以把文檔放大,以便參考線更準(zhǔn)確。

圖1

  2.使用切片工具,首先為上面的圓邊和下面的圓邊做切片。

圖2

  3.這一步,切出左邊和右邊的切片,單象素的切片,需要把畫布放大到1600/%,這樣才可以選擇單象素。

  在網(wǎng)頁中,左邊和右邊的切片,最終會(huì)變成單元格,如果最中間單元格里的內(nèi)容不是固定的,就需要使用設(shè)置單元格背景顏色的方法,也可以使用設(shè)置單元格背景圖片的方法,適應(yīng)表格中間內(nèi)容的填充。

圖3

  附帶源文件:

  4,再為中間一片添加切片,這時(shí)也可以放大文檔準(zhǔn)確切片。

圖4

  源文件

  5.還有一些沒有切片的區(qū)域,只有把它們變成用戶切片,它們才會(huì)固定。

圖5

  5.為了防止切出的表格變形,需要在“文件”>“輸出設(shè)置”>“切片”中,作如下設(shè)置。

圖6

  imageready不能輸出嵌套表格(fw可以),這時(shí),最好的方法,還是把一個(gè)文檔,分成幾個(gè)部分切片。

  流程:先把一個(gè)文檔,從上向下,根據(jù)內(nèi)容切成幾部分,輸出為“僅限圖象”。然后,分別打開這些圖片,做必要的切片,輸出為“html和圖像”。

圖7

  示例中,是把一個(gè)頁面,根據(jù)內(nèi)容,先切成幾部分,幾部分都輸出為圖片, 然后,再把這幾個(gè)圖片,分別切片。

  這么做的原因,也是為了防止網(wǎng)頁變形。

  在dreamweaver中,會(huì)生成從上到下的幾個(gè)表格:

  只是做一個(gè)例子,并不表示生成的代碼一樣。

  在dreamwever中,把幾個(gè)用ps切出的表格(最好事先把切出的文件,放在站點(diǎn)里,圖像放在image文件夾中),分別復(fù)制在網(wǎng)頁中,就可以了,這樣表格之間,是不會(huì)相互影響的。

  作者:付國(guó)濤

搜索更多相關(guān)主題的帖子:切片 ImageReady 教程 手把手 單元

簡(jiǎn)單的,我們教你,深?yuàn)W的,你來分享