Как расположить изображение в поле так, чтобы оно точно подходило по ширине или высоте, в зависимости от того, что меньше?

Я хочу загрузить несколько фотографий с сервера и отобразить каждую из них в собственном поле, чтобы поле было заполнено, а изображение было центрировано (, а не растянуто ), если он большой. Могу ли я добиться этого, например, с помощью CSS, не зная размера каждого изображения? Может быть, с максимальной -шириной или около того?

Вот пример того, что я хочу: