How to style an image with unknown proportions?

Question

css

If, say, you need to arrange an arbitrary number of pictures with proportions unknown in advance, and moreover, the proportions will be guaranteed to be different. And the grid is naturally with fixed cell sizes.
How can I make the images display without distorting the proportions? And at the same time, observe the rule that the tag must have the attributes of width and height.
I myself suffered here for a couple of days, but it only works fine if the width and height attributes are not specified, but set in CSS max-width , max-height. But here it turns out that the page is not valid.

Answer 1

attributes-attributes, but no one bothers to set the width and height in styles

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

so it will stretch to the full width of the container, but not distorted in height
Or should it also be adjusted in height?

Answer 2

put the pictures in a fixed width div
and the pictures

img{
max-width:100%;
}

Answer 3

object-fit:cover will solve all your problems