Есть ли способ изменить размер изображения на основе разрешения экрана без использования JavaScript?

Question

Я планирую использовать изображение большого баннера на своем веб-сайте (976X450). Теперь в мониторах с более высоким разрешением изображение должно растягиваться, чтобы занимать пространство.Есть ли способ сделать это без использования разных изображений для разного разрешения?

Answer 1

Просто начните с определения размеров экрана и продолжайте оттуда:

var width = screen.width;
var height = screen.height;

var img = document.getElementById(image_id);

img.height = img.height * width / img.width;
img.width = width;

Обновление

Использовать CSS:

img#in_question { width: 100% }

Answer 2

#HeaderImage {
   height: 20%;
   width: 100%;
   background-repeat:repeat-x;

}