先做一個簡單的說明為什么選擇Photoshop軟件而沒有選擇Firework軟件。Friework Dreamweaver Flash號稱網頁制作三劍客，Friework與Dreamwaver整合得更為緊密，在這里只所以選擇photoshop只是因為我的偏好，況且我對 firework軟件使用的次數很少，不太喜歡他提供的層面板。
在這里我們使用的PS的版本是CS3 以前的版本與此相差無幾，但注意不能使用迷你安裝版，必須是完整安裝。

再說一下我們為 什么要使用切片：
1 使用切片是最直白的網頁布局方法。不要再想如何去設計表格，也不要想什么DIV，你首先要想的是你的網頁要做成什么樣子？把你所想的畫出 來就行了!!?
2 使用切片可以有效地減小頁面文件的大小，提高瀏覽者瀏覽頁面的體驗。想想看是把一個圖片完整下載下來快，還是把一個圖片分成若干個小圖同時下載快呢？

如 何切片：
一 打開你設計好的PS圖，選擇切片工具

二? 按網頁的結構和圖片的特點進行切片
切 片的大水上和位置可以通過切片選項來進行調整
?
三 選擇文件菜單 另存為WEB格式命令，保存時會生成index.html 圖片文件會存放在images文件夾中(CS3要選擇存儲為html和圖片)
?
四 使用Dreamweaver軟件打開剛剛保存生成的html文件進行編輯，刪除不必須的圖片和進行內容的填充。

切片原則和常見問題：
?一 切片是生成表格的依據，切片的過程要先總體后局部，即先把網頁整體切分成幾個大部分，再細切其中的小部分。
二? 對于漸變的效果或圓角等圖片特殊效果，需要在頁面中表現出來的，要單獨切出來
三 在DW中進行編輯時，少用圖片，如果能用背景顏色代替的就使用背景顏色 能使用圖案的也盡可能使用圖案平鋪來形成背景
四 在DW中進行編輯時，刪除圖片時出面表格錯位如何辦？
??? 刪除圖片的時候記住圖片的長寬，再插入一個相同長寬的表格。
五 在DW中如何自定義表格的長寬？
??? 使用表格長寬一樣的圖片做為單元格的背景。
六 如何在圖片上輸入文字？
??? 把圖片設置成背景。

本文鏈接地址：http://www.qiexing.com/post/717.html

轉載于:https://www.cnblogs.com/net2/archive/2010/05/20/1739854.html

總結

以上是生活随笔為你收集整理的网站切图初学的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。