DIV+CSS效果(實現平滑投票效果等）

這種技巧的名稱叫做CSS Sprite，基本原理就是利用CSS中圖片background系列的 background-image、background-repeat、background-position等屬性實現。通過這種方式達到圖片顯示 加速的關鍵，不是降低重量，而是減少個數。在通常情況下一張圖片的傳輸時間，通常遠小於請求等待的時間。

PS：特別製作了三個CSS Sprites執行個體示範，感興趣的朋友可以看一看。

執行個體
比如google.cn現在首頁的底部導航也是用這個方式實現的。
所用圖片為：http://www.ccvita.com/wp-content/uploads/demo/css/google.gif
效果：http://www.google.cn

代碼
從網上找了好幾個示範，大家可以看下面地址的示範：CSS Sprites執行個體示範
效果一：縱向背景圖

效果二：橫向背景圖

效果三：平滑投票

 

轉自：http://www.ccvita.com/322.html#more-322