如何使雪碧

ive使用在線srpite服務http://spritegen.website-performance.org/但我想知道如何讓他們自己。如何使雪碧

我該如何保存圖像，它應該是如此之小，但當我的網站上使用它出來正常大小？

2011-05-11 knowzero

精靈並不是將圖像本身變小，而是通過將幾個圖像打包成一個來減少文件大小。

看看Yahoo's icon sprite。請注意，他們將所有部分圖標垂直堆疊在一個大圖像中。然後，他們使用CSS來定位背景，以僅顯示精靈圖像的小型窗口，因此只顯示圖標。

最後，你怎麼安排你的精靈是由你決定的。檢查Amazon's sprite的底部。

無論哪種方式，希望這可以幫助您更好地瞭解精靈的概念。

2011-05-11 14:01:02

歡迎來到90年代的遊戲開發。 – acron 2011-05-11 14:02:56

謝謝！所以我在哪裏可以找到關於減小文件大小的信息。當我點擊在網上保存的Photoshop我得到所有這些選項。任何好的文章來解釋我需要做什麼？ – knowzero 2011-05-13 13:30:22

CSS精靈是降低數字圖像製作的網站引用資源的HTTP請求的方式。圖像在定義的X和Y coorindates中合併爲一個較大的圖像。已將此生成的圖像分配給相關頁面元素後， background-position CSS屬性可以使用將可見區域轉換爲所需的組件圖像。

所以沒有什麼不可思議的：你只需要用你最喜歡的圖形工具將所有的圖片打包成一個巨大的圖像，並將它們作爲CSS背景插入。看看這個CSS精靈谷歌：

Google CSS Sprite

2011-05-11 14:06:21

回答