TexturePacker是一款把若干資源圖片拼接為一張大圖的工具。網(wǎng)頁設(shè)計(jì)師前臺(tái)制作css的時(shí)候，為了提高載入速度，往往把很多小圖拼接成一張大圖，一次載入，減少I/O，提高速度。這個(gè)好懂吧。

所以不管怎么樣，“拼大圖”這個(gè)流程不可少。小編推薦用TexturePacker，拼圖更專業(yè)。

TexturePacker這個(gè)詞從字面來說就是Texture（紋理） + Packer（打包）。當(dāng)然TexturePacker的功能遠(yuǎn)遠(yuǎn)不止這些，你還可以用它來生成程序所需的框架，如Cocos2d，Corona(TM) SDK ，Gideros ，Sparrow ，LibGDX，LimeJS 和Moai等。

軟件名稱：TexturePacker(圖片合成軟件) v4.6.1 英文免費(fèi)安裝版 64位(附使用教程)軟件大小：33.9MB更新時(shí)間：2018-01-04

軟件名稱：texturepacker(圖片打包工具) 3.0.9 安裝特別版軟件大小：43MB更新時(shí)間：2015-08-31

軟件名稱：TexturePacker(拼圖工具) v4.3.1 官方免費(fèi)安裝版軟件大小：24.1MB更新時(shí)間：2017-11-25

CSS sprites是TexturePacker一大功能，你只要將所有網(wǎng)頁小圖片添加到TexturePacker，然后設(shè)置文件導(dǎo)出格式為css，即可快速生成一張整合后的圖片和css文件，這對網(wǎng)頁前端設(shè)計(jì)師來說是不可多得的高效率工具。

什么是CSS sprites：

先來簡單介紹一下CSS sprites。眾所周知，我們在設(shè)計(jì)網(wǎng)頁時(shí)，會(huì)有很多很多的網(wǎng)頁小元素，例如導(dǎo)航按鈕，社交圖標(biāo)，網(wǎng)站背景圖等等。一般情況下，這些圖片都是單獨(dú)形式存在的，對于每一張圖片，在網(wǎng)頁加載時(shí)都屬于獨(dú)立的http請求。但使用CSS sprites，則會(huì)將所有的小圖片整合到一張圖片中，網(wǎng)頁加載只需要對一張圖片進(jìn)行請求，CSS再通過坐標(biāo)的形式定位每一個(gè)小圖片顯示出來。這樣有什么好處呢，最大的好處是，大大減少http請求數(shù)，提高網(wǎng)頁加載速度。

TexturePacker神馬優(yōu)點(diǎn)：

TexturePacker有windows版。

TexturePacker有免費(fèi)功能限制版。（你若要求不太高，TexturePacker夠你用）

TexturePacker支持pvr格式。

TexturePacker支持命令行集成。

TexturePacker的兄弟軟件PhysicsEditor同樣是很好的物理建模工具。

TexturePacker怎么用？

1、打開TexturePacker

2、我的圖片資源存放在F:/_data/vPuzzle/resource.work，如果你喜歡，你可以把整個(gè)文件夾拖到右邊的①區(qū)，下圖是拖進(jìn)去以后的模樣。

3、但是往往我們不想一股腦把所有圖片合在一張超大的圖中，所以我個(gè)人比較喜歡手動(dòng)添加圖片，這樣便于控制。