今天我們來講一下CSS精靈圖的案例，首先先介紹一下什么是CSS精靈圖。CSS精靈圖是指將多個小圖片合并到一張大圖中，然后利用CSS的background-position屬性來定位到需要的小圖片，這種方法可以減少請求次數，提高網站性能。

.sprite{
background-image:url('sprite.png');
background-repeat:no-repeat;
}
.logo{
width:100px;
height:100px;
background-position:-50px 0;
}
.button{
width:60px;
height:20px;
background-position:-10px -50px;
}

上面的代碼展示了一個CSS精靈圖的例子，首先定義一個sprite類來引入所有小圖片的合并圖，然后分別定義logo和button類來定位到需要的小圖片，這里用負值來控制定位位置。

使用CSS精靈圖可以減少HTTP請求，提高網站性能，但是也有一些需要注意的地方，如更新后需要重新生成一張合并圖，如果小圖片的大小不一致可能會導致排版問題等等，所以需要謹慎使用。

總之，CSS精靈圖可以提高網站性能，但是需要在實際應用中靈活運用。