How to change the background image according to the screen size

To change anything according to the user’s screen, devices, desktop, etc. you have to use the MediaQueries.

It is best that you read the .

Always remember to maintain a strategy, since it is the most recommended for the organization of CSS rules.

This code is enough:

body { background-image(background-image.jpg) } @media(min-width: 680px) { body { background-image(tablet-background-image.jpg) } } @media(min-width: 1080px) { body { background-image(desktop-background-image.jpg) } }