在網頁設計中，頁面載入速度一直是一個很重要的因素。CSS圖標合并是一種優化網站速度的方法之一。本文將介紹什么是CSS圖標合并，以及如何使用它來優化網站性能。 一、什么是CSS圖標合并？ CSS圖標合并是將多個小圖標合并成一張大圖，通過CSS樣式控制顯示小圖標，以達到減少HTTP請求次數，優化網站速度的效果。 二、如何進行CSS圖標合并？ 1、收集多個小圖標 首先，需要將多個小圖標收集起來，準備合并成一張大圖。這里需要注意的是，多個小圖標的大小最好相同，方便后面的合并。 2、創建一張大圖 接著，需要使用Photoshop、Sketch等軟件創建一張大圖，將多個小圖標拼接在一起。需要注意的是，需要使用CSS精靈技術，將圖標對齊。 3、修改CSS樣式 最后，需要在CSS樣式中修改類名和路徑，使其讀取合并后的大圖。同時，需要通過CSS樣式的background-position屬性控制具體顯示那個小圖標。可以通過pre標簽來展示相關代碼： .icon{ display: inline-block; background-image: url(img/sprites.png); } .icon-home{ width: 30px; height: 30px; background-position: -10px -10px; } .icon-search{ width: 30px; height: 30px; background-position: -50px -10px; } 以上代碼中，.icon代表該類名對應的圖標，background-image屬性指定樣式讀取的大圖路徑，background-position屬性指定該類對應的小圖標在大圖中的位置。 三、總結 通過CSS圖標合并，可以減少HTTP請求次數，優化網站速度。需要注意的是，多個小圖標大小最好相同，CSS樣式對應精靈技術對齊。通過以上代碼，我們可以進行代碼實現。