今天給大家分享一下我自己在前端工作中的一些切圖小技巧，雖然好的UI會給我們把圖切好，但是他們切的圖不一定百分之百符合我們的需求，所以還是自己動手豐衣足食嘛，看本教程之前希望大家能先看看慕課網的切圖教程 http://www.imooc.com/learn/506 哦。

這裏給大家介紹我在實際工作中用的兩種切圖方法，一種是“圖層切圖”，這種切圖方式比較適合切形狀不規則的png格式的小圖標，如企業logo等等，而另外一種是“切片切圖”，這種切圖方式比較適合形狀規則的jpg格式的大圖。

一.圖層切圖：

1.打開你的Photoshop，點擊選擇工具，將右上角的自動選擇勾上，選擇為圖層，為下圖：

2.用鼠標左擊某一個圖層，這裏我選擇了psd設計圖中的企業logo新天傑股份。

3.ps幫我們自動定位到了該圖層所在的位置

4.然後右擊圖層12，將圖層轉換為智能對象，至於為什麽要轉換為智能對象，大家可以參考這篇文章：http://www.jianshu.com/p/73bee622017f。

5.選擇選框工具，將你要切的圖層圈起來：

6.接著按ctrl+c復制，再按ctrl+n新建，註意背景顏色設置為透明：

7.點擊確定，再按ctrl+v粘貼，我們就得到要切的圖層了：

8.再按ctrl+shift+alt+s保存，記住背景圖存為PNG24格式：

9.存儲到我們要存的文件夾下，就大功告成了，是不是很快，下面我們介紹切片切圖，和慕課網的大同小異。

二。切片切圖：

1.拉輔助線，如下：

2.選擇切片工具，將我們要切的所有圖片區域，用切片工具選中：

3.按住ctrl+alt+shift+s保存，保存的時候註意，保存為JPEG格式，選擇為保存所有用戶切片，這樣子切出來的才是我們想要的圖片：

4.保存之後就完工了，切片切圖的方法很方便，但是註意它只能切出形狀規則的圖片。

兩種快速切圖方式