How is this done or what is called? Example- http://vse-gotovo.com/

When you go to the site there for the whole background of the window I have their picture

    2 answers 2

    body { background-image: url(https://compass-ssl.xbox.com/assets/12/02/120203e0-f7d1-4731-9a6c-be3c458c6ce9.jpg?n=Resident-Evil-2_GLP-Page-Hero-1084_1920x600.jpg); background-size: cover; background-repeat: no-repeat; background-position-x: center; background-position-y: center; background-attachment: fixed; min-height: 100vh; }

    Here we indicate the source of the image link or the path in brackets.

     background-image: url(https://compass-ssl.xbox.com/assets/12/02/120203e0-f7d1-4731-9a6c-be3c458c6ce9.jpg?n=Resident-Evil-2_GLP-Page-Hero-1084_1920x600.jpg);

    Here we specify the size. cover - the picture is scaled to full screen / block keeping its proportions.

     background-size: cover;

    Here we specify repeated or not.

     background-repeat: no-repeat;

    Here we specify the alignment of X and Y. In this case, indicated center. But, you can specify in%.

     background-position-x: center; background-position-y: center;

    We fix

     background-attachment: fixed; 

       html, body { margin: 0; padding: 0; } .block { height: 100vh; background-image: url("http://placeimg.com/500/300/an"); background-size: cover; background-attachment: fixed; } .content { margin: 0 auto; width: 50%; min-height: 200px; background: rgba(0, 0, 0, 0.5); } .block1 {min-height: 400px;} 
       <div class="block"> <div class="content"> </div> </div> <div class="block1">следующий блок</div>