CSS中的精靈圖是一種將多個小圖標合并成一張大圖的技術。這種技術的主要目的是減少瀏覽器下載小圖標時的HTTP請求，從而提高頁面加載速度。

在CSS中，我們可以使用兩個關鍵屬性來操作精靈圖，它們分別是background-position和background-size。

.sprite {
background-image: url("sprite.png");
background-position: -20px -40px;
background-size: 200px 150px;
}

其中，background-position屬性是用來控制精靈圖的位置，它的值需要指定一個負數的x和y坐標，代表著我們需要顯示精靈圖中的哪一個小圖標。這個值的計算方式為：當前小圖標的左上角到精靈圖的左上角的距離。例如，上述代碼中的坐標為-20px -40px，代表著我們需要顯示精靈圖中的第一個小圖標，因為它距離精靈圖的左上角是20px和40px。

而background-size屬性則是用來控制精靈圖的大小，它的值需要指定精靈圖的總寬度和總高度，以便瀏覽器能夠正確地計算出每一個小圖標的尺寸。在上述代碼中，我們指定精靈圖的總寬度為200px，總高度為150px。

通過這兩個屬性的組合，我們可以輕松地在頁面中顯示任意一個小圖標，而不需要再次向服務器發送HTTP請求。這種技術在Web開發中非常常見，尤其是在制作移動端網頁時更是必須掌握的技能。