CSS懶加載是一種優化網頁性能的技術，它能夠延遲加載圖片、視頻、音頻等媒體資源，減少頁面加載時間，提高用戶體驗。下面我們來看一下CSS懶加載怎么實現。

首先，我們需要在HTML文件中添加一個占位元素，比如一個空的div，圖片的src屬性先設置為占位圖。

img {
width: 100%;
height: auto;
background-color: #f2f2f2; //占位圖顏色
}

然后，在CSS文件中添加如下代碼：

.img-placeholder {
width: 100%;
padding-top: 75%; //按比例設置背景圖高度
background-image: url(實際圖片的地址);
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
}
.img-placeholder.loaded {
background-image: none;
}

這段代碼中，我們把圖片的src屬性設置為一張占位圖，然后在CSS中使用background-image屬性加載實際圖片。padding-top的值根據實際情況來設定。當圖片加載完成后，我們使用JavaScript動態添加一個class名loaded，將background-image設置為none，這樣占位元素就會被實際圖片所替換。

最后，我們可以加上過渡效果，使圖片的加載更加平滑和自然：

.img-placeholder {
transition: background 0.5s ease;
}
.img-placeholder.loaded {
background-image: none;
}

這樣，我們就實現了CSS懶加載。當用戶滾動到頁面中需要加載的圖片區域時，圖片會被延遲加載，加載完成后替換掉占位元素。