A. 新手做web後台界面設計，切圖應該輸出什麼格式
一般動態的圖片切成gif，
如果是大圖作為背景就用jpg，
如果是有透明度的圖片，切成png，
如果是一般集合背景，沒有特殊要求，jpg，png都可以。
一般切圖的時候，先考慮一下，會不會設計到上面的情況，如果很普通一張圖，什麼格式都無所謂。不用太相信教程，他們可能也是忽悠人的。看自己的需求來就好。
可能我回答的不夠全面，以後有新的發現的時候再來補充。希望採納！
B. 網頁如何切圖
問題一：網頁切圖怎麼做? 網頁設計切圖 網頁切圖怎麼做？網頁設計切圖
製作網頁，很多的時候，首先要用圖片處理軟體製作出網頁的效果圖。效果圖做好是一幅完整的圖片，不可能把這一整張的圖片都用在網頁里。把效果圖中有用的部分剪切下來作為網頁製作時的素材，這個過程就是切圖。（當然是用剪切、選擇工具也可以，但是用切片工具處理更精確。）
切圖的目的就是更加精確的進行網頁布局。
photoshop、fireworks等軟體都帶有切片工具。
問題二：頁面設計頁面製作 這種背景的頁面怎麼切圖的啊。。。主要是背景怎麼整的。。。 目前我無法判斷你那些圖片帶鏈接，所以只能大概的給你講一下（目前文字部分我先不管），具體我拿第三張來講給你吧。
首先，把所有要做鏈接的圖層都隱藏掉，剩下的層，就可以用來切圖，整知豎寬體背景纖山是藍色，所以css搞定就行。
其次，背景有一張整體的背景圖，這個需要全部單獨切下來，圖片上面不要帶任何其他元素，就只是這張單獨的圖片就好，布局的時候引用為背景！
然後，剩下的就是主體部分，上面的播放視頻和文字我就不講了，簡單，底部的汽車促銷圖片也切一張大圖就好，也簡單。
最後，就剩下最難搞的中間部分，大概想了一下，2種方法實現，如下：
1、切成整張大圖，需要做鏈接的地方，畫上不規則熱區就好了！這種比較簡單些。
2、圖片什麼樣，就切成什麼樣，每張小圖都單獨切出來（注意：要做成png格式保存，背景設置為透明），然後寫html的時候，用css畫出等大的不規則圖形，吧圖片當做背景加進去，然後用css絕對定位一下，如有鏈接加鏈接，完美實現！
備註：css畫不規則圖形，網上可以搜到教程，看一看就差不多，不難！
至於其他幾張圖，比較簡單，簡單說一下第二張，第二張的其實如果想簡單實現，那就除文字和純背景色外，整張切，然後有鏈接的地方加熱點就好，想做復雜一點，就可以用到我所說的css畫不規則圖形，純色的三個縱橫條，不用切，css畫出來，添加背景色，然後絕對定位就好，其他的該切多大就切多大，然後用css絕對定位，設置好z-index的關系，就ok了！
之前做過很多這樣的網站，這都是經驗之談，完全能實現，要有問題再問我！完全純手打啊~~
問題三：photoshop網頁切圖怎麼用 1、首先需要用photoshop把psd源文件打開，看看源文件的整體布局。源文件是分層的，方便切圖的層次。
2、切圖的工具叫做「切片」，在左側面板可以看到。右擊可以看到「切片工具」和「切片選擇工具」按鈕。
3、用放大鏡將所要切的圖片部分放大，可以用參考線確定大小，切圖是可以沿參考線切。
4、切換到切片工具，沿參考線劃出切片，右擊可以看到有可以編輯切片的選項，可以設置切片像素大小。
5、切好後就可以單擊菜單欄「文件」，選擇「存儲為web所用格式」選項。
6、選擇要存儲的切片，然後右上角可以設置圖片的格式、質量大小，設置好以後就可以單擊保存了。
7、保存需要保存的切片，選擇好路徑即可，單擊保存即完成。打開保存好的圖片，如圖。
注意事項
注意保存時最好自己設置路徑，settings選項。
問題四：怎麼用ps做html切圖 ，詳細！ 10分 先切小片然後寫代碼 不是一句話兩句話能說清楚的
問題五：UI 中網頁設計切圖怎麼切 PxCook，目前我還沒用上Mac，所以也不知道傳說中的Sketch到底多神奇。PxCook在Windows上標注還比較順手，雖然它還附帶切圖功能，但是比較雞肋，不推薦用它切圖。
切圖工具：
Cutterman 一款PS的插件，切圖非常方便，但不支持綠色免安裝版本PS，而搭亮且對PS版本要求比較高，針對CS 6的已經不維護更新了。推薦安裝官方完整版PS cc，然後自行破解。官網上有安裝使用教程，自己研究下吧，因為我也是最近才開始接觸這款插件。
Part 2 Photoshop
現在常用的幾種設計尺寸
1. 640*960 4時代的尺寸，剛接觸APP設計用的是這個尺寸，擬物盛行的時代(現在用這個尺寸設計的應該比較少了吧)；
2. 640*1136 5/5S/5C，IPhone更新，咱們設計也得跟著與時俱進(應該還有人用這個設計尺寸)，進入扁平的時代了；
3. 750*1334 6 目前我做設計稿的設計尺寸，IPhone6的尺寸，向下可以適配4，5，向上可以適配6 plus；我記得IP6推出後，我問總監應該用什麼尺寸設計，他說用IP6的吧，好適配，切出來就是@2x了，改一改上下都能照顧到。
問題六：網頁切圖是不是一般只切按鈕部分？別的比如背景都用CSS實現？ 一般來說，比如網站logo、網站相關的圖片(例如產品圖片,不規則的形狀圖片等)、漸變、特殊字體(宋體、黑體、微軟雅黑以外的字體)，幾乎都是要切成圖片來做的。切成圖片又分為2膽，一種通過設置css背景，另外一種是直接標簽加路徑調用。
其他的全部用css來實現。
問題七：ps如何切圖成HTML頁面 希望給一個詳細流程操作 修改好相應的文字與圖象之後，我們就將PSD文件輸出(X)HTML文件。
首先得先對PSD文件做切片，有兩種方法：
①使用工具欄上的「切片工具」，
然後在圖象上劃出一塊一塊的區域。
②使用基於參考線的切片，按ctrl+R調出標尺欄，
把滑鼠移動到標尺上，按住滑鼠左鍵，移動到圖象上，將會看到一條綠色的參考線，如圖
將參考線；排好，然後點一下工具欄上的切片工具圖表，然後點上面
選項欄里的「基於參考線的切片」。於是在原來的參考線上就變成了一塊一塊的切片了。
接下來就可以輸出了:
①依次選擇菜單欄上的「文件」→「存儲為Web所用格式」→「存儲」。
②接下來就會彈出一個「將優化結果存儲為」的窗口，如圖
在「保存類型」處有個下拉列框可以選擇，因為我們要存儲為網頁的格式，所以選擇「HTML和圖象(* html)」，再選擇「保存」就可以輸出憨個網頁格式的HTML文件與一個包含圖象的名為「images」的文件夾。
③如果我們需要輸出「div+css的網頁」我們還可以這么做：
在「設置」處的下拉列框，選擇「其他」
就會彈出一個「輸出設置」的窗口
在第2個下拉列框處選擇「切片」
選擇「生成CSS」
單擊「好」→「保存」就可以輸出一個目前流行的「div+css」的HTML網頁。
問題八：網頁美工是怎樣進行圖片切圖的 步驟如下：
1.首先我們需要用到的文件就是psd的文件了，一般都是由設計師來完成的，我們切圖也就是切psd文件，因為psd文件是分層的，所以想切哪裡切哪裡。
2.之後用Photoshop軟體打開psd文件，這里小魚用CC版本演示，其他版本大同小異。我們打開之後可以雙擊左側的放大鏡工具，將圖片縮放到原圖大小。
3.我們要切圖，當然用到的就是「切片」工具了，可以點擊左邊的切片工具，也可以右擊這個圖標選擇更多的相關工具。切圖都是用切片工具。
4.選擇好切片工具之後，想要切哪裡就直接拖動滑鼠就可以了，然後會出現切線，在切線框內右擊還可以彈出菜單。
5.點擊菜單的編輯切片選項還可以對切片進行編輯，可以編輯大小等項目。
6.但是如果我們只想要字怎麼辦，不要底層背景，那麼可以用「移動」工具。選擇移動工具，在不要的背景上單擊，這時候在「圖層」面板裡面就會選中這個圖層。注意勾選上面的「自動選擇圖層」。
7.把選中的不需要的背景前面的小眼睛去掉，最後只剩我們想要的部分。
8.然後點擊左上角菜單欄的「文件」，選擇「存儲為web所用格式」選項。
9.如果要透明的，那麼一般選擇png格式，如果要非透明的，那麼哪個格式存儲的文件小就選擇哪個，這樣能保證網頁載入速度快。然後點擊下面的「存儲」按鈕。
10.然後給圖片命名，選擇一個保存地址，最後選擇「選中的切片」，不然好多沒用的圖片都會保存下來。
11.最後找到保存好的圖片打開，已經是一個我們想要的圖片了。
問題九：如何把圖片切成HTML頁面 用 ImageReady
其次打開你想做切片的圖片
在英文輸入法下，在程序界面中按 K 切換到切片工具
在圖片上隨意進行切片
按CTRL+ALT+SHIFT+S 將優化結果存儲為
保存類型下拉框拉下來選擇「HTML和圖像」
進行保存
或者使用photoshop的 切片工具 操作！
這是教程
wenku./...a
wenku./...6
希望幫到你
問題十：網頁切圖什麼意思，怎麼切法 如果你登著QQ
同時按下Ctrl+Alt+A這三個鍵就可以切圖了。
如果沒登QQ，系統也有自帶的截圖功能，就是鍵盤上的PrtScrSysRq，不過這是全屏截圖
然後在開始~所有程序~附件中打開「截圖工具」，然後再按下ctrl+print（鍵盤上的PrtScrSysRq鍵）即可
切的圖可以保存在自己電腦，也可以發給自己的朋友。
謝謝！
C. 能否用通俗語言講一下web前端講的「切圖」到底是什麼意思
簡單說就是把一張大圖裁成若干張小圖
一張完整的web設計圖包括了很多元素，Logo、圖標、背景圖等等
設計師通常給的是Ps的分層設計文件，或者是Ai，當然這樣是最好的，當然也有設計師用的素材不是透明分層的，這個時候就需要我們自己摳圖了（這又是另外一個話題了，不談）
這時候就需要把我們需要的Logo、圖標、背景圖這些一一單圖提取出來使用到前端項目中，於是我們用到了Ps或Ai中切圖這個功能
D. 網頁切圖怎麼做 網頁設計切圖
網頁切圖怎麼做，網頁設計切圖的方法。
如下參考：
1.打開PS，點擊切片工具，如下圖所示。
E. 網頁設計好後的切圖是什麼意思呢
切圖就是把用設計軟體設置好的圖片切成相應的大小，切圖後再把圖片上傳就可以可以加快顯示速度，不用等整個圖片都下載以後顯示。
PS切圖步驟：
1、打開PS，然後點擊切片工具。
F. 網頁設計中圖像切圖技巧
網頁設計中圖像切圖技巧
在網頁的製作過程中，不時需要將圖像進行切圖處理。下面是我為大家整理的網頁設計中圖像切圖技巧，歡迎參考~
網頁製作技術伴隨著網路的快速發展而快速興起，目前，國內外計算機行業對於網頁製作的研究較多，但是由於受到初學者個人風格和操作技巧的影響，在網頁製作中普遍存在不同程度的問題。而對圖像進行切圖處理也是一個存在網頁製作中的問題。基於此，本文就網頁設計中圖像切圖技巧進行了探討，並提出了一些有關的技巧，相信對圖像切圖的工作能有一定的幫助作用。
1 切圖技術
切圖就是指在網頁製作過程中，用圖形圖像處理軟體提供的切片工具，將美工設計的網頁效果圖這種大幅圖像，分割成為一系列小的圖像，這些小圖像稱為原大幅圖像的切片。一張圖可以有多種切圖方案，但不是所有的切圖方案都適合後期的網頁製作的。因此需要在眾多切圖方案中，找出一種適合後期網頁編程的最佳切圖方案。本文中所說的切圖技術，就是指的實現最佳切圖方案的切圖技術。由於它遵循一些切圖原則和技巧，所以它能夠實現最佳切圖方案。
由於切圖時，圖像的最小單位是像素，矩形對邊上的像素個數應該是相同，或者遇到圓角應該是銳化的。但是在人工操作時，可能會發生像素個數的變化，或者圓角產生頓挫角。因此，在切圖時，將原圖採用300%以上的放大倍數切圖。切完整個大圖後，把一系列的切片全部選中，接著利用軟體中的圖像優化工具，即菜單欄中「窗口」下拉菜單「優化」命令對所有的小切片進行優化來解決以上問題。然後利用文件菜單下的「導出」命令生成HTML網頁和圖像，最後在網頁製作軟體DREAMWEAVER中建立站點，將上面導出的網頁和小圖像都放在網站里。導出的網頁文件是不能用的。因為一個網站的頁面型兆槐大小要求統一。因此，接下來的工作是在網頁製作軟體中製作表格。用分塊的思想來看整個網頁的布局，一個塊就是一個表格。把網頁看成是多個獨立的表格組成的。將導出的圖片插入到單元格中。日常工作中常用的圖形圖像處理軟體有Photoshop、Flash、Firework等，這些軟體中都有切片工具，但是在網頁製作時，圖形圖像處理軟體首選使用Firework。因為DREAMWEAVER中只要對圖像雙擊，系統會自動調用Firework軟體。
2 切圖原則
一張圖可以有多種相關的切圖方案，但不是所有的切圖方案都是合適網頁編程的。所以在切圖技術中，應該保證實現的是最佳切圖方案，因此切圖技術中還涉及了切圖的原則和切圖的技巧。
2.1 塊與切片的概念
在本文中所說的一個塊與切片概念是不同的。塊和切片都是網頁中的一部分，但是塊指的范圍比切片大。塊中可以包含一個或多個切片。塊是指在網頁上內容相關的'區域范圍。切片是從圖中相關范圍中分割出來的一小圖形。如果轉換成網頁後，塊對應了網頁中的表格，而切片對應的是表格中的單元格。
2.2 分塊的原則一：以相關內容為一塊
根據原圖中相關內容，確定整體的切分策略，即切分要有分塊的思想，把整個網頁看成是多個塊構成的，每個塊就是一個table，塊中每一個細節內容就是table中單元格中內容。即將整個網頁看成是由多個table組成的，然後在具體到每個table，去考慮裡面應該如何切。必須強調的是，應卜友該把整個網頁看成是多個獨立的塊構成，切片是塊中的內容。依據這種思想去切圖，然後在網頁製作軟體中，插入多個表格。塊對應成了網頁中的表格，切片對應成表格中的單元格內容。在切圖時，同一塊中的內容是完整的，也就是說，要保證完整的一部分在一個塊內，例如某區域的標題文字，網頁的LOGO，網頁的廣告，網頁的導航區等可以分別是一個獨立的塊，這樣做的目的是方便日後網頁編程和修改。
2.3 分塊的原則二：盡量分成大行，平行的切
當一個網頁的內容比較多時，在顯示網頁時是有時間差的，這時要求內容的顯示是從上而下從左到右逐行顯示網頁的內容，決不允許一個網頁上的內容雜亂的跳出來。因此，在分塊時也應該貫穿逐行分塊的原則。切圖的時候要盡量平行的切，也就是說，分成大行，然後再逐行的切。如果一個網頁的顯示頁面是由多個表格構成的，猜滾這樣做的目的是當客戶端瀏覽一個網頁時，由於它是由多個表格構成的，因此，客戶端與網頁伺服器會生成多個request請求，多個表格同時下載信息，因此網頁下載的速度就會相對快。避免出現把網頁整個頁面看成一個塊，然後塊里又分塊，出現塊中嵌套塊。因為這種結構在由切片轉換成網頁後就出現了表格的嵌套，表格的嵌套影響了客戶端網頁瀏覽的速度。
2.4 切片的原則：以屬性相同為依據
一般切圖原則是：屬性相同的區域適合分為一個切片。屬性相同主要是指顏色和形狀都沒有變化，或者在X或在Y方向上沒有變化。屬性漸變的區域適合分為一個切片，漸變有兩種表現形式顏色漸變，形狀漸變。
3 切圖的技巧
切圖也有技巧。構成一張圖片的信息量是非常大的，因此在伺服器中存儲一張圖片時占的容量也是很大的，同時從伺服器里下載圖片到客戶端也需要時間也就相當長。因此，在利用切片轉換成網頁時，可以利用一些技巧，即減少切片個數和減小切片的大小，可以解決以上存在的問題。
3.1 減少切片的個數
網頁上的文字與圖片信息都是存儲在網頁伺服器上的，一個切片就是一張小的圖片。根據顯示的點陣原理可以知道，對於同一張大圖像來說，切片數減少，存儲在網頁伺服器上這張圖的信息量也就減少了，也就是說在網頁伺服器上占的空間減少。所以當切片的背景是單一顏色，切片的文字沒有效果，這時就可以採取這種特殊的處理方式對此切片進行處理。即可以將單一顏色和文字沒有效果的切片丟掉，在DREAMWEAVER中打開站點，插入表格，在對應的單元格中，利用DREAMWEAVER軟體提供的設置單元格的背景色，直接從鍵盤上輸入文字內容。這種做法實現了切片的效果，同時可以使網頁服務上存儲的切片數減少了。以「京東商城特賣新」網頁頁面為例，在實驗中保證網頁頁面效果相同的情況下，採用減少切片個數和未採用減少切片個數方法，可以得到下面表中的數據。從下面表中的數據可以看出兩種處理辦法造成的結果是：未採用減少切片個數方法時，圖片總容量為102MB，而採用減少切片個數方法後，圖片總容量為40.3MB，明顯前後圖片的總容量變化很大，值得提倡這種做法。
3.2 減小切片大小
大面積的顏色相同的，或者形狀相同圖塊，可以只從原圖中切出一個像素的切片，然後DREAMWEAVER裡面，用切片平鋪形成所需要的圖。
;G. 網站前端切圖是什麼意思，主要做什麼
我們做網站的時候是要根據程序化來進行實現的，特別是做一個精品網站的時候，首先第一步就是設計網站，網站設計好之後即是切圖，切圖完就要加入div+css實現效果圖，以及flash動畫等功能了，切圖完成之後才到下一步開發程序，這就是從前端的設計、切圖到網站程序開發的一個過程。
網站的好壞，前端很重要，這是我們重視的一部分，前段必須把div+css做好，不能有多餘的代碼程序在裡面，前端要是沒有做好，往後的程序很影響seo的推廣，這是很多企業做網站的時候忽略掉的問題，我們應該一手抓，俗話說的好，贏在起跑線上，只有系統化的前端div+css，設計，切圖功能實現之後才有後面的程序製作，很多網站前端div+css做的亂七八糟的，不說兼容性行不行了，就是網路蜘蛛來獲取頁面的時候都很排斥的，所以說，切圖是一個精品網站必備的，重中之重，不可忽視。
我們經過美工的設計頁面，從每一張圖片的整合到功能的實現都是切圖來做的，切圖人員必須具備有細心的品性，要嚴格要求每一步的到位，否則將會給後面的程序帶來麻煩，一個精品網站的建設是要分為四個大的步驟進行的
第一、網站設計
第二、網站切圖+div+css+功能美化
第三、網站程序製作
第四、後台的調用
H. web網頁界面如何給前端標注，切圖
1、開發經常用到的格式： PNG、SVG、JPG、PDF、WebP
2、我們內部團隊實用的是藍湖，一鍵壓縮切圖，告別了二次加工，高效。
I. web前端 切圖
正常來說，挺大，但也分公司
現在的公司有的分專做css與js的。
樓主也可以考慮javascript工程師
J. 前端如何切圖（超詳細，超小白）
身為一名前端開發者，$\color{red}{ 切圖 } $雖然可以被UI或者藍湖等工具解決，但是這也是屬於前端er的必修課。因此，我也是把切圖分享作為我第一篇博客的分享內容。
下面是直接操作的步驟，如何打開psd圖等操作應該也不用我廢話了。
1.第一步就是找到你需要的圖或者icon的圖層，並選中它（如果有疊加需要多選就按住ctrl進行多選）。
2.選擇上方工具欄，選擇 圖層—>復制圖層，
然後會彈出一個編輯框，重點：文檔一定要選擇 新建 ,名稱可以填寫自己需要的，然後點擊確定，就會有新的圖了。
3.因為畫片大小可能不太符合自己的預期，可以選擇上方工具欄 圖像—>裁切，會自動切成合適的大小。
4.到這一步基本上就已經成功了，最後就是保存了。依然是上方工具欄，左上角，文件--->導出--->存儲為web所用格式--->選擇四聯--->選擇PNG-24格式（根據自己需要，我一般使用這個），最後點擊 存儲 就可以了。