在前端開發中，我們經常會遇到圖片放大縮小的問題。有時候，我們不希望圖片在不同尺寸的屏幕上變形或模糊，而是希望圖片保持原始尺寸，或者等比例縮放。這時候，我們可以使用 CSS 來實現。

首先，讓我們來看看如何讓圖片保持原始尺寸：

img {
max-width: 100%;
height: auto;
}

這段 CSS 代碼將設置圖片的最大寬度為父容器寬度的 100%，同時高度自動調整，以保持原始寬高比。這樣就可以確保圖片在不同尺寸的屏幕上不會變形。直接將 max-width 設置為 100% 是不夠的，因為如果圖片本身就很小，那么一旦放到較大的屏幕上，它就會模糊或變形。

如果想要等比例縮放圖片，可以使用以下代碼：

img {
max-width: 100%;
height: auto;
}

在這段 CSS 代碼中，我們使用了 object-fit 屬性。object-fit 屬性用于指定元素應當如何適應其父容器，可以設置為 "fill"、"contain"、"cover"、"none" 和 "scale-down" 等值。我們將其設置為 "cover"，意思是縮放圖片以完全覆蓋其父容器，可能會導致圖片被裁剪。然后，我們將 overflow 屬性設置為 "hidden"，以隱藏超出容器的部分。

在實際開發中，可以根據具體情況來選擇適合的方案，從而確保圖片在不同尺寸的屏幕上呈現出最佳的效果。