Для этого рассмотрим 2 разных метода, где можно сделать идеальное фоновое изображение для полной страницы. Для того, чтоб корректно изменить размер фонового изображения, чтоб все было пропорционально, то здесь подключаем CSS. Безусловно можем сделать исключительно через CSS благодаря background-size свойству на CSS3.
Также задействуем html элемент, где лучше чем body, так как он всегда, по крайней мере идет корректно по всем сторонам браузера. А значит выставляем фиксированный и центрированный фоновый рисунок, затем корректируем его размер, где задействуем background-size.
Код
html {
background: url(Ссылка на фон страницы) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
Один из довольно простых способов справиться с этим - поместить встроенное изображение на страницу, зафиксировать его в левом верхнем углу и задать минимальную ширину и минимальную высоту 100%, сохранив соотношение сторон.
HTML
Код
<img src="Ссылка на фон" id="nudeklos" alt="">
CSS
Код
#nudeklos {
position: fixed;
top: 0;
left: 0;
/* Сохранить соотношение сторон */
min-width: 100%;
min-height: 100%;
}
Это не центрирует изображение, но довольно распространенное способ. Итак, мы можем это исправить, обернув изображение в div. Этот div мы сделаем в два раза больше окна браузера. Затем изображение будет размещено, сохраняя его пропорции и закрывая видимое окно браузера и мертвую точку этого.
HTML
Код
<div id="kedapedonsab">
<img src="Ссылка на фон" alt="">
</div>
CSS
Код
#kedapedonsab {
position: fixed;
top: -50%;
left: -50%;
width: 200%;
height: 200%;
}
#kedapedonsab img {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
min-width: 50%;
min-height: 50%;
}
