css如可将图片按比例

CSS中可以通过设置图片的宽度和高度来控制图片的大小，但如果直接设置宽度和高度值会导致图片变形，这时候就需要按比例设置宽度和高度了。

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

这段CSS代码可以让图片宽度自适应其所在容器的宽度，并按比例调整高度。其中，width属性的值为100%，表示图片宽度等于其所在容器的宽度；height属性的值为auto，表示图片高度按照宽度比例自动调整。这样做可以保证图片不会变形。

另外，我们也可以通过固定宽度和设置max-height属性来控制图片的大小。

img{
    width:300px;
    max-height:500px;
}

这段CSS代码可以让图片宽度固定为300px，如果图片高度超过500px，则高度只显示500px，但图片宽度不会失真。这种方法可以保证图片的尺寸相对固定，并且不会失真。