CSS替換img是一種常見的優化網站性能的方法。它可以避免加載大量的圖片和減少服務器響應的時間，同時還能提高頁面的加載速度。

.replace-img {
display: block;
background: url("placeholder.jpg") no-repeat center center;
background-size: contain;
width: 300px;
height: 200px;
}

首先，我們需要創建一個占位圖片，它將成為CSS替換圖片的背景。接著，我們在CSS文件中定義一個類名為“replace-img”的樣式，它將成為我們需要替換的圖片元素的父元素。

注意，我們將這個元素的display屬性設置為“block”，以便讓它占據一行。同時，我們將它的背景圖片設置為占位圖片，并使用“center center”屬性將它水平垂直居中。然后，我們使用“background-size: contain”屬性確保圖片盡可能符合元素的大小。

最后，我們為這個元素設置它的寬度和高度。由于我們的占位圖片是300x200像素，我們將元素的大小也設置為300x200像素，以便適應圖片的大小。

現在我們可以使用這個“replace-img”類來替換我們要替換的圖片了。只需要將圖片元素的src屬性去掉，然后把它加上“replace-img”類就可以了。

<img src="example.jpg" class="replace-img">

由于我們已經在CSS中定義了“replace-img”類，所以當頁面加載時，瀏覽器將使用占位圖片作為背景，而不會加載原始圖片。這樣就可以大大減少加載時間，并提高頁面的性能了。同時，如果原始圖片有改動，我們只需要更改占位圖片就可以實現替換。