在網站設計中，圖片的使用很重要。有時候需要縮小圖片來適應頁面布局，但是縮小后的圖片位置可能會偏移。本文將介紹如何使用CSS讓縮小后的圖片居中顯示。

img {
max-width: 100%; /*最大寬度為父元素寬度*/
height: auto; /*高度自動調整*/
display: block; /*讓圖片轉為塊級元素方便操作*/
margin: auto; /*左右居中*/
}

上述CSS代碼中，max-width和height是讓圖片自適應父元素寬高比例的屬性。margin:auto是讓圖片左右居中。

在HTML中，可以把圖片放在div或者其他塊級元素中，這樣可以控制圖片的大小和邊距。

<div style="width: 300px; margin: auto;">
<img src="example.jpg" alt="example image">
</div>

在上述代碼中，把圖片放在了寬度為300px的div中，并設置margin為auto，這樣就能在頁面上水平居中顯示圖片。

總的來說，讓縮小后的圖片居中顯示需要使用CSS的最大寬度、高度自適應和margin屬性。同時，放置圖片的容器元素也需要設置寬度和margin屬性來讓圖片水平居中。