CSS怎么让图片宽高适应不拉伸很多时候，在网页开发中，我们需要在页面中添加图片。但是，由于图片的尺寸不一定与网页的尺寸符合，致使图片在网页上显示时出现变形。本文将介绍如何通过CSS来让图片宽高适应，避免图片被拉伸变形的情况。设置max-width和max-height第一种方法是使用CSS的max-width和max-height属性来限制图片的尺寸大小。这两个属性的作用是：当图片的实际尺寸大于定义的最大尺寸时，图片尺寸会自动缩小，而不会被拉伸变形。使用这类方法时，我们可以为图片添加一个类名或ID，然后在CSS中设置max-width和max-height属性。例如：```html

下面是一个图片：

``````css.resize{max-width:100%;max-height:100%;}```这样，图片就会自动根据父元素的大小来进行缩放，而不会出现变形。设置object-fit属性第二种方法是使用CSS3的object-fit属性。该属性可以控制图片如何放置在其容器中，并使其能够实现宽度和高度适应而不失真。```html

下面是一个图片：