CSS可以為網頁添加各種各樣的效果，包括放大縮小。其中一種比較常見的做法是使用CSS將圖像畫上去，然后通過設置鼠標事件實現放大。

.image{
position:relative;
width:300px; 
height:200px;
}
.image:after{
content:"";
position:absolute;
top:0;
left:0; 
right:0;
bottom:0;
background:url("yourimage.jpg") no-repeat;
opacity:0.5;
z-index:1;
}
.image:hover:after{
transform:scale(2);
opacity:1;
}

上面的代碼中，首先我們創建一個容器，它的寬度和高度分別為300像素和200像素，然后為容器添加一個:before偽元素。偽元素的內容設為空，其定位為絕對定位。然后，我們將圖片路徑指向:after的背景并將其位置設為0。使用opacity屬性來讓圖片看起來半透明，而z-index屬性將相對定位設為1。當鼠標懸停在容器上時，我們使用:hover偽類選擇器來將圖片通過transform:scale（）擴大兩倍。

這樣，我們就可以通過CSS實現一個圖像縮放效果。該方法不僅實現簡單，而且完全由CSS實現，不需要使用JavaScript。