合成雪碧圖Sprite工具
1.國外的在線合成工具：http://csssprites.com/
選擇需要合並的文件----設置option選項（包括：元素的間距，排列方式，背景顏色，邊框）-----點擊generate按鈕生成
優點：自動合成，可以設置屬性。缺點：文件必須一個個地去選擇導入，不能夠批量導入。
2.騰訊的雪碧圖在線生成工具http://alloyteam.github.io/gopng/
個人覺得操作不太方便，好像有些功能失靈了，相關操作說明如下：https://github.com/AlloyTeam/gopng
3.SpriteMe
這是一個國外的在線工具，它能夠幫你分析頁面中有哪些地方可以進行雪碧圖的優化，並且能夠生成對應的雪碧圖。http://spriteme.org/
使用方法：
打開連接http://spriteme.org/，看到下圖內容，然后把SpriteMe拖拽到你的瀏覽器書簽中（就是要你保存為書簽嘛）
然后隨便打開一個頁面。例如打開360導航頁面吧，http://www.3600.com/?src=lm&ls=n020f881c88。然后在該頁面上打開你的書簽找到SpriteMe並點擊它。
你會看到生成這樣一個結果。這是SpriteMe的檢測結果，對這個頁面給出的雪碧圖優化建議。鼠標移到每個鏈接上都能看到自動合成的效果，點擊右邊的make sprite可以馬上生成雪碧圖。點擊export css可以生成雪碧圖的樣式。
4.如果你是寫sass的話，那么可以安裝compass。使用compass來自動把切片合成雪碧圖並生成樣式。
5.如果你是寫sass或者less的話，比較建議使用grunt自動工具來一體化地編譯、壓縮、合並文件，而且能夠自動合成雪碧圖、生成樣式文件。
使用grunt來合成雪碧圖需要使用grunt-sprite這個插件（好像在github上也有另一個類似的插件）,同時需要安裝Graphics Magick(gm) 和 PhantomJS 兩個依賴。
至於如何使用，這里有個詳細的說明：https://github.com/hellometers/grunt-sprite