在網頁設計中，居中對齊的圖片是很常見的，但是要讓圖片居中并不是那么容易，下面我們來看看在CSS中如何實現圖片居中。

首先，需要確定圖片的包含框的寬度和高度，然后再使用CSS實現圖片居中對齊。

.container {
width: 500px;
height: 500px;
display: flex;
justify-content: center;
align-items: center;
}
img {
max-width: 100%;
max-height: 100%;
}

上面的代碼中，我們使用了flexbox布局來讓圖片居中，具體來說，我們使用了display: flex來使得.container元素成為一個flex容器，然后使用justify-content和align-items來讓子元素居中對齊。由于img元素可能會超出其包含框，我們使用了max-width和max-height來限制其大小。

另一種方法是使用絕對定位和負值來實現圖片居中。

.container {
width: 500px;
height: 500px;
position: relative;
}
img {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

上面的代碼中，我們使用相對定位將.container元素設為參照元素，然后使用絕對定位將img元素定位到.container元素的中央。transform屬性實現了負值移動，使得圖片居中。

以上就是兩種常用的方法，可以根據具體情況選擇使用哪種方法。