簡單介紹下:CSS 圖片拼合 (CSS sprites) 可有效降低圖片檔案的 HTTP 連接請求數. 多個圖片將以一定間距合併為一個大圖片檔案. 頁面中使用這些圖片的元素將利用 background-position 這一CSS 屬性來顯示拼合圖片中的指定位置。這項技術可有效提升網站效能, 尤其是網頁上有眾多小圖片時, 如許多選單欄圖示.
這裡有一個Realazy的CSS Sprites技術詳細介紹,CSS Sprites被我生生譯成了CSS圖片拼合,希望大家不要抗議:P 有更好的譯法歡迎大家提出 ^^
下面給大家介紹個CSS圖片拼合生成器,將眾多小圖片打包成ZIP文件,上傳上去,即可自動生成拼合後的圖片和CSS規則,還可以自訂背景色,是否背景透明,CSS選擇器的前後綴等,功能強大^ ^
呃,為什麼要介紹呢?因為中文介面是我翻譯的,有任何更好的翻譯建議請提出。
翻譯文字可以從Google Code上 http://cssspritegeneratorchinese.googlecode.com/svn/ 位置檢出。
http://spritegen.website-performance.org/?action=home&lang=cn