網站制作過程中當然少不了按鈕的存在，很多按鈕都是普通的圖片，沒有一點創新，這樣的網站未免顯得有點枯燥，我們為什么不使用CSS翻滾按鈕呢？一來可以減少標記開發速度與效率，二來可以有效提高按鈕的三維效果。下面筆者為大家提供兩種實現CSS翻滾按鈕的方法：
　　一、沒有延遲的翻滾──不應用預先載進圖像
　　為了實現按鈕的翻滾效果，在網站制作的時候要建立三個獨立按鈕：分別為初始按鈕、懸停按鈕以及點擊按鈕（如圖一）。 其次，聯合所有三個按鈕外表圖像而成為單一圖像文件而得以實現（如圖二），這里注意：不需要為每一翻滾狀態指定不同的背景圖像文件，你指定的是合成圖像的地位偏移量。超大圖像與背景圖像地位偏移的聯合應用可以使你有選擇性地為每一按鈕狀態顯示圖像的不同部分。按鈕文本的CSS框尺寸決定著顯示在瀏覽器的背景圖像的百分比。

圖一
 

圖二

　　友情提示：對于這一技巧，你必需明白按鈕外表的確實程度和垂直尺寸，并準確應用這些尺寸，才干建立圖像文件和按鈕的CSS規矩。還有滿足不同的翻滾狀態的可交替應用的按鈕圖像，而其中不需要任何圖像文件的載進。
　　二、預先載進的
　　預先載進圖像技巧已被人熟知，而且也被人們所接收。用戶拜訪的第一二分鐘非常關鍵，所以你無論如何都必需使得網頁的初始化更加快速。應用翻滾按鈕可以減少圖像預先載進的時間，當然假如預先載進能夠打消，頁面的初始化則更加快速。具體實現方法如下：
　　1、建立一些可互相替換的按鈕圖像，人后構建CSS規矩，不同的翻滾狀態要轉變不同的背景圖像。這種實現方法可以給你帶來更多動態的設計，但當瀏覽器首次載進圖像文件時，這些可替換的應用銨鈕圖像會呈現延遲現象。
　　2、網站制作時指定CSS文本的翻滾后果，并應用所有翻滾狀態的雷同按鈕外形圖像。這樣的方法可以給你網站帶來快速、簡潔的翻滾后果，但是在一定程度上限制了網站開發選項。