Данная статья научит как пропорционально растянуть изображение до ширины или высоты блока
Допустим у Вас есть изображение размером 200*200px. Чтобы его пропорцирнально растянуть по ширине или высоте необходимо сделать 2 действия.
1. Добавить стили в ваш файл .css
.container {
width: 300px;
height: 200px;
border: 1px solid #000;
overflow: hidden;
text-align: center;
}
img {
width: 100%;
height: 100%;
object-fit: contain;
}
2. Присвоить имена стилей к вашему блоку
<div class="container">
<img src="ссылка на картинку" alt="" />
</div>
<div class="container">
<img src="ссылка на картинку" alt="" />
</div>