CSS 圖片已中心放大是一個非常流行的效果，可以讓您的網頁看起來更加漂亮。在這篇文章中，我們將介紹如何使用 CSS 和 HTML 來實現這個效果。

首先，我們需要在 HTML 中添加一張要被放大的圖片。我們可以使用以下代碼：

<div class="image-wrapper">
<img src="image.jpg" alt="My Image">
</div>

接下來，我們需要在 CSS 中定義圖片的樣式。我們可以使用以下代碼：

.image-wrapper {
display: flex;
justify-content: center;
align-items: center;
height: 400px;
}
img {
max-width: 100%;
max-height: 100%;
width: auto;
height: auto;
transition: all 0.2s ease-in-out;
}
img:hover {
transform: scale(1.2);
}

我們首先設置了一個包含圖片的 div 元素為 flex 容器，并把其垂直和水平居中。然后，我們使用了 CSS 中的 transition 屬性來設置圖片的動畫效果，并使用了 transform 屬性來縮放圖片。

當鼠標懸停在圖片上時，圖片會被放大到 1.2 倍大小。在這種情況下，我們使用了 CSS 中的 :hover 選擇器，以便只在鼠標懸停時觸發縮放動畫。

現在，我們已經成功地實現了一張圖片已中心放大的效果。您可以修改代碼以適應您的網頁，并探索其他的 CSS 圖片效果。