CSS как правильно масштабировать бэкграунд?

Question

[DavidHNM]

Всем привет, сразу хочу сказать, что я чайник в этом)) Написал такую строку с бэкграундом:

$('body').css('background-image','url("http://cs1.imwox.com/o/56/37/5637435c4bcb65aed58744f24c8adaea.png")').css('background-position','top').css('background-size','cover');

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

Answer 1

[Владимир]

https://developer.mozilla.org/ru/docs/Web/CSS/back...
И там же остальные свойства которые к бекграунду относятся

Answer 2

[Андрей]

background-repeat: no-repeat;

Можно переписать вот так

$('body').css({
	'background-image': 'url("http://cs1.imwox.com/o/56/37/5637435c4bcb65aed58744f24c8adaea.png")',
	'background-position': 'top',
	'background-size': 'cover',
	'background-repeat': 'no-repeat'
});

Comments

[DavidHNM]

Спасибо большое) Только не могу понять, как сделать так, чтобы изображение адаптировалось к разрешению дисплея? Например смотрю на мониторе с разрешением 1920х1080 (изображение имеет такой же размер), но когда смотрю на другом мониторе с разрешением 2460x1440, то изображение маленькое и бока заполняются черной рамкой. Нужно как то установить адаптацию к разрешению)) вообще не могу понять как это сделать... Заранее большое вам спасибо))

[Андрей]

DavidHNM, Ничего не понятно, скинь ссылку на пример какого поведения хочешь добиться
или накидай тут https://codepen.io/begprod/pen/abbQNQB

[Sagrana]

DavidHNM,
'background-size': 'cover',
как раз про это.

https://webref.ru/css/background-size