網頁切圖怎么做? 網頁設計切圖
網頁切圖怎么做，網頁設計切圖的方法。
如下參考：
1.打開PS，點擊切片工具，如下圖所示。
2.點擊切片工具，可以將圖片切割成所需的大小，如下圖所示。
3.剪切圖片后，點擊導出特殊網頁使用的格式，如下圖所示。
4.輸入屬導出web的格式頁面，并按住shift鍵選擇所有部分。
5.導出格式設置為JPEG，如下所示。
6.最后，單擊save存儲，如下圖所示。
網頁如何切圖
問題一：網頁切圖怎么做? 網頁設計切圖 網頁切圖怎么做？網頁設計切圖
制作網頁，很多的時候，首先要用圖片處理軟件制作出網頁的效果圖。效果圖做好是一幅完整的圖片，不可能把這一整張的圖片都用在網頁里。把效果圖中有用的部分剪切下來作為網頁制作時的素材，這個過程就是切圖。（當然是用剪切、選擇工具也可以，但是用切片工具處理更精確。）
切圖的目的就是更加精確的進行網頁布局。
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、保存需要保存的切片，選擇好路徑即可，單擊保存即完成。打開保存好的圖片，如圖。
注意事項
注意保存時最好自己設置路徑，ttings選項。
問題四：怎么用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.baidu/...a
wenku.baidu/...6
希望幫到你
問題十：網頁切圖什么意思，怎么切法 如果你登著QQ
同時按下Ctrl+Alt+A這三個鍵就可以切圖了。
如果沒登QQ，系統也有自帶的截圖功能，就是鍵盤上的PrtScrSysRq，不過這是全屏截圖
然后在開始~所有程序~附件中打開“截圖工具”，然后再按下ctrl+print（鍵盤上的PrtScrSysRq鍵）即可
切的圖可以保存在自己電腦，也可以發給自己的朋友。
謝謝！
網頁設計好后的切圖是什么意思呢
切圖就是把用設計軟件設置好的圖片切成相應的大小，切圖后再把圖片上傳就可以可以加快顯示速度，不用等整個圖片都下載以后顯示。
PS切圖步驟：
1、打開PS，然后點擊切片工具。
2、點擊切片工具后，就可以把圖片切成需要的大小。
3、切好圖片后，點擊導出web所用格式。
4、進入導出web所用格式頁面，按住shift鍵把所有切片都選中。
5、導出格式設置為JPEG。
6、最后點擊存儲就可以了。
網頁設計中圖像切圖技巧
網頁設計中圖像切圖技巧
在網頁的制作過程中，不時需要將圖像進行切圖處理。下面是我為大家整理的網頁設計中圖像切圖技巧，歡迎參考~
網頁制作技術伴隨著網絡的快速發展而快速興起，目前，國內外計算機行業對于網頁制作的研究較多，但是由于受到初學者個人風格和操作技巧的影響，在網頁制作中普遍存在不同程度的問題。而對圖像進行切圖處理也是一個存在網頁制作中的問題。基于此，本文就網頁設計中圖像切圖技巧進行了探討，并提出了一些有關的技巧，相信對圖像切圖的工作能有一定的幫助作用。
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里面，用切片平鋪形成所需要的圖。
;
網頁切圖是什么?
做網站切圖是個什么意思？具體是怎么做的啊？
首先你說的做網站包括網站前臺與后臺，前臺就是我們能看到的，雞臺是網站管理員能看到的。前臺包括網站頁面設計，網站靜態頁制作，添加動態效果等。 切片屬于網站頁面設計后，把一張效果圖切成一塊一塊的，再用div+css布局組回效果圖那個布局。 切片的目的一個是為了減少網站打開時的加載時間，另一個是為了網站靜態頁制作。 你可以看到你提問的這個頁面是由一個一個的小圖片和文字，鏈接組成的。原先設計的時候是一張圖片，就是用切片切成這樣的。切片一般我們用PS切的。
網頁設計中所說的切圖是網頁制作的意思嗎？？？
嚴格地說，切圖和制作不是一回事。切圖是把設計圖分割成小的網頁用的合理的圖片。制作是圖片到html的過程。
但是實際上效果最好的做法是 邊切常邊制作，這樣邏輯思維清晰，而且效率也高。
不過看工作流程和個人習慣了。
網頁美工切圖需要會什么
你div和css學一些常用的基礎就可以了，還要會JavaScript，但是最主要還是要學會怎么使用工具，切圖片的話用Pho矗oshop就行，要熟悉里面的切片工具，還要會Dreamweaver，可以用來調整頁面，要做動畫的話可以用flash，呵呵，做一個好的美工可不容易，主要是對美和顏色搭配有一種非常敏感的感覺，美工做好一個頁面90%的時間花在設計圖片上了，10%用工具軟件切好。
網頁設計切圖是什么意思
設計好只是用ps做出來的網站效果圖，
需要根據需要切出相應圖片
然后用Dreamweaver將圖片按照網頁的要求拼接出來。
圖片越小，瀏覽器加載的速度就快。 像整個背景可以切1px 設置下 with和 hight 就好了
總的來說 圖片越小越好 不怕多切
網頁設計好后的切圖是什么意思呢
設計好只是用ps做出來的網站效果圖，
需要根據需要切出相應圖片
然后用Dreamweaver將圖片按照網頁的要求拼接出來。
圖片越小，瀏覽器加載的速度就快。 像整個背景可以切1px 設置下 with和 hight 就好了
總的來說 圖片越激越好 不怕多切
網頁設計切圖有什么作用
制作網頁，很多的時候，首先要用圖片處理軟件制作出網頁的效果圖。效果圖做好是一幅完整的圖片，不可能把這一整張的圖片都用在網頁里。把效果圖中有用的部分剪切下來作為網頁制作時的素材，這個過程就是切圖。（當然是用剪切、選擇工具也可以，但是用切片工具處理更精確。）
切圖的目的就是更加精確的進行網頁布局。
photoshop、fireworks等軟件都帶有切片工具。
網站前端切圖是什么意思，主要做什么
ps切圖方法如下：
1、首先打開需要處理的圖片。
2、選擇左側工具欄“切片”。
3、將需要切片的區域拉出選框。注：框選出圖片以外的地方會自動對其到圖片。
4、在框選過程中，如果有沒有框選或者重復框選的區域，系統會自動幫我們生成空白區域或者重復區域并對齊到圖像。
5、系統自動生成過程中會生成一些并不是我們想要的多余圖片，保存到桌面，看一下效果。
6、所以在框選切片區域的時候一定要準確選擇想要切片的區域。
7、將圖片準確切割，并點擊菜單“文件”——”存儲為web和設備所用格式（D)“，選擇保存位置和名稱。
8、找到保存位置，打開可以看到，已經達到想要切片的效果。
注意事項：
1、切片區域選擇準確。
2、格式選擇根據需要選擇，一般為“HTML和圖像”。
切圖是什么意思
切圖是指將設計稿切成便于制作成頁面的圖片，并完成html+css布局的靜態頁面，通俗來講，把一張設計圖 利用到切片工具 把自己所需的切成一張張小圖，然后用DIV+CSS完成靜態頁面書寫，完成CSS布局。
切圖到底什么意思啊！！
制作網頁，很多的時候，首先要用圖片處理軟件制作出網頁的效果圖。效果圖做好是一幅完整的圖片，不可能把這一整張的圖片都用在網頁里。把效果圖中有用的部分剪切下來作為網頁制作時的素材，這個過程就是切圖。（當然是用剪切、選擇工具也可以，但是用切片工具處理更精確。）
切圖的目的就是更加精確的進行網頁布局。
photoshop、fireworks等軟件都帶有切片工具。
網頁切圖什么意思，怎么切法
如果你登著QQ
同時按下Ctrl+Alt+A這三個鍵就可以切圖了。
如果沒登QQ，系統也有自帶的截圖功能，就是鍵盤上的PrtScrSysRq，不過這是全屏截圖
然后在開始~所有程序~附件中打開“截圖工具”，然后再按下ctrl+print（鍵盤上的PrtScrSysRq鍵）即可
切的圖可以保存在自己電腦，也可以發給自己的朋友。
謝謝！
網頁設計好后的切圖是什么意思呢
網頁設計好后的切圖是將設計稿切成便于制作成頁面的圖片，并完成html+css布局的靜態頁面，有利于交互，形成良好的視覺感。通俗來講，把一張設計圖利用到切片工具，把自己所需的切成一張張小圖，然后用DIV+CSS完成靜態頁面書寫，完成CSS布局。
設計好的網頁都需要切圖，主流的是dreamweaver、photoshop軟件，還有sketch、firework等，低端QQ切圖，網頁切圖等。切圖為后端編程者帶來方便，提高效率，讓網頁稿有了交互性，實現平時看到的各種各樣的功能，畫面瀏覽速度快，有利于優化。
擴展資料：
一般我們從設計師那得到的都是psd文件，里面有幾十或者上百個圖層，一般會根據內容分好文件夾，有文字有圖片，有的只在特殊情況下顯示的，這時候就需要根據自己的需要導出不同的圖。
切圖的時候也會有許多考慮，比如把哪些內容壓縮成一張圖片，什么時候用透明背景PNG，什么時候用CSS Sprite（把瑣碎的小圖比如按鈕、logo復制到一張透明背景的圖上然后保存為一張圖，再用background position去提取。）文字是切成圖片，還是復制到HTML里。
一般情況下都不會把文字切成圖，除非用到比較特殊的字體或者變形等等，然后即使是photoshop保存為web格式導出的圖，有時候尺寸也是很大的，特別是PNG，這時要使用一些專業壓縮工具進行二次壓縮。
當然有些有前端經驗的設計師會把切好的圖片發給你，這樣就可以直接開始寫HTML和CSS了，但是建議還是盡量自己切，掌握熟練的切圖技巧也是一個前端應該有的技能。
參考資料來源：百度百科-切圖
百度百科-靜態頁切圖
