在現代web設計中，圖片的自適應不變形是一個重要的問題。在不同的屏幕尺寸下，不同的圖片大小可能會導致網頁的布局問題，影響用戶的體驗。 為了解決這個問題，我們可以使用CSS來實現圖片的自適應不變形。下面我們來看一下具體的實現方法。 首先，我們需要在CSS中定義一個圖片的類，然后使用背景圖像來替代標簽。

.img{
background-size: contain;
background-position: center center;
background-repeat: no-repeat;
}

在這個CSS中，我們使用了background-size屬性來指定圖片的大小。contain表示圖片會自適應到容器的大小，但是保證圖片的比例不變。同時，我們也將背景圖像的位置設置為居中，并且不重復。 接下來，在HTML中使用標簽，但是不需要設置src屬性，只需要使用style來設置背景圖像的url即可。

下面是一個自適應不變形的圖片：

在這個例子中，我們使用了一個800x600像素的圖片作為背景圖像。但是在不同的屏幕尺寸下，圖片會自適應到容器的大小，但是保證圖片比例不變。 總的來說，使用CSS來實現圖片的自適應不變形是非常簡便和實用的。從而可以提高網站的用戶體驗和視覺效果。