本期UI培訓(xùn)教程主要為大家分享常見(jiàn)的圖片格式有哪些?PS三種切圖方式!在布局頁(yè)面時(shí)，是需要對(duì)圖片部分進(jìn)行切片處理，切圖可以說(shuō)是每個(gè)前端必須掌握的基礎(chǔ)技能之一，在實(shí)際開(kāi)發(fā)中，PS切圖可以說(shuō)是最方便快捷的，PS 有很多的切圖方式：圖層切圖、切片切圖、PS 插件切圖等都是比較常用的。

　　常見(jiàn)的圖片格式：

　　1. jpg圖像格式： JPEG(.JPG)對(duì)色彩的信息保留較好，高清，顏色較多，我們產(chǎn)品類(lèi)的圖片經(jīng)常用jpg格式的

　　2. gif圖像格式：GIF格式最多只能儲(chǔ)存256色，所以通常用來(lái)顯示簡(jiǎn)單圖形及字體，但是可以保存透明背景和動(dòng)畫(huà)效果, 實(shí)際經(jīng)常用于一些圖片小動(dòng)畫(huà)效果.

　　3. png圖像格式是一種新興的網(wǎng)絡(luò)圖形格式，結(jié)合了GIF和JPEG的優(yōu)點(diǎn)，具有存儲(chǔ)形式豐富的特點(diǎn)，能夠保持透明背景. 如果想要切成背景透明的圖片,請(qǐng)選擇png格式.

　　4. PSD圖像格式PSD格式是Photoshop的專用格式，里面可以存放圖層、通道、遮罩等多種設(shè)計(jì)稿. 對(duì)我們前端人員來(lái)說(shuō),最大的優(yōu)點(diǎn),我們可以直接從上面復(fù)制文字,獲得圖片,還可以測(cè)量大小和距離.

　　圖層切圖

　　最簡(jiǎn)單的切圖方式：右擊圖層→快速導(dǎo)出為 PNG。但是很多情況下,我們需要合并圖層再導(dǎo)出:

　　1. 選中需要的圖層: 圖層菜單→合并圖層(ctrl+e)

　　2. 右擊→快速導(dǎo)出為 PNG 最好的方法是: 溝通

　　切片切圖

　　PS 有很多的切圖方式：圖層切圖、切片切圖、PS 插件切圖等。

　　1. 利用切片選中圖片

　　利用切片工具手動(dòng)劃出文件菜單

　　2. 導(dǎo)出選中的圖片

　　導(dǎo)出→存儲(chǔ)為 web 設(shè)備所用格式→選擇我們要的圖片格式→存儲(chǔ)。

　　PS 插件切圖

　　Cutterman是一款運(yùn)行在Photoshop中的插件，能夠自動(dòng)將你需要的圖層進(jìn)行輸出，以替代傳統(tǒng)的手工

　　"導(dǎo)出web所用格式" 以及使用切片工具進(jìn)行挨個(gè)切圖的繁瑣流程。

　　官網(wǎng)：http://www.cutterman.cn/zh/cutterman

　　注意：Cutterman插件要求你的PS 必須是完整版，不能是綠色版，所以大家需要安裝完整版本。

　　關(guān)于“常見(jiàn)的圖片格式有哪些?PS三種切圖方式”的內(nèi)容，上面已經(jīng)為大家做了詳細(xì)的介紹，如果您想了解更多關(guān)于千鋒教育或者UI設(shè)計(jì)的相關(guān)資料及信息，可以咨詢我們的客服小姐姐，他們會(huì)為您做詳細(xì)的解答。