隨著移動設備的普及，越來越多的網站需要進行自適應設計。其中，圖片的自適應是一個重要的問題。當我們改變瀏覽器窗口大小或在不同設備上查看同一個頁面時，圖片大小也應該相應地適應，但是又不能失真。這就需要運用CSS技巧來實現。

/* 以下代碼可以讓圖片自適應而不失真 */
img {
max-width: 100%;  /* 圖片寬度不會超過它所在父元素的寬度 */
height: auto;  /* 圖片高度根據寬度自動調整 */
}

這段CSS代碼可以讓圖片在寬度不超過所在父元素的情況下自適應，而高度則根據寬度自動調整，從而避免了圖片失真的問題。

當然，在某些情況下，我們可能需要對某些圖片進行特殊處理。比如，我們希望在寬度不超過600像素的情況下，圖片保持100%的寬度，同時高度也根據寬度自動調整。

/* 以下代碼可以讓寬度小于600像素的圖片保持100%寬度 */
img {
max-width: 100%;  /* 圖片寬度不會超過它所在父元素的寬度 */
height: auto;  /* 圖片高度根據寬度自動調整 */
width: 100%; /* 圖片寬度等于所在父元素的寬度 */
max-width: 600px; /* 圖片寬度不超過600像素 */
 }

這段代碼可以讓寬度小于600像素的圖片保持100%的寬度，同時在超過600像素時自動適應。這對于我們在移動設備上查看網站時非常有用。

綜上所述，運用CSS技巧可以讓圖片在不同設備上自適應而不失真，從而提高網站的用戶體驗。