How to make a background image in the header of the site so that it looks good both at small resolutions and at large ones?

Question

css

The image should occupy the entire area of ​​the browser in width. But if a person opens a site on a 4k monitor, then where can I find such a picture ... what are the solutions for people with a higher resolution?

Answer 1

Try something like this
background-attachment: fixed;
background-image: url("../img/bcg.png");
background-position: center center;
background-repeat: no-repeat;
background-size: cover;

Answer 2

imulus.github.io/retinajs

Answer 3

Surely you have a limited maximum width of the site column (container) that contains the header, for example 1170px
It is this width that the picture corresponds to and it will not become wider. (If everything is correct)
If it falls out of the general site column and you need it (you does that suit you?), then you were offered retinajs as an option.
But usually caps have a limited width.