CSS让图片不失真自适应是网页设计中一个重要的方面。当我们网页上添加了图片后，我们需要确保图片大小在不失真的情况下适应不同的屏幕尺寸，这样才能让网站在各种设备上都能够正常显示。

img {
max-width: 100%;
height: auto;
}

上述CSS代码的作用是将图片的最大宽度设置为100%，同时高度设置为自动，这样图片就会根据其父元素的宽度自动缩放。

在某些情况下，我们可能需要将图片完全填充父元素，以免出现空白边缘。使用CSS的object-fit属性可以帮助我们解决这个问题。

img {
object-fit: cover;
width: 100%;
height: 100%;
}

上述代码中，object-fit: cover的作用是将图片拉伸以填充其整个父元素。width和height都设置为100%，以确保图片完全填充父元素。

如果我们希望创建一个缩略图，我们可以使用CSS的background-size属性：

.thumbnail {
background-image: url("img.jpg");
background-size: cover;
width: 200px;
height: 200px;
}

上述代码中，我们为含有.thumbnail类的div元素设置背景图像为img.jpg，然后设置其大小为200px × 200px。background-size: cover的作用同样是将图片完全填充div元素。

总之，使用CSS让图片不失真自适应是一个很重要的技巧，在网页设计中非常实用。我们可以根据需要采用不同的方法，确保图片在各种屏幕上都呈现出最佳效果。