當我們需要在網頁中展示圖片時，有時候需要將圖片固定在中間位置，以便更好地展示圖片。那么如何使用CSS實現圖片的居中固定呢？

img {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}

上面的代碼使用了position: absolute屬性，將圖片的位置設置為絕對定位，這樣可以讓圖片脫離文檔流。接著使用top: 50%和left: 50%屬性將圖片放置在頁面中心位置。然而此時圖片的位置只是相對于頁面左上角的位置，不是我們所期望的中間位置。因此我們需要使用transform: translate(-50%,-50%)來讓圖片在 X 軸、Y 軸上各向左上角移動自身寬度 50%，以實現以上目的。

這樣一來，我們就可以輕松地在網頁中實現圖片的居中固定。不僅保證了圖片的美觀度，更提高了網頁的整體視覺效果，使得網站的界面更加美觀，用戶的體驗更加愉快。