用ps切割大圖片及其貼圖

切割大圖片在網頁製作中是爲了.加快顯示的速度,由於論壇上傳文件的限制.在貼圖中也可採用切割大圖片,將一個大圖分割成幾個小塊再經代碼處理以顯示完整的圖象.

現分三部分講解:

一 用ps製作圖片及圖片的分割

二 圖片的上傳

三.貼圖代碼的運用.

一:用ps製作圖片及圖片的分割

用ps新建圖片大小,尺寸設爲寬999  高1500象素.爲什麼要選用寬999  這是爲了便於在第三部分代碼中識別其所在的位置(當然也可以設爲寬1500象素,爲了方便理解貼圖代碼.故本教程圖片尺寸大小設爲寬999  高1500象素,不同大小的圖大家可靈活調整欲講到的三部分碼所涉及的數值.

1  在圖制好後合併所有的圖層,選擇工具箱中的切片工具,然後用鼠標的右鍵點擊圖層,此時出來這個對話框,點擊:劃分切片


圖片點擊可在新窗口打開查看此主題相關圖片如下:
圖片點擊可在新窗口打開查看 

因第三部分的代碼設定的表格爲6個,故在對話框中我們設定水平劃分6 .(垂直劃分:0)-------確定.

 

2 點ps最左上角的"文件"   存爲 web格式


圖片點擊可在新窗口打開查看此主題相關圖片如下:
200711201323194874.jpg
接下來如圖設置,點"存儲"

圖片點擊可在新窗口打開查看此主題相關圖片如下:

2007112013255973610.jpg

3,爲便於找到切片圖,你可以在e盤新建個文件夾,將"存儲"放在新建的文件夾中,(也可直接存放到桌面), 我存放的文件夾及文件名文件類型如下圖:


圖片點擊可在新窗口打開查看此主題相關圖片如下:
2007112013362790909.jpg

點擊保存

 

接下來打開你所建的文件夾,應看到一個images文件夾.一個爲中年論壇aaa.html網頁文擋.這兩個東兩是ps自動生成的.

打開images文件夾


圖片點擊可在新窗口打開查看此主題相關圖片如下:

2007112013474038057.jpg
 

二 圖片的上傳

按文件夾的文件順序編號依次上傳到論壇


圖片點擊可在新窗口打開查看此主題相關圖片如下:

2007112013503951876.jpg

得下如下6個圖片的地址:

(待續)


 

發佈了13 篇原創文章 · 獲贊 0 · 訪問量 11萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章