CSS3技術使得我們能夠將多個圖像合并成一個圖像，即所謂的CSS3精靈圖。這種技術能夠極大地提高頁面的性能，因為將多個圖像合并成一個圖像會減少HTTP請求次數。同時，也能夠使CSS樣式更加的簡化和清晰。

/* 精靈圖的CSS代碼 */
.sprite {
background-image: url(sprite.png);
background-repeat: no-repeat;
}
/* 圓圈區域 */
.circle {
background-position: -10px -10px;
width: 50px; 
height: 50px;
}
/* 方塊區域 */
.square {
background-position: -70px -10px;
width: 50px; 
height: 50px;
}
/* 三角形區域 */
.triangle {
background-position: -130px -10px;
width: 50px; 
height: 50px;
}

上面是一個CSS3精靈圖的代碼樣例，其中的.sprite類包含了整個精靈圖，而每個區域都定義了它們自己的CSS類。通過指定每個類的背景偏移來實現從精靈圖中顯示出正確的區域。

通過這種方式，我們可以只請求一個圖像，而不是三個獨立的圖像。這將極大地減少加載時間，并提高頁面的性能。