CSS 是一種用于設計網站樣式的語言，它可以通過一些技巧制作出一些非常酷的效果，比如讓圖片來回放大縮小。下面我們來介紹一下如何實現這個效果。

/* HTML 代碼 */
<div class="container">
<img src="image.jpg" alt="圖片">
</div>
/* CSS 代碼 */
.container {
position: relative;
width: 400px;
height: 400px;
overflow: hidden;
}
img {
position: absolute;
top: calc(50% - 400px/2);
left: calc(50% - 400px/2);
height: 400px;
width: auto;
animation: zoom 10s infinite alternate;
}
@keyframes zoom {
0% {transform: scale(1);}
50% {transform: scale(2);}
100% {transform: scale(1);}
}

首先我們需要在 HTML 中創建一個容器，并在其中放置一個圖片。容器需要設置寬度和高度，并使用 overflow: hidden 隱藏溢出部分。圖片要使用絕對定位，因為我們需要將其放置在容器中心并居中。

在 CSS 中，我們使用關鍵幀動畫來使圖片不斷縮放。關鍵幀定義了三個階段，分別是開始狀態（0%）、中間狀態（50%）和結束狀態（100%）。在這里，起始狀態中，圖片的大小為原來的大小（即縮放比例為 1），中間狀態將圖片縮放為原來的兩倍，結束狀態將圖片縮放回原來的大小。

需要注意的是，我們在容器上使用了相對定位，也就是 position: relative，而圖片使用了絕對定位，也就是 position: absolute。這是因為我們想讓圖片在容器中心居中，所以設置了 top 和 left 為 50%，并使用 calc 計算出具體的偏移值。

通過以上代碼，就能實現圖片的來回放大縮小的效果了。