Создание изображений с учетом CSS очень просто. Вместо применения абсолютной ширины к элементу: img { width: 720px; } Вы можете использовать:
img {Свойство
max-width: 100%;
display: block;
высота: авто;
}
max-width 100% масштабирует изображение в соответствии с шириной его контейнера, но изображение не будет растягиваться шире его первоначальной ширины. Установка свойства display для блокировки изменяет изображение с встроенного элемента (по умолчанию) на элемент блока в его собственной строке. Свойство height автоматически сохраняет исходное соотношение сторон изображения.Добавьте правила стиля для тега img чтобы он реагировал на размер его контейнера. Он должен отображаться как элемент уровня блока, он должен соответствовать полной ширине его контейнера без растягивания, и он должен сохранять исходное соотношение сторон.